Android自定義View實現波紋效果

時間：2017-05-27?????來源：移動互聯網學院

1、引言：隨著Android智能手機的普及，Android應用得到了大力支持，而Android應用的市場前景也是非常的強勢。在Android應用的實際開發中，很多時候還會遇到相對比較復雜的需求，而且現在很多APP應用為了贏取更多用戶的關注，不僅在用戶交互體驗上多做文章，還在頁面效果上下了不少功夫，使用自定義View實現各種炫麗的效果，也是吸引用戶的一種法寶。前一段時間，在手機上發現很多APP具有水波紋般效果。心血來潮想來自己試試，學習試做了一個用自定義View實現標準正余弦波紋給大家分享一下。

2、效果如下：

3、需關注方法：

1)onMeasure():先回調，用于控件的測量;

2)onSizeChanged():在onMeasure后面回調，可以拿到view的寬高等數據，在橫豎屏切換時也會回調;

3)onDraw()：繪制波紋;

4、這種水波紋可以用具體函數模擬出具體的軌跡，然后不斷刷新繪制，形成動態的波紋，所以思路基本如下：

①　確定水波紋的函數方程

②　根據函數方程得出每一個波紋上點的坐標；

③　將水波進行平移，即將水波上的點不斷的移動；

④　不斷的重新繪制，不斷刷新，生成動態水波紋；

5、根據上面的思路，我們進行實現：

1)正余弦函數方程為：y = Asin(wx+b)+h

這個公式在高中相信大家都學過，函數里：w決定周期，A決定振幅，h決定y位置，b為初相；根據上面的方程選取自己覺得中意的波紋效果，確定對應參數的取值；然后根據確定好的方程得出所有的方程上y的數值，并將所有y值保存在數組里：

2)根據得出的所有y值，則可以在onDraw中通過如下代碼繪制兩條靜態波紋：

3)這種方式類似于數學里面的細分法，一條波紋，如果橫向以一個像素點為單位進行細分，則形成view總寬度條直線，并且每條直線的起點和終點我們都能知道，在此基礎上我們只需要循環繪制出所有細分出來的直線(直線都是縱向的)或看成是無數個點連接形成了一條靜態的水波紋。之后改變兩條波紋的起始點，呈現動態，當波紋移動到結尾處，重新記錄并繪制，這樣就會產生循環波紋的效果。

4)接下來我們讓水波紋動起來，之前用了一個數組保存了所有的y值點，有兩條水波紋，再利用兩個同樣大小的數組來保存兩條波紋的y值數據，并不斷的去改變這兩個數組中的數據：

5)除此之外，為了讓波紋在不同分辨率上的移動速度基本一致，又編寫了一個UIUtil類，編寫方法，將dip轉換為px單位。

至此，動態的正余弦波紋效果就呈現出來。

6、效果思路總結，我們將函數確定后，通過循環將左邊的點開始進行正余弦函數的往復上下移動，從而達到一種波紋狀視覺體驗，移動的幅度，也就是波紋的高低，全部通過一個數組存儲正余弦函數生成的值，而這種往復運動也只需要不斷的改變這個數組的數據，再通過OnDraw方法不斷刷新，即可生成動態水波紋。刷新可以調用invalidate()或postInvalidate(),區別在于后者可以在子線程中更新UI，更方便。

7、代碼整合如下：

1)UiUtil類，其中方法將dip單位轉為px單位，是為讓了能夠控制波紋在任何分辨率都能盡量統一速度。

2)自定義波紋View中代碼：

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的android波纹效果弹窗,Android自定义View实现波纹效果的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。