一、引入:
Android提供了View来进行绘图处理,在大部分情况下,View都能满足绘图需求。大家都知道View是通过刷新来重绘视图,Android系统通过发出VSYNC信号来进行屏幕的重绘,刷新的间隔时间为16ms。如果在16ms内View完成了你所需要执行的所有操作,那么用户在视觉上,就不会产生卡顿的感觉;反之,如果操作的逻辑过多时,就会掉帧从而使得用户感觉到卡顿。特别的需要频繁刷新的界面上,如游戏(60FPS以上),就会不断阻塞主线程,从而导致界面卡顿。而Android提供了SurfaceView来解决这种情况。
二、SurfaceView和View的不同之处
SurfaceView和View的不同之处:
View | SurfaceView |
适用于主动更新 | 适用于被动刷新 |
在主线程中进行画面更新 | 通常通过一个子线程来进行画面更新 |
绘图中没有使用双缓冲机制 | 在底层实现中就实现了双缓冲机制 |
比较了上面的不同之处,显然可以发现,如果一个View需要频繁的刷新,或者在刷新时数据处理量大(可能引起卡顿),可以考虑使用SurfaceView来替代View。
三、SurfaceView的基本使用
SurfaceView在使用的过程中,有一套模板代码,对于大部分的SurfaceView绘图操作而言都可以套用,因此SurfaceView在使用过程中并不难。
其中值得注意的几个点:。
两个接口
SurfaceHolder.CallBack
Runnable
第一个接口中需要实现的方法分别对应于SurfaceView的生命周期,即创建、改变和销毁。具体代码如下:
//Surface的生命周期 @Override public void surfaceCreated(SurfaceHolder holder) { } @Override public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) { } @Override public void surfaceDestroyed(SurfaceHolder holder) { }
而第二接口需要实现run方法,用于在子线程中进行draw操作。
由于SurfaceView的基本操作比较简单,这边就直接给出了它的一个模板代码
package com.pignet.surfaceviewdemo;
import android.content.Context;
import android.graphics.Canvas;
import android.util.AttributeSet;
import android.view.SurfaceHolder;
import android.view.SurfaceView;
/**
* Created by DB on 2017/6/9.
*/
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);
}
public SurfaceViewTemplate(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
private void initView() {
mHolder=getHolder();
mHolder.addCallback(this);
setFocusable(true);
setFocusableInTouchMode(true);
this.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();
//通过线程休眠以控制刷新速度
try {
Thread.sleep(50);
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}
private void draw() {
try {
mCanvas=mHolder.lockCanvas();
//初始化画布并在画布上画一些东西
}catch (Exception e){
}finally {
//判断画布是否为空,从而避免黑屏情况
if(mCanvas!=null){
mHolder.unlockCanvasAndPost(mCanvas);
}
}
}
}
下面结合一个具体的示例,展现SurfaceView在绘图中的效果(绘图板,即通过监听触摸事件完成内容的绘制)。
package com.pignet.surfaceviewdemo;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.view.SurfaceHolder;
import android.view.SurfaceView;
/**
* Created by DB on 2017/6/9.
*/
public class SurfaceViewTemplate extends SurfaceView implements SurfaceHolder.Callback,Runnable {
private static final String TAG="SurfaceView";
//SurfaceHolder
private SurfaceHolder mHolder;
//用于绘图的Canvas
private Canvas mCanvas;
//子线程标志位
private boolean mIsDrawing;
//画笔
private Paint mPaint;
//路径
private Path mPath;
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);
mPath=new Path();
//初始化画笔
mPaint=new Paint();
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setStrokeWidth(6);
mPaint.setAntiAlias(true);
mPaint.setColor(Color.RED);
setFocusable(true);
setFocusableInTouchMode(true);
this.setKeepScreenOn(true);
}
//Surface的生命周期
@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() {
long start =System.currentTimeMillis();
while(mIsDrawing){
draw();
long end = System.currentTimeMillis();
if(end-start<100){
try{
Thread.sleep(100-end+start);
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}
}
private void draw() {
try{
//锁定画布并返回画布对象
mCanvas=mHolder.lockCanvas();
//接下去就是在画布上进行一下draw
mCanvas.drawColor(Color.WHITE);
mCanvas.drawPath(mPath,mPaint);
}catch (Exception e){
}finally {
//当画布内容不为空时,才post,避免出现黑屏的情况。
if(mCanvas!=null)
mHolder.unlockCanvasAndPost(mCanvas);
}
}
/**
* 绘制触摸滑动路径
* @param event MotionEvent
* @return true
*/
@Override
public boolean onTouchEvent(MotionEvent event) {
int x=(int) event.getX();
int y= (int) event.getY();
switch (event.getAction()){
case MotionEvent.ACTION_DOWN:
Log.d(TAG, "onTouchEvent: down");
mPath.moveTo(x,y);
break;
case MotionEvent.ACTION_MOVE:
Log.d(TAG, "onTouchEvent: move");
mPath.lineTo(x,y);
break;
case MotionEvent.ACTION_UP:
Log.d(TAG, "onTouchEvent: up");
break;
}
return true;
}
/**
* 清屏
* @return true
*/
public boolean reDraw(){
mPath.reset();
return true;
}
}
四、tips:
SurfaceView和View一大不同就是SurfaceView是被动刷新的,但我们可以控制刷新的帧率,而View并且通过invalidate方法通知系统来主动刷新界面的,但是View的刷新是依赖于系统的VSYSC信号的,其帧率并不受控制,而且因为UI线程中的其他一些操作会导致掉帧卡顿。而对于SurfaceView而言,它是在子线程中绘制图形,根据这一特性即可控制其显示帧率,通过简单地设置休眠时间,即可,并且由于在子线程中,一般不会引起UI卡顿。
Thread.sleep(50);即可以控制1s内刷新20次
SurfaceView的双缓冲机制:即对于每一个SurfaceView对象而言,有两个独立的graphic buffer。在Android SurfaceView的双缓冲机制中是这样实现的:
在Buffer A中绘制内容,然后让屏幕显示Buffer A;在下一个循环中,在Buffer B中绘制内容,然后让屏幕显示Buffer B,如此往复。而由于这个双缓冲机制的存在,可能会引起闪屏现象,。在第一个"lockCanvas-drawCanvas-unlockCanvasAndPost "循环中,更新的是buffer A的内容;到下一个"lockCanvas-drawCanvas-unlockCanvasAndPost"循环中,更新的是buffer B的内容。 如果buffer A与buffer B中某个buffer内容为空,当屏幕轮流显示它们时,就会出现画面黑屏闪烁现象。
解决方法
出现黑屏是因为buffer A与buffer B中一者内容为空,而且为空的一方还被post到了屏幕。于是有两种解决思路:
1.不让空buffer出现:每次向一个buffer写完内容并post之后,顺便用这个buffer的内容填充另一个buffer。这样能保证两个 buffer的内容是同步的,缺点是做了无用功,耗费性能。
2.不post空buffer到屏幕:当准备更新内容时,先判断内容是否为空,只有非空时才启动"lockCanvas-drawCanvas-unlockCanvasAndPost"这个流程。(上述模板和示例中即采用了这个方法)