java动效_Android 界面漩涡扭曲动效实现
背景：之前偶然看到優(yōu)酷有類似的頁面切換動畫效果。于是自己也打算來實現(xiàn)下這樣的效果。
動效說明：點擊界面中的任意位置，界面以點擊位置作為中心點，開始以漩渦狀態(tài)，扭曲，收縮。直到消失。
直接上我實現(xiàn)的效果：
一，方法原理說明：
將頁面生成bitmap。
使用自定義View來繪制扭曲的圖像。 圖像繪制的時候使用的關(guān)鍵的api 是： canvas.drawBitmapMesh();
二，實現(xiàn)細(xì)節(jié)說明：
1.? 生成頁面Bitmap:優(yōu)先使用drawingCache ， 如果沒有再創(chuàng)建bitmap 對象。
public static Bitmap createBitmapFromView(View view) {
if (view instanceof ImageView) {
Drawable drawable = ((ImageView) view).getDrawable();
if (drawable != null && drawable instanceof BitmapDrawable) {
return ((BitmapDrawable) drawable).getBitmap();
}
}
view.clearFocus();
Bitmap bitmap = view.getDrawingCache();
if(bitmap != null) {
return bitmap;
}
bitmap = createBitmapSafely(view.getWidth(),
view.getHeight(), Bitmap.Config.ARGB_8888, 1);
if (bitmap != null) {
synchronized (sCanvas) {
Canvas canvas = sCanvas;
canvas.setBitmap(bitmap);
view.draw(canvas);
canvas.setBitmap(null);
}
}
return bitmap;
}
public static Bitmap createBitmapSafely(int width, int height, Bitmap.Config config, int retryCount) {
...
}
2. 關(guān)于自定義控件 VortexView 。 主要是再onDraw(Canvas ) 方法中使用rootView 生成的Bitmap 通過canvas.drawBitmapMesh 方法來繪制扭曲的圖像。(最開始我的方案是支持在native 中，對圖片進(jìn)行像素級別的修改。 雖然成功了，但是效率卻很慢。)
關(guān)于API drawBitmapMesh 可以參考一下這篇博文：使用drawBitmapMesh方法產(chǎn)生水波
期原理猜測應(yīng)該是使用了opengl 中紋理，坐標(biāo)變換映射的技術(shù)。(只是猜測)
drawBitmapMesh使用方法：將原始圖片分割成為M行，N列。 并計算得出原始的每個交點再二維空間內(nèi)的坐標(biāo)。 坐上角為(0，0)點。 水平向右為X正方向。 垂直向下為Y正方向。? 使用漩渦算法，計算每一幀下，原始頂點(線的交點)在當(dāng)前時刻下的坐標(biāo)位置。即生成的局部變量ve［］； 這樣界面就能顯示出圖像被扭曲的動畫。
當(dāng)然：分割的行列越多，效果就會越好。
public class VortextView extends View {
...
@Override
public void onDraw(Canvas canvas) {
if (destBitmap != null) {
int mswd = mesh.getMeshWidth();
int msht = mesh.getMeshHeight();
float[] ve = mesh.getVertices();
if (rect != null) {
int count = canvas.save();
canvas.translate(rect.left, rect.top);
canvas.drawBitmapMesh(destBitmap, mswd, msht, ve, 0, null, 0, null);
canvas.restoreToCount(count);
} else {
canvas.drawBitmapMesh(destBitmap, mswd, msht, ve, 0, null, 0, null);
}
// mesh.drawLines(canvas,paint);
}
}
...
}
3. 關(guān)于算法：不管是漩渦扭曲動效，還是仿造mac os 最小化效果。 原理都是一致的。唯一不同的地方在于算法。我們需要分別設(shè)計算法來擬合出在目標(biāo)時刻下新的頂點位置。
漩渦動效算法：這里需要用到極坐標(biāo)公式。夾角隨著時間增大而增大。半徑隨著時間增大而見小。然后在求出對應(yīng)的x和y；
mac os 最小化：這里我使用了2階貝塞爾曲線。
總結(jié)
以上是生活随笔為你收集整理的java动效_Android 界面漩涡扭曲动效实现的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： java前后端数据交互_前后端数据交互(
- 下一篇： android 多个标签页,Androi