PathMeasure 仿支付寶支付動畫

在 android 自定義 view 中，path 可能用的比較多，pathmeasure 可能用的比較少，就我而言，以前也沒有使用過 pathmeasure 這個 api,看到別人用 pathmeasure 和 valueanimator 結合在一起完成了很好的動畫效果，於是我也學習下 pathmeasure ，此處記錄下。

構造器：

方法名含義pathmeasure()

建立乙個空的 pathmeasure 物件

pathmeasure(path path,boolean forceclosed)

建立 pathmeasure 並關聯乙個指定的 path

forceclosed 含義：

// 建立乙個 path 物件
path = new path();
path.moveto(20, 20);
path.lineto(200, 20);
path.lineto(200, 400);

在 ondraw(canvas canvas) 中繪製 path

可以看到：當 forceclosed = true 時， path 進行了閉合，相應的 path 長度也變長了，即算上了斜邊的長度。

效果：

繪製對號，叉號，主要是通過 valueanimator 結合 getsegment() 不斷繪製新的弧形段，其中，叉號由兩個 path 組成，在第乙個 path 繪製完成時，需要呼叫 pathmeasure.nextcontour() 跳轉到另乙個 path。

getsegment() 將獲取的片段填充到 destpath 中，在 android 4.4 及以下版本中，不能繪製，需要呼叫 destpath.reset(),destpath.line(0,0)

loadingview 完整**：

public
class
loadingview
extends
view 
public
loadingview(context context, attributeset attrs) 
private
void
init(context context, attributeset attrs) catch (exception e) finally 
}paint = createpaint(color, strokewidth, paint.style.stroke);
}@override
protected
void
onsizechanged(int w, int h, int oldw, int oldh) 
private
void
initsuccessanimator() 
});}
private
void
initfailanimator() 
});// pathmeasure.setpath(leftfailpath, false);
leftfailanimator = valueanimator.offloat(0, 1f);
leftfailanimator.addupdatelistener(new valueanimator.animatorupdatelistener() 
});animatorset = new animatorset();
animatorset.play(leftfailanimator).after(rightfailanimator);
animatorset.setduration(500);
animatorset.setinterpolator(new linearinterpolator());
}/**
* 測量控制項的寬高，當測量模式不是精確模式時，設定預設寬高
**@param widthmeasurespec
*@param heightmeasurespec
*/@override
protected
void
onmeasure(int widthmeasurespec, int heightmeasurespec) 
if (heightmode == measurespec.at_most || heightmode == measurespec.unspecified) 
super.onmeasure(widthmeasurespec, heightmeasurespec);
}@override
protected
void
ondraw(canvas canvas) 
}if (startangle > minangle + 300) 
canvas.rotate(curangle += rotatedelta, 0, 0);//旋轉rotatedelta=4的弧長
canvas.drawarc(rectf, startangle, endangle, false, paint);
// endangle += 6 放在 drawarc()後面，是防止剛進入時，突兀的顯示了一段圓弧
if (startangle == minangle) 
invalidate();
}if (isshowresult) else
if (stateenum == stateenum.load_failed) 
canvas.drawpath(destpath, paint);}}
canvas.restore();
}public
void
updatestate(stateenum stateenum) else
if (stateenum == stateenum.load_failed) 
}public
enum stateenum 
/*** 建立畫筆
**@param color 畫筆顏色
*@param strokewidth 畫筆寬度
*@param style 畫筆樣式
*@return
*/private paint createpaint(int color, int strokewidth, paint.style style) 
/*** dp 轉換成 px
**@param dpvalue
*@return
*/private
intdp2px(int dpvalue) 
}

github :

PathMeasure 仿支付寶支付動畫

仿支付寶支付成功動畫

iOS 仿支付寶密碼支付

高仿支付寶手勢解鎖

PathMeasure 仿支付寶支付動畫

仿支付寶支付成功動畫

iOS 仿支付寶密碼支付

高仿支付寶手勢解鎖

相關推薦