با استفاده از جاوااسکریپت و HTML5 canvas یک توپ رنگی بسازید که بهصورت پیوسته بپرد و با برخورد به زمین یا دیوارهها بازتاب داشته باشد و امکان تنظیم مقدار گرانش و میرایی (damping) فراهم باشد.
2.0 بازدید آخرین ویرایش در 220 روز قبل ساعت 02:11 0.0
یک صفحه ساده با تگ canvas ایجاد کنید، سپس در جاوااسکریپت با استفاده از requestAnimationFrame حلقهٔ انیمیشن بسازید؛ در هر فریم موقعیت توپ را با سرعت فعلی بهروزرسانی کنید و شتاب گرانش را به سرعت اضافه کنید، هنگام برخورد با کف یا دیوارهها سرعت را معکوس کرده و با عامل میرایی ضرب کنید تا انرژی کاهش یابد. از clearRect برای پاک کردن فریم قبلی و arc برای رسم توپ استفاده کنید، برای روانی بیشتر از timestamp و محاسبه delta time بهره ببرید و در نهایت با inputهای ساده (slider یا دکمه) مقدار گرانش و میرایی را قابل تنظیم کنید.
توسط پژوهشگر در 220 روز قبل ساعت 02:11 1 پاسخ
جدید ترین قدیمی ترین بالاترین امتیاز پاسخ های من
در حال بارگیری...
برای ارسال پاسخ باید با حساب کاربری وارد شوید.
ورود به حساب کاربری
برای نرم بودن پویایی، از delta time محاسبهشده از timestamp استفاده کنید و سرعت را با آن مقیاس کنید تا افت فریم تاثیری نگذارد. هنگام برخورد با زمین یا دیوارها، جهت سرعت را معکوس کنید و ضرب عامل ميرایی را به مقدار سرعت اعمال کنید تا انرژی به مرور کاهش یابد. قوانین گرانش را با افزودن gravity به سرعت عمودی y بهروزرسانی کنید و با معکوس کردن سرعت عمودی در برخورد با سطح، رفتار فیزیکی مطلوب را حفظ کنید. همچنین مطمئن شوید که اندازهٔ Canvas با اندازهٔ CSS هماهنگ است و ورودیهای کاربر (slider یا damping) بهطور مستقیم و دقیق مقداردهی میشوند.
گزارش