Android-View的孪生兄弟---SurfaceView入门

时间  2020-12-22
标签 java android app ide 函数 this 线程 3d 日志 code 栏目 Android 繁體版
原文   原文链接

SurfaceView入门

为何使用SurfaceView

Android已经提供了View绘图处理，View能够知足大部分的绘图场景，View经过刷新来重回视图，android系统经过发出VSYNC信号进行视图的重 绘，刷新间隔为16ms，超过16ms，咱们可能就会感到卡顿了。对于逻辑太多，操做复杂的场景，频繁的刷新界面，就会阻塞主线程，也会致使界面卡顿。
不少时候，咱们在自定义View的Log日志看到这样的警告java

Skipped 47 frames! The application may be doing too much work on it`s main thread.

这些告警就是由于在绘制过程当中，处理逻辑太多形成的。
为了不这些问题的产生，Android系统提供了SurfaceView，SurfaceView是VIew的孪生兄弟，但它与View仍是有所不一样的。android

SurfaceView与View的区别
  • View适用于主动更新的状况，而SurfaceView主要用于被动更新，好比：频繁的刷新.
  • View在主线程里面进行刷新，而SurfaceView主要经过一个子线程来进行页面的刷新
  • View在绘图时没有使用双缓冲机制，而SurfaceView在底层实现机制中已经实现了双缓冲机制
    总结起来就是，若是自定义View须要频繁刷新，或者刷新时数据处理大，那就能够考虑使用SurfaceView来取代View。
SurfaceView的使用

SurfaceView的使用，要比View复杂，可是它也有一套模板来使用，大部分均可以嵌套这个模板进行使用。app

  • 建立SurfaceView
    建立自定义的SurfaceView继承SurfaceView，并实现两个接口，SurfaceHolder.Callback、Runnable
public class TempleSurfaceView extends SurfaceView implements SurfaceHolder.Callback,Runnable{}

实现SurfaceHolder.Callback接口，须要实现下面的方法：ide

//建立
    @Override
    public void surfaceCreated(SurfaceHolder holder) {

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

    }
    //销毁
    @Override
    public void surfaceDestroyed(SurfaceHolder holder) {

    }

实现Runnable接口，须要实现下面的方法：函数

@Override
    public void run() {
        //子线程
    }
  • 初始化SurfaceView
    在自定义的SurfaceView构造方法中，须要对SurfaceView进行初始化
// SurfaceHolder
    private SurfaceHolder mHolder;
    // 用于绘图的Canvas
    private Canvas mCanvas;
    // 子线程标志位
    private boolean mIsDrawing;

主要是初始化SurfaceHolder对象，并注册SurfaceHolder 的回调方法。this

mHolder = getHolder();
 mHolder.addCallback(this);

另外两个，Canvas和标志位。Canvas与View的onDraw()方法的Canvas同样，用来进行绘图，标志位是用来控制线程的，SurfaceView是新起子线程来绘制的，而这个标志位就是控制子线程的。线程

  • 使用SurfaceView
    经过SurfaceHolder 的lockCanvas(),就能够获取当前的Canvas绘图对象。注意一点，获取到的Canvas仍是以前的Canvas对象，而不是一个新的。因此以前的绘图操做将被保留了，若是须要擦除，可使用drawColor()来进行清理操做。

绘制的时候，通常都是利用三个回调方法进行操做。在surfaceCreated中开启子线程绘制，而子线程用while (mIsDrawing)的循环来不停的绘制，在绘制中，经过lockCanvas()方法得到Canvas对象进行绘制，并经过unlockCanvasAndPost方法对画布内容进行提交。
整个代码3d

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

    // SurfaceHolder
    private SurfaceHolder mHolder;
    // 用于绘图的Canvas
    private Canvas mCanvas;
    // 子线程标志位
    private boolean mIsDrawing;

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

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

    public TempleSurfaceView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        initView();
    }

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

    @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();
            // draw sth
        } catch (Exception e) {
        } finally {
            if (mCanvas != null)
                mHolder.unlockCanvasAndPost(mCanvas);
        }
    }
}

以上代码知足大部分场景的SurfaceView绘图需求，须要注意的是mHolder.unlockCanvasAndPost(mCanvas)方法放在finally 里面，保证每次内容提交。
接下来，咱们看两个实例，日志

第一个：绘制cos函数

相似示波器，心电图那个波纹一直在绘制的案例。固然View也能够实现的，可是使用SurfaceView的好处，前面就已经说了。
要绘制一个cos函数，只须要不断修改坐标点，并知足cos函数，就能够。使用Path对象来保存cos函数的坐标点，在子线程中whiel循环中，不断改变坐标绘制就能够了。
演示：自动绘制(这里只展现图片)
在这里插入图片描述
代码code

package com.imooc.surfaceviewtest;

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.view.SurfaceHolder;
import android.view.SurfaceView;

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

    private SurfaceHolder mHolder;
    private Canvas mCanvas;
    private boolean mIsDrawing;
    private int x = 0;
    private int y = 0;
    private Path mPath;
    private Paint mPaint;

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

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

    public CosView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        initView();
    }

    private void initView() {
        mHolder = getHolder();
        mHolder.addCallback(this);
        setFocusable(true);
        setFocusableInTouchMode(true);
        this.setKeepScreenOn(true);
        mPath = new Path();
        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        mPaint.setColor(Color.RED);
        mPaint.setStyle(Paint.Style.STROKE);
        mPaint.setStrokeWidth(10);
        mPaint.setStrokeCap(Paint.Cap.ROUND);
        mPaint.setStrokeJoin(Paint.Join.ROUND);
    }

    @Override
    public void surfaceCreated(SurfaceHolder holder) {
        mIsDrawing = true;
        mPath.moveTo(0, 400);
        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();
            x += 1;
            y = (int) (100*Math.cos(x * 2 * Math.PI / 180) + 400);
            mPath.lineTo(x, y);
        }
    }

    private void draw() {
        try {
            mCanvas = mHolder.lockCanvas();
            // SurfaceView背景
            mCanvas.drawColor(Color.WHITE);
            mCanvas.drawPath(mPath, mPaint);
        } catch (Exception e) {
        } finally {
            if (mCanvas != null)
                mHolder.unlockCanvasAndPost(mCanvas);
        }
    }
}

第二个：绘图板

这个案例是用SurfaceView实现一个简单的绘图板，绘图的方法和View的同样，经过Path对象来记录手指滑动的路径进行绘图。在SurfaceView的onTouchEvent()中记录Path路径，代码以下：
演示：手写 王子猪
在这里插入图片描述

代码

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

在draw()方法中进行绘制，代码以下：

private void draw() {
        try {
            mCanvas = mHolder.lockCanvas();
            mCanvas.drawColor(Color.WHITE);
            mCanvas.drawPath(mPath, mPaint);
        } catch (Exception e) {
        } finally {
            if (mCanvas != null)
                mHolder.unlockCanvasAndPost(mCanvas);
        }
    }

咱们一直在不断调用draw()方法，但有时候不须要这么频繁。因此，咱们能够在子线程用sleep操做，节省资源，代码以下：

@Override
    public void run() {
        long start = System.currentTimeMillis();
        while (mIsDrawing) {
            draw();
        }
        long end = System.currentTimeMillis();
        // 50 - 100
        if (end - start < 100) {
            try {
                Thread.sleep(100 - (end - start));
            } catch (InterruptedException e) {
                e.printStackTrace();
            }
        }
    }

经过draw()方法操做的时长来肯定sleep的时长，这是一个通用的解决方案，通常这个值在50~100之间。这篇文章只是SurfaceView的入门，其余的用法，还有待开启研究。
完整代码以下：

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.view.MotionEvent;
import android.view.SurfaceHolder;
import android.view.SurfaceView;

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

    private SurfaceHolder mHolder;
    private Canvas mCanvas;
    private boolean mIsDrawing;
    private Path mPath;
    private Paint mPaint;

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

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

    public SimpleDraw(Context context, AttributeSet attrs,
                      int defStyle) {
        super(context, attrs, defStyle);
        initView();
    }

    private void initView() {
        mHolder = getHolder();
        mHolder.addCallback(this);
        setFocusable(true);
        setFocusableInTouchMode(true);
        this.setKeepScreenOn(true);
        mPath = new Path();
        mPaint = new Paint();
        mPaint.setColor(Color.RED);
        mPaint.setStyle(Paint.Style.STROKE);
        mPaint.setStrokeWidth(40);
    }

    @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();
        // 50 - 100
        if (end - start < 100) {
            try {
                Thread.sleep(100 - (end - start));
            } catch (InterruptedException e) {
                e.printStackTrace();
            }
        }
    }

    private void draw() {
        try {
            mCanvas = mHolder.lockCanvas();
            mCanvas.drawColor(Color.WHITE);
            mCanvas.drawPath(mPath, mPaint);
        } catch (Exception e) {
        } finally {
            if (mCanvas != null)
                mHolder.unlockCanvasAndPost(mCanvas);
        }
    }

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

欢迎关注公众号 拖鞋王子猪 一块儿开心起来。

相关文章
相关标签/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公众号
   欢迎关注本站公众号,获取更多信息
联系我们 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程