Today, I got the book "Introduction to Custom Control Development and Practical Warfare" written by Kai Ship God from leader. It is said that I have finished reading it, at least I won't panic about writing custom view.
The most important thing is to practice more, so the basic design of this book is control development that I haven't touched on (I've summarized some custom View and animation blogs before, including the book of Art Exploration), and I'll write it out.~
There are 500 pages in the book. It is estimated that it will take at least 2-3 months to read and practice every day (graduation soon, a lot of things are thieves), so let's update it slowly.

Note: This book is a note-taking mode, if there is some knowledge I already know in the book, I will not elaborate on it.

Chapter 1 Drawing Basis

1.1 Basic Graphics Drawing
setColor:
Firstly, 0xAARRGBB refers to the degree of transparency, red, green and blue attributes. Hexadecimal system is from 00 - > FF. That is, 0 to 255, 0 is completely transparent, 255 is all coloring, such as 0xFF0000, is pure red, and 0xFF0F0000 will show weak red.

1.2 Region
Region is deliberately a closed area.
Let's look at the construction variables of Region:

public Region(Region region)
public Region(Rect r)
public Region(int left,int top,int right,int bottom)

The first constructor replicates the same Region variable through other Regions.
The second and third constructors are commonly used to construct a rectangular region according to a rectangle or the upper left and lower right corner of the rectangle.

We construct a Region in View.
Example:

 @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        Paint paint = new Paint();
        paint.setStyle(Paint.Style.FILL);
        paint.setColor(Color.RED);

        Region region = new Region(new Rect(50,50,200,100));
        //canvas.drawRegion(region);
    }

We use Region to construct a rectangular Region, but there is no corresponding drawRegion method in canvas, that is to say, canvas can not directly draw a Region, so we define a drawRegion method ourselves.

   public void drawRegion(Canvas canvas,Region region,Paint paint){
        RegionIterator iter = new RegionIterator(region);
        Rect r = new Rect();

        while(iter.next(r)){
            canvas.drawRect(r,paint);
        }
    }

The results are as follows:

As a result, we have written so much with Region that it would be better to use drawRect(50,50,200,100) directly.

It can also be seen from this that Region is not meant to be used for drawing.
A Region can construct a rectangular set by its enumeration type RegionIterator to form a graph approaching the display area.

Region can also be implemented by indirect construction, mainly through its empty constructor and set series functions.
Region's empty constructor

public Region()

set series functions

public void setEmpty()             //To empty an area.
public boolean set(Region region)  //Replace the original Region with the new Region
public boolean set(Rect r)         //Replace a rectangle with the original Region
public boolean set(int left,int top,int right,int bottom)   //Ditto
public boolean setPath(Path path,Region clip)    //A new region is constructed according to the intersection of the region of the path and the region of a certain region.

The last setPath (Path, Region)

Path is the path, and the Region is intersected with the path ahead.
Because there are many ways to construct paths, we can get rid of the limitation that the previous constructor can only set rectangles.
Example:

 //Construct an elliptic path
        Path ovalPath = new Path();
        RectF rect = new RectF(50,50,200,500);
        ovalPath.addOval(rect, Path.Direction.CCW);
        //In setPath, a rectangular area smaller than an elliptical area is passed in and intersected.
        Region rgn = new Region();
        rgn.setPath(ovalPath,new Region(50,50,200,200));

        drawRegion(canvas,rgn,paint);

The results are as follows:

From here, we can see that the most important function of Region is to show the intersecting regions!

Let's look at the operation of intersecting several regions:

1. union() function

boolean union(Rect r)

This function is used to merge with the specified rectangle, adding the rectangle specified by Rect to the current region.
Example:

Paint paint = new Paint();
paint.setColor(Color.RED);
paint.setStyle(Paint.Style.FILL);

Region region = new Region(10,10,200,100);
        region.union(new Rect(10,10,50,300));
        drawRegion(canvas,region,paint);

The results are as follows:

1. In addition to union being able to specify rectangles to be merged, Region provides some more flexible operation functions:

boolean op(Rect r, Op op)
boolean op(int left,int top,int right,int bottom,Op op)
boolean op(Region region,Op op)

