昨天打球打得不錯,找到手感上來兩個crossover,簡直無情。心情好了,繼續解決遺留問題。
首先,看看需要搞定哪些問題
- 加速跳躍
- 各種bug
- 碰撞檢測
(吐槽,CSDN的markdown編輯器有BUG,之前打到一半的文章,因爲我編輯了一下另一篇,文章內容都沒了,這是因爲他的HTML5存儲有問題,所有文章公用一個存儲區域)
加速跳躍
之前的跳躍太呆了,完全勻速,我玩了好久原著找感覺,發現他的方塊跳躍是有加速度的,於是先加上一個跳躍的加速度。
src="//jsrun.net/5UKKp/embedded/result,js/light/" allowfullscreen="allowfullscreen" height="600" width="100%">各種BUG
由於我之前列舉了好多問題,但由於文章丟了,我反覆調試消滅了很多BUG,我自己也想不起來有什麼了。
比如,方塊落地的一瞬間會猛的前進一小段距離;撞牆後方塊會在天上閃一下。諸如種種,都是一些小細節的參數微調,花點時間調試就可以。
碰撞檢測
這個真是難到我了,實在想不出什麼好辦法來判斷方塊撞牆。搜索了一些方法,但對我這個案例的應用性不強,最容易理解的方法是給方塊和障礙的邊加座標,但是太麻煩了了。
剛開始思考時,我給障礙加了一個輔助線,我發現勻速跳躍只有貼着線才能勉強通過。我就開始琢磨跳躍的軌跡和碰撞的關係。
3
我仔細觀察了原著,他的方塊跳躍的軌跡好像一個半圓,而這個半圓又是(障礙物高度 x 2)外接圓的軌跡,然後軌跡的半徑在外接圓的半徑的基礎上加上方塊的,就完美的解決了碰撞的問題。因爲方塊在空中轉180度,從跳躍到落地的軌跡,正好是這個外接圓的外切矩形的運動軌跡,這樣幾乎不存在方塊在空中時,邊角碰到障礙的情況。我覺得是個不錯的方法。
於是我也如法炮製,做了一個類似的,但是因爲想不出來怎麼才能跳出來半圓軌跡。這個也是有BUG的,如果仔細嘗試。暫時先做一個,日後再研究。
src="//jsrun.net/DUKKp/embedded/result,js/light/" allowfullscreen="allowfullscreen" height="600" width="100%">小結
經過慢慢修改,逐漸有一點意思了,看來CANVAS做這個也是可以的,昨天看的電影《明日世界》裏說“想象力比知識更重要”,要多想少限制自己。接下來,繼續消除bug,增加開始界面,聲音,動畫元素。