A summary of the common methods of canvas in Android _android

First, the operation of the canvas

A series of operations on canvas refers to the operation of rotating, translating and scaling canvas.

These operations make it easier for canvas objects to be used.

Second, canvas translation

/** 
 * Canvas to (100,50) Direction translation 
 * 
 * parameter 1: Move to the x-axis direction 100 distance 
 * Parameter 2: Move to the y-axis direction 50 distance
 /canvas.translate (100, 50) ;

Third, canvas scaling

/** 
 * In the direction of the x-axis is twice times larger, y-axis of the original 4 times times 
 * parameter 1:x axis magnification 
 * parameter 2:y axis magnification * *
Canvas.scale (2, 4);

/** 
 * In the direction of the x-axis is twice times larger, the y-axis direction of the original 4 times times 
 * parameter 1:x axis magnification * parameter 
 2:y axis magnification 
 * Parameter 3: origin x coordinate
 * Parameter 4: Origin y coordinate
 * /
Canvas.scale (2, 4,100,100);

Four, canvas rotation

/** 
 * Origin is the center, rotate 30 degrees (clockwise direction)
 * Parameter: Rotation angle * *
canvas.rotate ();

/** 
 * to (100,100) as the center, rotate 30 degrees, clockwise direction is the positive direction 
 * Parameters: Rotation angle * *
canvas.rotate (30,100,100);

Five, canvas operation example

 Paint p = new Paint ();
 P.setcolor (Color.argb (50,255,100,100));
 Canvas.drawrect (0,0,200,200,P); Draw a rectangle with the original canvas 1
 canvas.translate (300,300);//Translate canvas (100,100)
 P.setcolor (Color.argb ( 50,100,255,100));
 Canvas.drawrect (0,0,200,200,P); Rectangular 2
 canvas.rotate (30);//Canvas rotate
 p.setcolor (Color.argb (50,100,0,255));
 Canvas.drawrect (0,0,200,200,P); Rectangular 3
 Canvas.scale (2, 2);//canvas to the origin of the original point, magnified twice
 times P.setcolor (Color.argb (50,255,255,0));
 Canvas.drawrect (0,0,200,200,P); Rectangle 4

Vi. Canvas Save and restore

Canvas provides several methods that allow us to easily change and restore the state of the canvas.

These methods are: save() , restore() , restoreToCount(int saveCount) .

When we translate, rotate and enlarge the canvas, we can call the save() method, save the current modified canvas state, and call the method to restore the canvas to the restore() nearest save() state.

save()The method also has a return value, and we can call the restoreToCount(int saveCount) method, passing the return value as a parameter, to restore the canvas to a particular save() state.

 Canvas.translate (100,100); Translate (100,100)
 int save1 = Canvas.save ();//Save Canvas State (State 1)
 Canvas.scale (2, 2);//enlarge twice times
 int save2 = Canvas . Save (); Save the canvas state (state 2)
 Canvas.restore ();//Return to the latest save state, that is, State 2
 Canvas.restoretocount (save1);//Return to status 1 manually specified

Six, canvas drawing example

1. Painting text

/** 
 * Parameter 2: The start position of the x axis of the text 
 * Parameter 2: End position of the text y-axis 
 * Parameter 3: Brush object 
/Canvas.drawtext ("Start writing!") ", M, p); 

/** 
 * Parameter 2: To draw from the first few words 
 * Parameter 3: To draw to the first few text 
 * Parameter 4: The start position of the x-axis of the text 
 * Parameter 5: End position of the text y axis 
 * Parameter 6: Brush object 
/Canvas.drawtext ("Start writing!") ", 2,5, M, p); Draw text, the result is:" Write " 
/** 
 * Parameter 2: path 
 * Parameter 3: Offset from the start of the path 
 * Parameter 4: Offset from the path (can be negative) 
 * Parameter 5: Brush object 
/Canvas.drawtextonpath ("1234567890101123123", path, 0, -50, p);

2. Draw a Circle

/**
 * Parameter 1: center x 
 * Parameter 2: center y 
 * Parameter 3: radius r 
 * Parameter 4: Brush object   
/canvas.drawcircle (MB, p);

3. Draw Line

* 
 * parameter 1:startx 
 * parameter 2:starty 
 * parameter 3:stopx 
 * parameter 4:stopy 
 * Parameter 5: Brush object 
/canvas.drawline (100, M/n, p)//Draw Line/ 
* Draw 
 multiple lines at the same time. 
 * Parameter 1:float array: Each four group is a line. The last less than four, ignore those values. 
 * Parameter 2: Brush object 
/canvas.drawlines (New float[]{100,100,200,200,200,100,300,100}, p);

4. Draw Ellipse

/ 
 * Parameter 1:float left 
 * parameter 2:float top 
 * parameter 3:float right 
 * parameter 4:float bottom/RECTF 
oval = NE W RECTF (150, 200, 500, 400);//Draw an elliptical 
canvas.drawoval (oval, p);

5. Draw radians

/**
 * Draw arc
 * Parameter 1:RECTF object. 
 * Parameter 2: the starting angle. (horizontal to 0 degrees clockwise) 
 * Parameter 3: Swept angle 
 * Parameter 4: Whether and center line 
 * Parameter 5: Brush Object * * 
Canvas.drawarc (Oval, 20, 180, False, p);

6. Rectangle

/** 
 * Rectangular * Parameters 
 1:float left 
 * Parameters 2:float Top 
 * Parameters 3:float right 
 * parameters 4:float Bottom 
* * Canvas.drawrect (100,100, p); 

Draw Rounded Rectangle 
rectf oval3 = new RECTF (80, 260, 200, 300);//Set up a novel rectangle 
canvas.drawroundrect (OVAL3, 5, p);//The second parameter is the x radius , and the third parameter is the Y radius

7. Polygon

 
 the/** * Path class encapsulates a composite (the path of the multi-contour geometry is 
 made from a straight line segment *, a two-time curve, and a three-time curve, which can also be painted in oil painting.) DrawPath (path, paint), either filled or stroked 
 * (based on the paint style), or can be used to cut or draw text in the path. 
 */ 