The meaning of these functions is to use the current region to intersect with a specified Rect object or Region object and assign the result to the current Region object. If the calculation is successful, return true or false.
The most important one is the Op parameter, which has the following six values:

     */
    public enum Op {
        DIFFERENCE,            //The final region is the complement region of region 1 and region 2.
        INTERSECT,             //The final region is the region where region1 intersects region2.
        UNION,                 //The final region is the region where region1 and region2 are combined.
        XOR,                   //The final region is the region beyond the intersection of region 1 and region 2.
        REVERSE_DIFFERENCE,    //The final region is the region of region 1 and region 2 flip complements
        REPLACE                //The final region is region 2.
    }

Example:

        Paint paint = new Paint();
        paint.setStyle(Paint.Style.STROKE);
        paint.setColor(Color.RED);
        paint.setStrokeWidth(2);
   //First, two rectangles are constructed.
        Rect rect1 = new Rect(100,100,400,200);
        Rect rect2 = new Rect(200,0,300,300);
       //Draw it in the picture first.
        canvas.drawRect(rect1,paint);
        canvas.drawRect(rect2,paint);
        //Constructing two rectangular regions
        Region region1 = new Region(rect1);
        Region region2 = new Region(rect2);

        //Take the complement of two regions
        region1.op(region2, Region.Op.DIFFERENCE);
        paint.setColor(Color.GREEN);
        paint.setStyle(Paint.Style.FILL);
        drawRegion(canvas,region1,paint);

The results are as follows:

You can also directly copy the results to another region:

Region region1 = new Region(100,100,400,200);
Region region2 = new Region(200,0,300,300);
Region region = new Region();
region.op(region1,region2,Region.Op.INTERSECT);

1.3 Canvas Canvas

Canvas can be changed:

1. Translate translation
   The canvas has x and y axes, and the origin (0, 0) is in the upper left corner.
   After the canvas is translated, the origin moves to the upper left corner of the canvas. The translate function is as follows:

void translate(float dx,float dy)

Among them, dx is the offset in horizontal direction, while dy is the offset in vertical direction.
When they are positive, they indicate a positive direction (right down) towards the x and y axes, and vice versa.
Example:

        Paint paint = new Paint();
        paint.setColor(Color.GREEN);
        paint.setStyle(Paint.Style.FILL);

        canvas.translate(100,100);
        Rect rect1 = new Rect(0,0,400,220);
        canvas.drawRect(rect1,paint);

The effect of translat annotation and no annotation is as follows:
(former)
(after)
Obviously, after the canvas translation, the Rect(0,0,400,220) is also drawn, and the coordinate axis changes between the two.

1. The relationship between screen display and Canvas

canvas is not a screen. We can understand it as a drawing action. paint is a pen for drawing. It corresponds to a transparent layer.
Every time drawXXX of canvas is invoked to draw on the layer, a transparent layer is generated first, and then a picture is drawn on the layer, which is then overlaid on the screen. So make a summary of the above:
(1) Every time the drawXXX method of canvas is called, a new transparent layer of canvas is created.
(2) If the translation and rotation of canvas are invoked, the operation is irreversible, and the latest position of each canvas generation is the position after these operations.
(3) When the Canvas layer is combined with the screen, the image beyond the screen will not be displayed.

1. Clip canvas (clip series functions)
   clip function is used to obtain the latest canvas shape by intersecting Rect, Path, Region, union, difference and other set operations. In addition to calling save(), restore() functions, this operation is irreversible, and once Canvas is tailored, it cannot be restored.
   Note: Hardware acceleration should be disabled when cutting canvas.

setLayerType(LAYER_TYPE_SOFTWARE,null);

Chapter 5 is about hardware acceleration.
Some clip functions are:

boolean clipPath(Path path)
boolean clipPath(Path path,Region.Op op)
boolean clipRect(Rect rect,Region.Op op)
boolean clipRegion(Region region)
.....

Anyway, it's tailoring for path, region and rect. It's simpler than that.

Preservation and reply of canvas:

1. save() and restore()
   As mentioned earlier, all canvas clipping operations are irreversible, which can cause great trouble. If you can save the size and status of canvas in real time before operation, you can restore it after operation. So canvas provides the following two functions:

int save()      //Each time the function is called, the current canvas state is saved and placed on a specific stack.
void restore()  //Remove this state from the top of the stack and restore the canvas