Android使用Path自定義波浪加載View

一、What

昨天寫了一篇 blog 說了一下Path類裏面的幾個方法。
爲何會寫的？ 由於這幾天寫view的時候用到了，如今分享一個波浪加載的view。

二、沒圖沒真相，上圖

三、思路

實際上爲一條正弦曲線。使用屏幕對應的x座標求得y座標，而後畫出一條正弦曲線，而後把路徑封閉，填充，添加動態，便可。

四、代碼

首先設置畫筆style來分析一下。

wavePaint.setStyle(Style.STROKE);
wavePaint.setStrokeWidth(20);

效果如圖：

藍色部分爲咱們畫的路徑，造成一個封閉路徑。

private void setPath(){
    int x = 0;
    int y = 0;
    //每次進來都把path重置一下
    path.reset();
    for (int i = 0; i < width; i++) {
        x = i;
        y = (int) (a * Math.sin((i * w + fai) * Math.PI / 180) + k);
        if (i == 0) {
            //x=0的時候，即左上角的點，移動畫筆於此
            path.moveTo(x, y);
        }
        //用每一個x求得每一個y，用quadTo方法鏈接成一條貝塞爾曲線
        path.quadTo(x, y, x + 1, y);
    }
    //最後鏈接到右下角底部
    path.lineTo(width, height);
    //鏈接到左下角底部
    path.lineTo(0, height);
    //起點在左上角，這個時候能夠封閉路徑了，封閉。
    path.close();
}

這樣變能夠畫出上圖。

如今咱們把畫筆的style設置回fill或者不設置（默認爲fill），便可。

而後開啓一個線程，或者用一個handle發送消息去更新畫面左右移動便可造成波浪動畫。

最後把進度更新、進度上升加上，相信這個不是難點了，定義一個接口，設置一個回調函數便可實現進度更新，進度跟着波浪上升就行了。

五、總結

代碼已放在github，你們能夠拿來用，或者有更好的實現方法能夠一塊兒修改修改。

地址：https://github.com/zhongbaitu/WaveLoadingView

對於參與開源，我仍是比較少，雖會用一點 git 命令，會使用github，但平時只會伸手就拿，也沒貢獻過點什麼，此次也算是個開始吧，但仍是有些東西不是很清楚，須要摸索一下，例如怎麼把庫上傳到maven中心庫，讓開發者可使用 gradle 或者 maven dependency 就能夠把整個庫拿下來直接使用呢？ 明晚再摸索，晚安。