android--WaveView(波浪形View) 的實現記錄


背景

請假回家當伴郎,由於實在無聊,就寫下了此篇博客!!按照慣例,先上動態圖
效果圖

怎么樣!效果比較贊吧!!!

思路

當我第一次看見這個效果的時候,我的第一個想法是:如果是靜態的時候是什么樣子的!好,再來張圖
圖片
看到這兒,大家有可能想到了 這不就是sin函數嗎?對,不錯,就是sin函數!!!
那怎么能實現這張靜態圖呢?我的思路是這樣的:sin函數在我看來就是在x軸數據集合固定的時候,y軸對應數據的集合!那么x軸數據的集合是多少呢?請大家在看一下上圖!不就是view的寬度嗎!我們以每刻度為1,那么這個x軸的數據集合不就是[0,viewwidth]嗎?此時我們只要代入sin函數中不就能求得y軸數據的集合了嗎!!好大家先看下代碼:

圖片

現在求的y軸數據的之后,想要畫出那張靜態圖,就比較簡單了!其實我們只要畫viewwidth條垂直與x軸的直線就行了!那么怎么出現曲線狀態呢!其實這些直線的高度不一樣的。那這些高度是怎么求出來的呢?就是我們用一個固定高度減去剛才求的y軸的值!
接下來大家看代碼就知道了

從代碼中大家可以看到我們總共繪制了viewwidth條直線。

至此,靜態圖就已經繪制OK了!!

那么,怎么繪制動態圖?聰明的小伙伴,可能已經想到了!就是不停的變幻y軸的值就行了!相信大家已經看到,我們是把y軸的值存放到數組中的!!我們只要按照一定的規律移動數組中數據的位置就行了!那么我們該怎么移動的?

1.首先我得先定義個另外個數組用來存這些變化的數據。同時規定好了變化的量!!在這之前,大家得先了解這個函數 System.arraycopy() (不懂的,自己百度去!!)
圖

2.現在就是剩下每隔一段時間繪制啦!我們直接看整個 ondraw() 方法!

圖

最后附上所有代碼圖

講解結束!!


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM