1.Android canvas基本API:

矩形的点: drawPoint()
线: drawLine()
矩形:drawRect()
多边形:drawVertices()
弧:drawArc
oval :指定圆弧的外轮廓矩形区域。
startAngle: 圆弧起始角度，单位为度。
sweepAngle: 圆弧扫过的角度，顺时针方向，单位为度,从右中间开始为零度。
useCenter: 如果为True时，在绘制圆弧时将圆心包括在内，通常用来绘制扇形
椭圆:drawOval
绘制文本:drawText
指定位置绘制文本: drawPosText
绘制路径:drawPath() //其实位置默认是控件左上角(0,0) ,如果想让起始位置改变只需要调用mPath.moveTo(x,y);
圆形:drawCircle()//也能绘制圆角矩形
设置抗锯齿:setAntiAlias()
设置颜色:setColor();
设置ARGB:setARGB()
设置字体大小:setTextSize()
设置画笔风格:setStyle()//空心:STROKE 实心:FILL
设置空心边框的宽度: setStrokeWidth();
Canvas.save() 保存画布,后续操作可以理解为在一个新的图层上操作一样
Canvas.restore() 将save()后绘制的图像与save()之前的图像进行合并
Canvas.translate(x, y);移动至(x,y)坐标点
Canvas.rotate(X);画布旋转X度
canvas.scale(scale, scale,Width/2,Height/2);//以中心点缩放
canvas.scale(scale, scale);//以(0,0)位中心进行缩放

public class ScaleView extends View {

    private Paint paintBot = null;
    private Bitmap mRobotBitmap = null;

    private float dx = 0;
    private float dy = 0;
    private float scale = 1f;
    private PointF pointF = new PointF();
    private final int ACTION_DOWN = 1;
    private final int ACTION_POINTER_DOWN = 2;
    private final int ACTION_POINTER_UP = 0;
    private int mode = ACTION_POINTER_UP;

    private float old_x_down = 0;
    private float old_y_down = 0;
    private float old_translate_x = 0;
    private float old_translate_y = 0;

    private float oldScale = 1;
    private float oldDist = 1f;

    private int Height = 0;
    private int Width = 0;

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

    public ScaleView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public ScaleView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }


    public void init() {
        mRobotBitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.ic_launcher);
        Matrix matrix = new Matrix();
        matrix.setScale(0.7f, 0.7f);
        mRobotBitmap = Bitmap.createBitmap(mRobotBitmap, 0, 0, mRobotBitmap.getWidth(), mRobotBitmap.getHeight(), matrix, true);
        //图标
        paintBot = new Paint();
        paintBot.setAntiAlias(true);
        paintBot.setDither(true);
        paintBot.setFilterBitmap(true);
    }

 @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        Width = w; // 获取宽度
        Height = h; // 获取高度
}
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        canvas.scale(scale, scale, Width / 2, Height / 2);
        canvas.translate(dx, dy);
        canvas.drawBitmap(mRobotBitmap, Width / 2, Height / 2, paintBot);
    }


    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction() & MotionEvent.ACTION_MASK) {
            case MotionEvent.ACTION_DOWN:
                mode = ACTION_DOWN;
                old_x_down = event.getX();
                old_y_down = event.getY();
                break;
            case MotionEvent.ACTION_POINTER_DOWN:
                mode = ACTION_POINTER_DOWN;
                oldDist = spacing(event);
                float x = event.getX(0) + event.getX(1);
                float y = event.getY(0) + event.getY(1);
                pointF.set(x / 2, y / 2);
                break;
            case MotionEvent.ACTION_MOVE:
                if (mode == ACTION_POINTER_DOWN) {
                    float newDist = spacing(event);
                    float newScale = (newDist) / oldDist * oldScale;
                    if (newScale > 2) {
                        newScale = 2;
                    }
                    if (newScale < 1) {
                        newScale = 1;
                    }
                    scale = newScale;
                    oldDist = newDist;
                    oldScale = newScale;
                } else if (mode == ACTION_DOWN) {
                    float new_d_x = event.getX() - old_x_down + old_translate_x;
                    float new_d_y = event.getY() - old_y_down + old_translate_y;
                    dx = new_d_x;
                    dy = new_d_y;
                    old_x_down = event.getX();
                    old_y_down = event.getY();
                    old_translate_x = dx;
                    old_translate_y = dy;
                }
                break;
            case MotionEvent.ACTION_UP:
            case MotionEvent.ACTION_POINTER_UP:
                mode = ACTION_POINTER_UP;
                break;
        }
        invalidate();
        return true;
    }

    private float spacing(MotionEvent event) {
        float x = event.getX(0) - event.getX(1);
        float y = event.getY(0) - event.getY(1);
        return (float) Math.sqrt(x * x + y * y);
    }


    public void release() {
        if (mRobotBitmap != null && !mRobotBitmap.isRecycled()) {
            mRobotBitmap.recycle();
            mRobotBitmap = null;
        }
    }
}

---

2.SurfaceView和View的区别:

• View主动使用于主动更新的情况,SurfaceView主动使用于被动更新(频繁刷新);
• 一般情况下,SurfaceView需要在子线程中进行页面刷新;
• View在绘图时没有使用双缓存机制,而SurfaceView在底层使用机制中就已经实现了双缓存机制;

总结一句话就是:

如果你自定义View需要频繁刷新,或者刷新时数据处理量比较大,那么你可以考虑使用SurfaceView来代替View;

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

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

    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);
        this.setKeepScreenOn(true);
        mPaint= new Paint(Paint.ANTI_ALIAS_FLAG | Paint.DITHER_FLAG | Paint.FILTER_BITMAP_FLAG);
        mPaint.setStrokeWidth(10f);
        mPaint.setStyle(Paint.Style.STROKE);
        mPaint.setStrokeJoin(Paint.Join.ROUND);
        mPaint.setStrokeCap(Paint.Cap.ROUND);
        mPaint.setAntiAlias(true);
        mPaint.setColor(Color.RED);
        mPath = new Path();
    }

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

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

    }

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

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

    private void draw() {

        try {
            mCanvas = mHolder.lockCanvas();
            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) {
        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;
        }
        return true;
    }
}

---

3.Later图层:

saveLater()和saveLayerAlpha()将一个图层入栈,使用restore()、restoreToCount()将图层出栈;
入栈时候,后面所有操作都会发生在这个图层上,出栈的时候.则会将图层绘制到上层Canvas上;

---

4.颜色矩阵(ColorMatrix):

设置色调:
setRotate(int axis,float degree);第一个参数分别用:0,1,2代表Red,Green,Blue;

ColorMatrix matrix = new ColorMatrix();
matrix.setRotate(0,mHueValue);
matrix.setRotate(1,mHueValue);
matrix.setRotate(2,mHueValue);

设置饱和度:
setSaturation():饱和度为0时,图像会变成灰度图像;

ColorMatrix matrix = new ColorMatrix();
matrix.setSaturation(saturation);

设置亮度:
setScale():亮度为0时,图像会变全黑;

ColorMatrix lumMatrix = new ColorMatrix();
lumMatrix.setScale(lum,lum,lum,1);

叠加效果:
postConcat():将矩阵的作用效果混合,生成叠加处理后的效果

ColorMatrix matrix = new ColorMatrix();
matrix.postConcat(hueMatrix);
matrix.postConcat(saturationMatrix);
matrix.postConcat(lumMatrix);

注意事项:Paint类需要通过setColorFilter()来将colorMatrix构造的colorMatrixColorFilter对象传进来,并
使用这个paint来绘制原来的图像,从而将颜色阵列作用到原图上;

paint.setColorFilter(new ColorMatrixColorFilter(matrix));

像素点分析:

Bitmap.getPixels(pixels,offset,stride,x,y,width,height);

1.pixels:接收位图颜色值的数组
2.offset:写入pixels[]中的第一个像素索引值
3.stride:pixels[]中的行间距
4.x:第一像素的x坐标值
5.y:第一像素点的y坐标值
6.width:从每一行中读取的像素宽度
7.height:读取的行数
一般用法:

     int oldPx[] =new int[Width*Height];
        int newPx[] =new int[Width*Height];
        int color;
        int r,g,b,a;
        for (int i=0;i<Width;i++){
            color = oldPx[i];
            r =Color.red(color);
            g =Color.green(color);
            b =Color.blue(color);
            a =Color.alpha(color);

            r = 255 - r;
            g = 255 - g;
            b = 255 - b;

            if(r>255){
                r=255;
            } else if(r<0){
                r=0;
            }

            if(g>255){
                g=255;
            } else if(g<0){
                g=0;
            }

            if(b>255){
                b=255;
            } else if(b<0){
                b=0;
            }
            newPx[i] = Color.argb(a,r,g,b);
        }
        bitmap.getPixels(newPx,0,bm.getWidth(),0,0,width,height);

老照片算法:

rl = (int)(0.393*r + 0.769*g + 0.189*b);
gl = (int)(0.349*r + 0.686*g + 0.168*b);
bl = (int)(0.272*r + 0.534*g + 0.131*b);

浮雕效果:
若存在ABC三个像素点,要求对B点对应的浮雕效果算法:

B.r = C.R - B.r + 127;
B.g = C.g - B.g + 127;
B.b = C.b - B.b + 127;

底片效果:

B.r = 255 - B.r;
B.g = 255 - B.g;
B.b = 255 - B.b;

---

矩阵变化:
初始化的矩阵为:

⎡ 1  0  0  0  0 ⎤  0
⎢ 0  1  0  0  0 ⎥  6
⎢ 0  0  1  0  0 ⎥ 12
⎣ 0  0  0  1  0 ⎦ 18

规则是: 横*竖

图片中的符号含义:
a, b, c, d, e 表示三原色中的红色
f, g, h, i, j 表示三原色中的绿色
k, l, m, n, o 表示三原色中的蓝色
p, q, r, s, t 表示颜色的透明度

PorterDuff.Mode: 原始图片 dst 后绘制 src

图像合成效果示意图

5.XML绘图:

1.Shape属性:
1)..Corners:定义圆角;

<corners    //定义圆角   
    android:radius="dimension"      //全部的圆角半径   
    android:topLeftRadius="dimension"   //左上角的圆角半径   
    android:topRightRadius="dimension"  //右上角的圆角半径   
    android:bottomLeftRadius="dimension"    //左下角的圆角半径   
    android:bottomRightRadius="dimension" />    //右下角的圆角半径   

2).solid:填充内部颜色

<solid android:color="@color/colorAccent"/>

3).gradient:定义渐变色:

<gradient
        android:angle="integer"
        android:centerX="integer"
        android:centerY="integer"
        android:centerColor="integer"
        android:endColor="color"
        android:gradientRadius="integer"
        android:startColor="color"
        android:type=["linear" | "radial" | "sweep"]
        android:useLevel=["true" | "false"] />

4).stoke:指定边框:

    <stroke
        android:width="5dp"
        android:color="@android:color/holo_green_dark"
        android:dashWidth="10dp"
        android:dashGap="10dp"/>

shape示例代码:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <corners
        android:radius="5dp"
        android:topLeftRadius="5dp"
        android:topRightRadius="5dp"
        android:bottomLeftRadius="5dp"
        android:bottomRightRadius="5dp"/>

    <!--angle:渐变角度-->
    <gradient
        android:angle="45"
        android:centerX="0.5"
        android:centerY="0.5"
        android:centerColor="@android:color/black"
        android:endColor="@color/colorAccent"
        android:gradientRadius="5dp"
        android:startColor="@color/colorPrimaryDark"
        android:type="linear"
        android:useLevel="false"/>

    <padding
        android:bottom="10dp"
        android:left="10dp"
        android:right="10dp"
        android:top="10dp" />

    <!--填充颜色-->
    <!--<solid android:color="@android:color/holo_blue_bright"/>-->

    <!--dashGap:虚线间距宽度-->
    <!--dashWidth:虚线宽度-->
    <stroke
        android:width="5dp"
        android:color="@android:color/holo_green_dark"
        android:dashWidth="10dp"
        android:dashGap="10dp"/>

