have been interested in painting, but the graphics mechanism of Android still have to bite the bullet to learn
Painting is the use of paint (brush) in the canvas (canvas) to draw a variety of graphics, draw rectangles, circles, triangles and other points of the 2-dimensional graphics
Rectangular DrawRect (float left, float top, float right, float bottom, paint paint) canvas.drawrect (p aint); Round drawcircle (float CX, float CY, float radius, paint paint) canvas.drawcircle (WIDTH/2, HEIGHT/2, Max, paint ); Triangle (Draw line)//instantiation path paths Path = new path (); Path.moveto (80, 300);//This point is the beginning of the polygon Path.lineto (120, 250); Path.lineto (80, 250); Path.close (); Make these points form a closed polygon canvas.drawpath (path, paint); Fan RECTF (float left, float top, float right, float bottom) rectf RECTF = new RECTF (160, 200, 400, 400); DrawArc (RECTF oval, float startangle start radian, float SweepAngle swept arc, Boolean usecenter, paint paint) Canvas.drawa RC (RECTF, N, +, True, paint); Ellipse RECTF = new RECTF (300, 300, 600, 600); Set (float left, float top, float right, float bottom) rectf.set (210,100,450,200); DrawOval (RECTF oval, paint paint) canvas.DrawOval (RECTF, paint); Curve//Set Hollow Paint.setstyle (Paint.Style.STROKE); Path = new Path (); Path.moveto (500, 500);//sets the starting point of Path Path.quadto (550, 510, 670, 600); Set the path point and end point Canvas.drawpath (path, paint); text + picture paint.settextsize (30); Text DrawText (String text, float x, float y, paint paint) canvas.drawtext ("Slack", X, N, paint); Bitmap Bitmap = Bitmapfactory.decoderesource (Getresources (), r.mipmap.ic_launcher); Image Drawbitmap (Bitmap Bitmap, float left, float top, paint paint) canvas.drawbitmap (Bitmap,----);
There are several important methods for canvas, such as the concept of layers in PS, rotation, and displacement , which are used in drawing.
/* * Canvas.save () Save the previous image so that subsequent operations can operate like a new canvas * canvas.restore () Merge layers * Canvas.translate () translates the starting point in the upper-left corner of the default coordinate point when we draw it, then after we call translate (x, y), all the drawings that were moved to (x, Y) after the origin (0,0) are executed at this point * canvas.roate () rotate * * */
draw a clock, and you understand that.
Draw clock//draw Outer circle paint paintcircle = new paint (); Paintcircle.setantialias (TRUE); Paintcircle.setstyle (Paint.Style.STROKE); Paintcircle.setstrokewidth (5); Canvas.drawcircle (WIDTH/2, HEIGHT/2, WIDTH/3, paintcircle); Paint scale paint Paintdegree = new paint (); Paintdegree.setstrokewidth (3); Canvas.rotate (WIDTH/2, HEIGHT/2); for (int i = 1; i <=; i++) {//difference between the hour and the non-hour if (i = = 3 | | i = = 6 | | i = = 9 | | i = = 12) { Paintdegree.setstrokewidth (5); Paintdegree.settextsize (30); DrawLine (float StartX, float starty, float stopx, float stopy, paint paint) canvas.drawline (WIDTH/2, HEIGHT/2-WIDTH/3, WIDTH/2, HEIGHT/2-WIDTH/3 +, paintdegree); String degree = string.valueof (i); Canvas.drawtext (degree, WIDTH/2-paintdegree.measuretext (DEGree)/3, HEIGHT/2-WIDTH/3 + paintdegree); } else {paintdegree.setstrokewidth (3); Paintdegree.settextsize (15); A point on the circle (x = half of the screen width, y = half-radius of the screen) Canvas.drawline (WIDTH/2, HEIGHT/2-WIDTH/3, WIDTH/2, HEIGHT/2-WIDTH/3 +, paintdegree); String degree = string.valueof (i); Canvas.drawtext (degree, WIDTH/2-paintdegree.measuretext (degree)/3, HEI GHT/2-WIDTH/3 +, paintdegree); }//By rotating the canvas-actually rotating the drawing axis to simplify the coordinate operation Canvas.rotate (WIDTH/2, HEIGHT/2); } canvas.save (); Paint pointer paint painthour = new paint (); Painthour.setstrokewidth (15); Paint Paintminute = new paint (); Paintminute.setstrokewidth (10); When drawing the default coordinates point to the starting point of the upper left corner, then we call translate (x, y), then the origin (0,0) is moved to (x, y) after all the drawings are executed at this pointCanvas.translate (WIDTH/2, HEIGHT/2); Canvas.drawpoint (0, 0, painthour);//Dot canvas.drawline (0, 0, +, +, painthour); Canvas.drawline (0, 0, -200, Paintminute); Canvas.restore ();
Simulation of Scratch music
Porterduffxfermode scraping music through dst_in. src_in mode to achieve the effect of turning a rectangle into a rounded picture mpaint = new Paint (); Mpaint.setalpha (0); Mpaint.setxfermode (New Porterduffxfermode (PorterDuff.Mode.DST_IN)); Mpaint.setstyle (Paint.Style.STROKE); Mpaint.setstrokejoin (Paint.Join.ROUND); Mpaint.setstrokewidth (+); Mpaint.setstrokecap (Paint.Cap.ROUND); MPath = new Path (); CreateBitmap (int width, int height, bitmap.config Config) Mfgbitmap = bitmap.createbitmap (width, height, Bitmap. config.argb_8888); Mcanvas = new Canvas (mfgbitmap); Mcanvas.drawcolor (Color.gray);
/** * Touch Event * Draw a transparent line curve * @param event * @return */@Override public boolean ontouchevent (Moti OnEvent event) {switch (event.getaction ()) {case MotionEvent.ACTION_DOWN:mPath.reset () ; LASTX = Event.getx (); Lasty = Event.gety (); Mpath.moveto (LASTX, lasty);//Start break; Case MotionEvent.ACTION_UP:mPath.lineTo (Event.getx (), event.gety ()); Break Case Motionevent.action_move://move, record this time the point location mpath.quadto (LASTX, Lasty, Event.getx (), Event . GetY ()); Set curve path point and end point lastx = Event.getx (); Lasty = Event.gety (); Break } mcanvas.drawpath (MPath, mpaint); Invalidate (); return true; }
@Override public void Draw (canvas canvas) { super.draw (canvas); Scratch Le canvas.drawbitmap (mfgbitmap, 0, 0, null); }
Surfaceview is mainly used for frequent refreshes, making an artboard
Simple and easy to use Surfaceview
Online thread handling of painting events, labeling code
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 Use of Android.view.motionevent;import android.view.surfaceholder;import android.view.surfaceview;/** * SurfaceView * Created by chenling on 2016/5/9. * 1.View is primarily used for automatic updates, while SURFACEVICW is primarily intended for passive updates, such as frequent refresh * 2.View is refreshed in the main thread, and Surfaceview typically uses a thread to refresh the page. * 3.View does not have a double buffering mechanism when drawing, and SURFACEVICW has implemented double buffering mechanism in the underlying implementation mechanism; */public Class Surfaview extends Surfaceview implements Surfaceholder.callback, Runnable {//surfaceholder private surfaceholder mholder; Canvas private canvas mcanvas for plotting; Child thread Flag bit private Boolean misdrawing; private float lastx,lasty; Private Path MPath; Private Paint Mpaint; /** * Construction Method * * @param context * @param attrs */Public Surfaview (context context, AttributeSet attr s) {Super (context, attrs); MPath = new Path (); Mpaint = new Paint (); Mpaint.setstrokewidth (20); Mpaint.setantialias (TRUE); Mpaint.setstyle (Paint.Style.STROKE); Mholder = Getholder (); Mholder.addcallback (this); Setfocusable (TRUE); Setfocusableintouchmode (TRUE); Setkeepscreenon (TRUE); }//Create @Override public void surfacecreated (Surfaceholder holder) {misdrawing = true; New Thread (This). Start (); }//change @Override public void surfacechanged (surfaceholder holder, int format, int width, int height) {}/ /Destroy @Override public void surfacedestroyed (Surfaceholder holder) {misdrawing = false; } @Override public void Run () {while (misdrawing) {draw ();//Lastx + = 1;// Lasty = (int) (Math.sin (LASTX * 2 * math.pi/180) + +);//Mpath.lineto (LASTX, lasty); }}//responsible for painting, frequent refresh of private void Draw () {try {Mcanvas = Mholder.lockcanvas (); Mcanvas.drawcolor (Color.White); Mcanvas.drawpath (MPath, mpaint); } catch (Exception e) {} finally {if (Mcanvas! = null) {//commits mholder.un Lockcanvasandpost (Mcanvas); }}}/** * Touch event * * @param event * @return */@Override public boolean Ontoucheven T (Motionevent event) {lastx = Event.getx (); Lasty = Event.gety (); Switch (event.getaction ()) {case MotionEvent.ACTION_DOWN:mPath.moveTo (LASTX, lasty); Break Case MotionEvent.ACTION_MOVE:mPath.lineTo (lastx,lasty); Break Case MotionEvent.ACTION_UP:break; } return true; }}
Annex: Source code:Https://github.com/CL-window/android_paint
Android's Drawing