Path PATH = new Path (); Path Object 
Path.moveto (80, 200);//This point is the starting point of the polygon 
(Path.lineto); 
Path.lineto (); 
//.... You can add multiple points. Form 
a polygon path.close ();//Make the end point and the starting point link to form a closed graph 
  canvas.drawpath (path, p);

8. Draw Bezier Curve

P.setstyle (Style.stroke); 
Path path2=new path (); 
Path2.moveto (100, 100);//Set the starting point of path 
/** 
 * Parameter 1, 2:x1,y1 the coordinate value of the control point 
 * Parameter 3, 4:X2,Y2 is the coordinate value 
of the endpoint * * Path2.quadto (300, 100, 400, 400); Sets the control point coordinates and the endpoint coordinates of the Bezier curve (Path2.quadto, V, v 
); 
Canvas.drawpath (path2, p);//Draw Bezier Curves

9, Draw Point

/** 
 * Parameters 1, 2: The x, y coordinate of the points/ 
Canvas.drawpoint (P), 390.//Draw a point 
/** 
 * Parameter 1: Multiple points, each two value is a point. The last number is not two values, ignored. 
 * * 
canvas.drawpoints (New float[]{60,400,65,400,70,400}, p);//Draw multiple points

10. Painting pictures

Bitmap Bitmap = Bitmapfactory.decoderesource (Getresources (), r.drawable.ic_launcher); 
/** 
 * Parameter 1:bitmap object 
 * Parameter 2: Image left coordinate point 
 * Parameter 3: Image top Coordinate point * * * 
canvas.drawbitmap (Bitmap, 200,300, p);

Vii. Summary

The above is the entire content of this article, I hope that the study or work can have some help, if you have questions can leave a message.