2..selector:可以根据事件设置不同图像;
1).shape的形状，默认为矩形，可以设置为矩形（rectangle）、椭圆形(oval)、线性形状(line)、环形(ring)
2).下面的属性只有在android:shape="ring时可用：
a).android:innerRadius 尺寸，内环的半径。
b).android:innerRadiusRatio 浮点型，以环的宽度比率来表示内环的半径，
c).android:thickness 尺寸，环的厚度
d).android:thicknessRatio 浮点型，以环的宽度比率来表示环的厚度，例如，如果android:thicknessRatio="2"，
e).android:useLevel boolean值，如果当做是LevelListDrawable使用时值为true，否则为false.
selector示例代码:

<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <!--是否按下-->
    <item android:state_pressed="true">
        <!--设置为矩形-->
        <shape android:shape="rectangle">

            <!--填充颜色-->
            <solid android:color="@color/colorAccent" />

            <!--圆形角-->
            <corners android:radius="5dp" />

            <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" />
        </shape>
    </item>

    <item>
        <shape android:shape="rectangle">
            <solid android:color="@color/colorPrimaryDark" />

            <corners android:radius="5dp" />
            <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" />
        </shape>

    </item>
</selector>

---

6.自定义绘制步骤:

1.方法: 重写绘制方法(最常用:onDraw());

2.绘制的关键:Canvas
a).Canvas的绘制类方法:drawXXX() (关键参数:Paint);
b).Canvas的辅助类方法:范围裁切(clipxxx())和几何变形(Matrix)
3.使用不同的绘制方法来控制遮盖关系;
4.在View中比较重要的回调方法:
a).onFinishInflate();//在XML加载组件后回调;
b).onSizeChanged();//组件大小改变时回调;
c).onMeasure();//回调方法来进行测量;
b).onLayout();//回调该方法来确定显示的位置;
d).onTouchEvent();//监听到触摸事件时回调.

---

7.Canvas 对绘制的辅助:

1.范围裁切:
a).clipRect()和cliPath();
2.几何变形:
a).Canvas.translate/rotate/scale/skew();
b).Matrix.pre/postTranslate/Rotate/Scate/Skew() 及自定义转化;
c).Camera.rotate()Camera.setLocation:三维变换

---

8.属性动画

1.ViewPropertyAnimator
a).View,animate();
b).配合translationX() translationY() alpha() rotation() scaleX() 等方法

2.ObjectAnimator
a).ObjectAnimator.ofXXX() 创建Animator对象
b).start()执行动画;

3.功能:
a).setDuration;设置时长;
b).setInterpolator():设置速度模型;
c).设置监听器;

---

9.View提供获取坐标的方法:

1.getTop(): 获取到的是View自身的顶边到其父布局顶边的距离;
2.getLeft(): 获取到的是View自身的左边到其父布局的左边的距离;
3.getRight(): 获取到的是View自身的右边到其父布局的左边的距离;
4.getBottom(): 获取到的是View自身的底边到其父布局顶边的距离;

---

10.MotionEvent提供的方法:

1.getX():获取点击事件距离控件左边的距离,即视图坐标;
2.getY():获取点击事件距离控件顶边的距离,即视图坐标;
3.getRawX(): 获取点击事件距离整个屏幕左边的距离,即绝对坐标;
4.getRawY(): 获取点击事件距离整个屏幕顶边的距离,即绝对坐标;

---

关于ColorMatrix: https://www.jianshu.com/p/ebda27f061e3
参考:
https://www.cnblogs.com/MianActivity/p/5867776.html
https://juejin.im/post/5962a3746fb9a06ba2687226
《Android群英传》