一直在學習扔物線的Hencoder 的android教程中店展,其中有這么一個仿寫活動挥唠,將之前在這個教程中學到關于自定義View的知識點應用下液走,最終在參考了仿寫活動的獲勝者的實現(xiàn)后医吊,自己也實現(xiàn)了這么一個仿寫钱慢,加入了一些自定義屬性設置和暴露出動畫執(zhí)行的監(jiān)聽回調(diào)。
先看下原來的效果:
Flipboard logo
實現(xiàn)后的效果:
flipboardiconview.gif
talk is cheap, show your code!
githup源碼地址:https://github.com/DarkSherlock/FlipboardIconDemo
這個動畫效果是:右半邊先繞Y軸旋轉45°卿堂,然后這個已經(jīng)繞Y軸旋轉45°后的右半邊部分繞Z軸逆時針旋轉270°束莫,然后剩下的另外半邊繞X軸旋轉45°。
重點貼下 ondraw()里的代碼就好了草描,有興趣的可以去githup clone下工程览绿,看下源碼,源碼不多陶珠,也加了注釋挟裂,非常容易理解。
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
int bitmapWidth = bitmap.getWidth();
int bitmapHeight = bitmap.getHeight();
int centerX = getWidth() / 2;
int centerY = getHeight() / 2;
int x = centerX - bitmapWidth / 2;
int y = centerY - bitmapHeight / 2;
//繪制動的半邊.
//開始先繞Y軸旋轉 targetDegreeY 度
//然后是中間波浪效果:把裁剪出來的那半邊canvas旋轉了targetDegreeY的那
//半邊繞Z軸旋轉270°,
//這樣因為那半邊canvas是已經(jīng)旋轉了targetDegreeY的揍诽,所以中間波浪動畫效
//果就實現(xiàn)了這半邊掃過的部分變得凸起
//最后再繞X軸旋轉targetDegreeX 度
canvas.save();
camera.save();
canvas.translate(centerX, centerY);
camera.rotateY(-degreeY);
canvas.rotate(-degreeZ);
camera.applyToCanvas(canvas);
canvas.clipRect(0, -centerY, centerX, centerY);
canvas.rotate(degreeZ);
canvas.translate(-centerX, -centerY);
canvas.drawBitmap(bitmap, x, y, paint);
canvas.restore();
camera.restore();
//繪制不動的那半邊
canvas.save();
camera.save();
canvas.translate(centerX, centerY);
canvas.rotate(-degreeZ);
camera.rotateY(degreeFixY);
camera.applyToCanvas(canvas);
canvas.clipRect(-centerX, -centerY, 0, centerY);
canvas.rotate(degreeZ);
canvas.translate(-centerX, -centerY);
canvas.drawBitmap(bitmap, x, y, paint);
canvas.restore();
camera.restore();
}
其中關于自定義View onDraw()方法不熟悉的朋友诀蓉,推薦一同關注扔物線大神的Hencoder教程http://hencoder.com/栗竖,一起共同提高.