Android SurfaceView的烦恼(一)-双缓存与清屏

学习Android开发的时候，经常看到画图时推荐使用SurfaceView，而不是使用View。原因有二：

• SurfaceView实现了双缓存机制，避免了界面的闪烁；
• SurfaceView允许在非UI线程中画图，即可自已起一线程来画图，减少主UI线程被“卡”住的现象，也就是提高效率。

不过，在学习的过程中，使用起来并不容易，折腾了好一阵子，还是一知半解，在这里记录并与大家交流一下。在应用中，常常遇到一些“古怪”的问题，增添了不少“烦恼”。第一个烦恼就是：双缓存与清屏。

1. 怎样双缓存？根据资料介绍，双缓存大概的意思是指在内存区域里有一个缓存区域与界面图片对应，当界面发生变化时，先在缓存区域中把界面的内容画好，然后一次性把它显示出来，这样既没有闪烁感，显示效率也更高。但SurfaceView的双缓存是否与这种说法有所不同呢？
2. 先在内存画完再显示，那么它是在原来的基本上画，还是重新画？
3. 如果每次都在同一个地方(如写字)，为什么它会叠起来呢？

     下面来看个测试例子，先看代码：

res/layout/main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
<com.tutor.surface.MySurfaceView  
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent"
    />
</LinearLayout>

DrawRectSurfaceView.java

package com.tutor.surface;
import android.app.Activity;
import android.os.Bundle;
public class DrawRectSurfaceView extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
    }
}

MySurfaceView.java

package com.tutor.surface;
import java.util.Timer;
import android.content.Context;
import android.util.AttributeSet;
import android.util.Log;
import android.view.SurfaceHolder;
import android.view.SurfaceView;
public class MySurfaceView extends SurfaceView implements SurfaceHolder.Callback {
	private Timer timer = null;
	private MyTimerTask task = null;
	public MySurfaceView(Context context, AttributeSet attrs) {
        super(context, attrs);
        SurfaceHolder holder = getHolder();
        holder.addCallback(this);
		// TODO Auto-generated constructor stub
	}
	@Override
	public void surfaceChanged(SurfaceHolder holder, int format, int width,
			int height) {
		// TODO Auto-generated method stub
		
	}
	@Override
	public void surfaceCreated(SurfaceHolder holder) {
		// TODO Auto-generated method stub
		timer = new Timer();
		task = new MyTimerTask(holder);
		timer.schedule(task, 500, 1000);
	}
	@Override
	public void surfaceDestroyed(SurfaceHolder holder) {
		// TODO Auto-generated method stub
		if(timer != null) {
			timer.cancel();
			timer = null;
		}
		task = null;
	}
	
}

MyTimerTask.java

package com.tutor.surface;
import java.util.TimerTask;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.view.SurfaceHolder;
public class MyTimerTask extends TimerTask {
	private SurfaceHolder holder = null;	
	private Paint paint = null;
	private int count = 0;
	
	public MyTimerTask(SurfaceHolder _holder) {
		holder = _holder;
		paint = new Paint();
		paint.setColor(Color.WHITE);
	}
	public void run() {
		// TODO Auto-generated method stub
		if(count > 40)//测试程序，大于20不再画了
			return;
		
		Canvas canvas = null;
		try {			
			canvas = holder.lockCanvas(null);//锁整个画布
			if(count % 2 == 0) {
				canvas.drawText(count+"", 50, count*8, paint);
			}else {
				canvas.drawText(count+"", 150, count*8, paint);
			}
		}catch (Exception e) {
			// TODO: handle exception
		}finally {
			if(canvas != null) {
				holder.unlockCanvasAndPost(canvas);
			}
		}
		count++;
	}
	
	public void clearDraw() {
		Canvas canvas = null;
		try {
			canvas = holder.lockCanvas(null);
			canvas.drawColor(Color.BLACK);
		}catch (Exception e) {
			// TODO: handle exception
		}finally {
			if(canvas != null) {
				holder.unlockCanvasAndPost(canvas);
			}
		}
	}
}

运行结果：

 

从上面可以看到的现象是：

• 两列数字交替出现(先出现第一张图片那列偶数，然后是第二张图片的那列奇数，然后再回到偶数列，如此交替)；
• 在画后面的数字时，前面画过数字会保留；
• 没有特意清过屏幕，但屏幕一直是黑的。
• 如果把写字的坐标换成固定的(即所有字都只在一个地方写)，那么字会一直叠起来，看不清楚写了什么。

再回来思考一开始那三个问题：

• SurfaceView的双缓存有些不一样，SurfaceView有两个缓存，一个是front buffer，一个back buffer，这两个buffer是交替显示(flip)到界面上的，即当前看到的是front buffer的内容，如果此时界面发生变化，那么back buffer就会在原来的基础上把内容画好，然后front buffer与back buffer交换一下位置；需要注意的是，由于存在两个buffer，如果每次都把所有内容都重新画一遍则不会有什么问题，但如果每次画的内容都是一部分，那就有问题了：一部分、一部分地交替显示，这当然不是我们想要的。解决的办法是：每次清屏，然后把所有东西再画一遍。
• 在不清屏的情况下，是在原来的基础上画的；
• 由于内容是在原来的基础上画的，所以如果每次在一个地方画，那就会叠起来。解决的办法是每次画之前，先把内容清掉然后再画，清内容的简单办法是：canvas.drawColor(Color.BLACK)，内容清除的范围由holder.lockCanvas(new Rect(left, top, right, bottom))决定，使用holder.lockCanvas(null)则范围为全屏。注意：如果清完屏先解锁画布post一下再画原来的内容会引起闪烁感，所以清完屏直接画好内容再解决画布post(显示)。

 

补充：

对于第一个问题的解决办法：“每次清屏，然后把所有东西再画一遍”，在某种情况下可以有另外一种解决办法，但这会引起另外的“古怪”问题，下一次再作解释。