幀動畫記憶體OOM？不存在的！—— SurfaceView逐幀解析

SurfaceView OOM · 發表 2019-05-03 23:42:10

摘要： Android 提供了AnimationDrawable 用於實現幀動畫。在動畫開始之前，所有幀的圖片都被解析並佔用記憶體，一旦動畫較複雜幀數較多，在低配置手機上容易發生 OOM。即使不發生 OOM，也會對記憶體造成不小的壓力。下面程式碼展示了一個幀數為4的幀動畫：原生幀動...

Android 提供了AnimationDrawable 用於實現幀動畫。在動畫開始之前，所有幀的圖片都被解析並佔用記憶體，一旦動畫較複雜幀數較多，在低配置手機上容易發生 OOM。即使不發生 OOM，也會對記憶體造成不小的壓力。下面程式碼展示了一個幀數為4的幀動畫：

原生幀動畫

AnimationDrawable drawable = new AnimationDrawable();
drawable.addFrame(getDrawable(R.drawable.frame1), frameDuration);
drawable.addFrame(getDrawable(R.drawable.frame2), frameDuration);
drawable.addFrame(getDrawable(R.drawable.frame3), frameDuration);
drawable.addFrame(getDrawable(R.drawable.frame4), frameDuration);
drawable.setOneShot(true);

ImageView ivFrameAnim = ((ImageView) findViewById(R.id.frame_anim));
ivFrameAnim.setImageDrawable(drawable);
drawable.start();
複製程式碼

有沒有什麼辦法讓幀動畫的資料逐幀載入，而不是一次性全部載入到記憶體？SurfaceView 就提供了這種能力。

SurfaceView

螢幕的顯示機制和幀動畫類似，也是一幀一幀的連環畫，只不過重新整理頻率很高，感覺像連續的。為了顯示一幀，需要經歷計算和渲染兩個過程，CPU 先計算出這一幀的影象資料並寫入記憶體，然後呼叫 OpenGL 命令將記憶體中資料渲染成影象存放在 GPU Buffer 中，顯示裝置每隔一定時間從 Buffer 中獲取影象並顯示。

上述過程中的計算，對於View 來說，就好比在主執行緒遍歷 View樹以決定檢視畫多大（measure），畫在哪（layout），畫些啥（draw），計算結果存放在記憶體中，SurfaceFlinger 會呼叫 OpenGL 命令將記憶體中的資料渲染成影象存放在 GPU Buffer 中。每隔16.6ms，顯示器從 Buffer 中取出幀並顯示。所以自定義 View 可以通過過載onMeasure() 、onLayout() 、onDraw() 來定義幀內容，但不能定義幀重新整理頻率。

SurfaceView 可以突破這個限制。而且它可以將計算幀資料放到獨立的執行緒中進行。下面是自定義SurfaceView 的模版程式碼：

public abstract class BaseSurfaceView extends SurfaceView implements SurfaceHolder.Callback {
public static final int DEFAULT_FRAME_DURATION_MILLISECOND = 50;
//用於計算幀資料的執行緒
private HandlerThread handlerThread;
private Handler handler;
//幀重新整理頻率
private int frameDuration = DEFAULT_FRAME_DURATION_MILLISECOND;
//用於繪製幀的畫布
private Canvas canvas;
private boolean isAlive;

public BaseSurfaceView(Context context) {
super(context);
init();
}

protected void init() {
getHolder().addCallback(this);
//設定透明背景，否則SurfaceView背景是黑的
setBackgroundTransparent();
}

private void setBackgroundTransparent() {
getHolder().setFormat(PixelFormat.TRANSLUCENT);
setZOrderOnTop(true);
}

@Override
public void surfaceCreated(SurfaceHolder holder) {
isAlive = true;
startDrawThread();
}

@Override
public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {
}

@Override
public void surfaceDestroyed(SurfaceHolder holder) {
stopDrawThread();
isAlive = false;
}

//停止幀繪製執行緒
private void stopDrawThread() {
handlerThread.quit();
handler = null;
}

//啟動幀繪製執行緒
private void startDrawThread() {
handlerThread = new HandlerThread("SurfaceViewThread");
handlerThread.start();
handler = new Handler(handlerThread.getLooper());
handler.post(new DrawRunnable());
}

private class DrawRunnable implements Runnable {

@Override
public void run() {
if (!isAlive) {
return;
}
try {
//1.獲取畫布
canvas = getHolder().lockCanvas();
//2.繪製一幀
onFrameDraw(canvas);
} catch (Exception e) {
e.printStackTrace();
} finally {
//3.將幀資料提交
getHolder().unlockCanvasAndPost(canvas);
//4.一幀繪製結束
onFrameDrawFinish();
}
//不停的將自己推送到繪製執行緒的訊息佇列以實現幀重新整理
handler.postDelayed(this, frameDuration);
}
}

protected abstract void onFrameDrawFinish();

protected abstract void onFrameDraw(Canvas canvas);
}
複製程式碼

