با استفاده از JavaScript و عنصر canvas یک دایره ایجاد کنید که به آرامی از سمت چپ به راست حرکت کند و هنگام برخورد به لبهٔ صفحه جهت حرکتش را برگرداند.
4.0 بازدید آخرین ویرایش در 220 روز قبل ساعت 02:03 0.0
برای حل این مسئله از HTML5 Canvas و جاوااسکریپت استفاده کنید: یک دایره رسم کنید، موقعیت افقی آن را در هر فریم با مقدار سرعت بهروزرسانی کنید، قبل از هر فریم کانواس را پاک کنید و دایره را دوباره بکشید. از window.requestAnimationFrame برای انیمیشن روان بهره ببرید و با چک کردن برخورد دایره با لبهها (مقایسه مختصات و شعاع با عرض کانواس) جهت سرعت را معکوس کنید؛ تنظیم متغیرهای سرعت و شعاع سادهترین راه برای کنترل رفتار است.
1 پاسخ
جدید ترین قدیمی ترین بالاترین امتیاز پاسخ های من
در حال بارگیری...
برای ارسال پاسخ باید با حساب کاربری وارد شوید.
ورود به حساب کاربری
برای حرکت روان دایره با canvas از window.requestAnimationFrame استفاده کنید و موقعیت افقی آن را با deltaTime بهروزرسانی کنید. پیش از هر فریم کانواس را با clearRect پاک کنید و دایره را دوباره بکشید تا اثر فریمهای قبلی باقی نماند. هنگام برخورد با لبهها، جهت حرکت را با معکوس کردن سرعت یا تغییر جهت بررسی کنید و شعاع را در نظر بگیرید تا دایره از قاب خارج نشود. اگر نرخ فریم پایین است، استفاده از deltaTime به ثبات حرکت و همگامسازی با دستگاه کمک میکند.
گزارش