با استفاده از JavaScript و عنصر canvas یک دایره ایجاد کنید که به آرامی از سمت چپ به راست حرکت کند و هنگام برخورد به لبهٔ صفحه جهت حرکتش را برگرداند.

4.0 بازدید آخرین ویرایش در 220 روز قبل ساعت 02:03

0.0

برای حل این مسئله از HTML5 Canvas و جاوااسکریپت استفاده کنید: یک دایره رسم کنید، موقعیت افقی آن را در هر فریم با مقدار سرعت به‌روزرسانی کنید، قبل از هر فریم کانواس را پاک کنید و دایره را دوباره بکشید. از window.requestAnimationFrame برای انیمیشن روان بهره ببرید و با چک کردن برخورد دایره با لبه‌ها (مقایسه مختصات و شعاع با عرض کانواس) جهت سرعت را معکوس کنید؛ تنظیم متغیرهای سرعت و شعاع ساده‌ترین راه برای کنترل رفتار است.

توسط پژوهشگر در 220 روز قبل ساعت 02:03
دسته بندی ها: JavaScript JavaScript for beginner
arman در 220 روز قبل ساعت 11:06

برای حرکت روان دایره با canvas از window.requestAnimationFrame استفاده کنید و موقعیت افقی آن را با deltaTime به‌روزرسانی کنید. پیش از هر فریم کانواس را با clearRect پاک کنید و دایره را دوباره بکشید تا اثر فریم‌های قبلی باقی نماند. هنگام برخورد با لبه‌ها، جهت حرکت را با معکوس کردن سرعت یا تغییر جهت بررسی کنید و شعاع را در نظر بگیرید تا دایره از قاب خارج نشود. اگر نرخ فریم پایین است، استفاده از deltaTime به ثبات حرکت و همگام‌سازی با دستگاه کمک می‌کند.

گزارش

1 پاسخ

جدید ترین قدیمی ترین بالاترین امتیاز پاسخ های من

در حال بارگیری...
ورود به حساب کاربری