用HandlerThread 作為獨立幀繪製執行緒，好處是可以通過與其繫結的Handler 方便地實現“每隔一段時間重新整理”，而且在Surface 被銷燬的時候可以方便的呼叫HandlerThread.quit() 來結束執行緒執行的邏輯。
DrawRunnable.run() 運用模版方法模式定義了繪製演算法框架，其中幀繪製邏輯的具體實現被定義成兩個抽象方法，推遲到子類中實現。本文的主角FrameSurfaceView 應該繼承自BaseSurfaceView ：

逐幀解析 & 及時回收

public class FrameSurfaceView extends BaseSurfaceView {
public static final int INVALID_BITMAP_INDEX = Integer.MAX_VALUE;
private List<Integer> bitmaps = new ArrayList<>();
//幀圖片
private Bitmap frameBitmap;
//幀索引
private int bitmapIndex = INVALID_BITMAP_INDEX;
private Paint paint = new Paint();
private BitmapFactory.Options options = new BitmapFactory.Options();
//幀圖片原始大小
private Rect srcRect;
//幀圖片目標大小
private Rect dstRect = new Rect();
private int defaultWidth;
private int defaultHeight;

public void setDuration(int duration) {
int frameDuration = duration / bitmaps.size();
setFrameDuration(frameDuration);
}

public void setBitmaps(List<Integer> bitmaps) {
if (bitmaps == null || bitmaps.size() == 0) {
return;
}
this.bitmaps = bitmaps;
//預設情況下，計算一幀圖片的原始大小
getBitmapDimension(bitmaps.get(0));
}

private void getBitmapDimension(Integer integer) {
final BitmapFactory.Options options = new BitmapFactory.Options();
options.inJustDecodeBounds = true;
BitmapFactory.decodeResource(this.getResources(), integer, options);
defaultWidth = options.outWidth;
defaultHeight = options.outHeight;
srcRect = new Rect(0, 0, defaultWidth, defaultHeight);
requestLayout();
}

public FrameSurfaceView(Context context) {
super(context);
}

@Override
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
super.onLayout(changed, left, top, right, bottom);
dstRect.set(0, 0, getWidth(), getHeight());
}

@Override
protected void onFrameDrawFinish() {
//在一幀繪製完後，直接回收它
recycleOneFrame();
}

//回收幀
private void recycleOneFrame() {
if (frameBitmap != null) {
frameBitmap.recycle();
frameBitmap = null;
}
}

@Override
protected void onFrameDraw(Canvas canvas) {
//繪製一幀前需要先清畫布，否則所有幀都疊在一起同時顯示
clearCanvas(canvas);
if (!isStart()) {
return;
}
if (!isFinish()) {
drawOneFrame(canvas);
} else {
onFrameAnimationEnd();
}
}

//繪製一幀，是張Bitmap
private void drawOneFrame(Canvas canvas) {
frameBitmap = BitmapUtil.decodeOriginBitmap(getResources(), bitmaps.get(bitmapIndex), options);
canvas.drawBitmap(frameBitmap, srcRect, dstRect, paint);
bitmapIndex++;
}

private void onFrameAnimationEnd() {
reset();
}

private void reset() {
bitmapIndex = INVALID_BITMAP_INDEX;
}

//幀動畫是否結束
private boolean isFinish() {
return bitmapIndex >= bitmaps.size();
}

//幀動畫是否開始
private boolean isStart() {
return bitmapIndex != INVALID_BITMAP_INDEX;
}

//開始播放幀動畫
public void start() {
bitmapIndex = 0;
}

private void clearCanvas(Canvas canvas) {
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
canvas.drawPaint(paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC));
}
}
複製程式碼

FrameSurfaceView 繼承自BaseSurfaceView ，所以它複用了基類的繪製框架演算法，並且定了自己每一幀的繪製內容：一張Bitmap 。
Bitmap 資源 id 通過setBitmap() 傳遞進來，繪製一幀解析一張 ，在每一幀繪製完畢後，呼叫Bitmap.recycle() 釋放圖片 native 記憶體並去除 java 堆中圖片畫素資料的引用。這樣當 GC 發生時，圖片畫素資料可以及時被回收。

