SurfaceView使用

SurfaceView和View的区别

View通过刷新来重绘视图，两次刷新的间隔时间为16ms，如果在16ms内，View没有完成需要执行的操作，用户就会产生卡顿的感觉。为了避免这个问题，可以使用SurfaceView，它与View的主要区别如下：

• View主要用于主动刷新，而SurfaceView适用于被动刷新，比如拍照和游戏界面的频繁刷新；
• View刷新在主线程中进行，而SurfaceView通常使用一个子线程进行刷新操作；
• View在绘图时没有使用双缓冲机制，而SurfaceView在底层实现了这个机制；

因此，如果在自定义View的时候需要频繁刷新，或者刷新时数据处理量比较大时，可以考虑使用SurfaceView代替。

SurfaceView使用模板

在使用SurfaceView时，可以使用一套模板代码，大部分的SurfaceView绘图操作都可以使用这套模板代码实现。

public class SurfaceViewTemplate extends SurfaceView implements SurfaceHolder.Callback, Runnable {

    private SurfaceHolder mHolder;
    private Canvas mCanvas; // 画布，用于绘图
    private boolean mIsDrawing; // 标志位，用于控制进行绘制的子线程

    public SurfaceViewTemplate(Context context) {
        super(context);
        initView();
    }

    public SurfaceViewTemplate(Context context, AttributeSet attrs) {
        super(context, attrs);
        initView();
    }

    public SurfaceViewTemplate(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initView();
    }

    private void initView() {
        mHolder = getHolder();
        mHolder.addCallback(this);
        setFocusable(true);
        setFocusableInTouchMode(true);
        setKeepScreenOn(true);
    }

    @Override
    public void surfaceCreated(SurfaceHolder holder) {
        mIsDrawing = true;
        new Thread(this).start();
    }

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

    }

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

    @Override
    public void run() {
        while (mIsDrawing) {
            draw();
        }
    }

    private void draw() {
        try {
            mCanvas = mHolder.lockCanvas(); // 获取上一次的Canvas，之前的绘图操作会被保留
            // To do drawing
        } catch (Exception e) {
            e.printStackTrace();
        } finally {
            if (mCanvas != null)
                mHolder.unlockCanvasAndPost(mCanvas); // 提交绘制内容
        }
    }

}

SurfaceView实例

下面通过具体实例介绍如何使用SurfaceView进行频繁刷新的绘图。

正弦曲线

@Override
public void run() {
    while (mIsDrawing) {
        draw();
        x += 1;
        y = (float) (100 * Math.sin(x * 2 * Math.PI / 180) + getHeight() / 2);
        mPath.lineTo(x, y);
    }
}

private void draw() {
    try {
        mCanvas = mHolder.lockCanvas(); // 获取上一次的Canvas，之前的绘图操作会被保留
        // To do drawing
        mCanvas.drawColor(Color.WHITE);
        mCanvas.drawPath(mPath, mPaint);
    } catch (Exception e) {
        e.printStackTrace();
    } finally {
        if (mCanvas != null)
            mHolder.unlockCanvasAndPost(mCanvas); // 提交绘制内容
    }
}

绘图板

@Override
public boolean onTouchEvent(MotionEvent event) {
    float x = event.getX();
    float y = event.getY();
    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            mPath.moveTo(x, y);
            return true;
        case MotionEvent.ACTION_MOVE:
            mPath.lineTo(x, y);
            return true;
        case MotionEvent.ACTION_UP:
            return true;
    }
    return super.onTouchEvent(event);
}

@Override
public void run() {
    while (mIsDrawing) {
        draw();
    }
}

private void draw() {
    try {
        mCanvas = mHolder.lockCanvas(); // 获取上一次的Canvas，之前的绘图操作会被保留
        // To do drawing
        mCanvas.drawColor(Color.WHITE);
        mCanvas.drawPath(mPath, mPaint);
    } catch (Exception e) {
        e.printStackTrace();
    } finally {
        if (mCanvas != null)
            mHolder.unlockCanvasAndPost(mCanvas); // 提交绘制内容
    }
}