p5.js入門教程之小球動畫示例代碼

一、運動的小球

本節將用p5.js做一個在屏幕上運動的小球。

思路是用變量記錄小球的位置，然后在draw()函數里對其做出改變，由于draw()函數會不斷地運行（頻率為FPS，默認60幀/秒），所以小球便產生了運動。

代碼如下：

二、反彈的小球

經過一段時間后，小球會移出屏幕。為了不讓小球跑到屏幕之外，我們新增一個變量用來控制速度，并在小球離開屏幕時讓速度反向。

代碼如下：

進一步，我們可以用兩個變量控制x、y方向的速度，實現小球在畫布上彈射的功能。

代碼如下：

上面是我整理給大家的，希望今后會對大家有幫助。

相關文章：

nodejs簡單讀寫excel內容的方法示例

node.js博客項目開發手記

javaScript中"=="和"==="的區別詳解

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com