一切都是這麼地能夠自圓其說，我迫不及待地執行程式碼並開啟AndroidStudio 的Profiler 標籤頁，切換到MEMORY ，想用真實記憶體資料驗證下效能。但殘酷的事實狠狠地打了下臉。。。多次播放幀動畫後，記憶體佔用居然比原生AnimationDrawable 還大，而且每播放一次，記憶體中都會多出 N 個Bitmap 物件（N為播放一邊的幀數）。唯一令人欣慰的是，手動觸發 GC 後幀動畫圖片能夠被回收。（AnimationDrawable 中的圖片資料不會被 GC）

原因就在於自作聰明地及時回收，每一幀繪製完後幀資料被回收，那下一幀解析Bitmap 時只能新申請一塊記憶體。幀動畫每張圖片大小是一致的，是不是能複用上一幀Bitmap 的記憶體空間？於是乎有了下面這個版本的FrameSurfaceView ：

逐幀解析 & 幀複用

public class FrameSurfaceView extends BaseSurfaceView {
public static final int INVALID_BITMAP_INDEX = Integer.MAX_VALUE;
private List<Integer> bitmaps = new ArrayList<>();
private Bitmap frameBitmap;
private int bitmapIndex = INVALID_BITMAP_INDEX;
private Paint paint = new Paint();
private BitmapFactory.Options options;
private Rect srcRect;
private Rect dstRect = new Rect();

public void setDuration(int duration) {
int frameDuration = duration / bitmaps.size();
setFrameDuration(frameDuration);
}

public void setBitmaps(List<Integer> bitmaps) {
if (bitmaps == null || bitmaps.size() == 0) {
return;
}
this.bitmaps = bitmaps;
getBitmapDimension(bitmaps.get(0));
}

private void getBitmapDimension(Integer integer) {
final BitmapFactory.Options options = new BitmapFactory.Options();
options.inJustDecodeBounds = true;
BitmapFactory.decodeResource(this.getResources(), integer, options);
defaultWidth = options.outWidth;
defaultHeight = options.outHeight;
srcRect = new Rect(0, 0, defaultWidth, defaultHeight);;
}

public FrameSurfaceView(Context context) {
super(context);
}

@Override
protected void init() {
super.init();
//定義解析Bitmap引數為可變型別，這樣才能複用Bitmap
options = new BitmapFactory.Options();
options.inMutable = true;
}

@Override
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
super.onLayout(changed, left, top, right, bottom);
dstRect.set(0, 0, getWidth(), getHeight());
}

@Override
protected int getDefaultWidth() {
return defaultWidth;
}

@Override
protected int getDefaultHeight() {
return defaultHeight;
}

@Override
protected void onFrameDrawFinish() {
//每幀繪製完畢後不再回收
//recycle();
}

public void recycle() {
if (frameBitmap != null) {
frameBitmap.recycle();
frameBitmap = null;
}
}

@Override
protected void onFrameDraw(Canvas canvas) {
clearCanvas(canvas);
if (!isStart()) {
return;
}
if (!isFinish()) {
drawOneFrame(canvas);
} else {
onFrameAnimationEnd();
}
}

private void drawOneFrame(Canvas canvas) {
frameBitmap = BitmapUtil.decodeOriginBitmap(getResources(),
//複用Bitmap
bitmaps.get(bitmapIndex), options);
options.inBitmap = frameBitmap;
canvas.drawBitmap(frameBitmap, srcRect, dstRect, paint);
bitmapIndex++;
}

private void onFrameAnimationEnd() {
reset();
}

private void reset() {
bitmapIndex = INVALID_BITMAP_INDEX;
}

private boolean isFinish() {
return bitmapIndex >= bitmaps.size();
}

private boolean isStart() {
return bitmapIndex != INVALID_BITMAP_INDEX;
}

public void start() {
bitmapIndex = 0;
}

private void clearCanvas(Canvas canvas) {
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
canvas.drawPaint(paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC));
}
}
複製程式碼

將Bitmap 的解析引數inBitmap 設定為已經成功解析的Bitmap 物件以實現複用。

這一次不管重新播放多少次幀動畫，記憶體中Bitmap 數量只會增加1，因為只在解析第一張圖片是分配了記憶體。而這塊記憶體可以在FrameSurfaceView 生命週期結束時手動呼叫recycle() 回收。

talk is cheap, show me the code

為了更清晰的展示，上述程式碼段省略了一些和主題無關的自定義 View 細節，完整的程式碼可以點選這裡。