Study on android_2d drawing Paint,canvas (I.)

Objective

Android 2D Graphics, are mainly related to 2 categories: Paint,canvas.

One, Paint

A paint brush that specifies the color, size, and so on for a graphic or text.
Common methods:
Setantialias: Sets the brush's jagged effect.
SetColor: Setting Brush colors
Setalpha: Setting alpha value
Settextsize: Sets the font size.
SetStyle: Sets the brush style, hollow or solid.
Setstrokewidth: Sets the hollow border width.

1,helloworld

Starting with the classic HelloWorld, we'll draw a blue, 20sp font size of HelloWorld.
Effect:

Code:

    /** * Font Color * *    Private intMtextcolor =0xff0000ff;/** * Brushes * * *    PrivatePaint Mpaint;/** * Text drawn * *    PrivateString Text ="HelloWorld"; Public Canvasview(context context, AttributeSet attrs,intDefstyle) {Super(Context, attrs, Defstyle);//Initialize brush, set font size, colorMpaint =NewPaint (); Mpaint.settextsize (sp2px ( -));        Mpaint.setcolor (Mtextcolor); SetBackgroundColor (Color.parsecolor ("#fff1f1f1")); } Public Canvasview(context context, AttributeSet attrs) { This(Context, Attrs,0); } Public Canvasview(Context context) { This(Context,NULL); }@Override    protected void onmeasure(intWidthmeasurespec,intHEIGHTMEASURESPEC) {//Set the size of the view to the size of the text        intwidth = (int) Mpaint.measuretext (text);intHeight = (int) Math.Abs (Mpaint.descent ()-mpaint.ascent ());        Widthmeasurespec = Measurespec.makemeasurespec (width, measurespec.exactly); Heightmeasurespec = Measurespec.makemeasurespec (height, measurespec.exactly);Super. Onmeasure (Widthmeasurespec, Heightmeasurespec); }@Override    protected void OnDraw(Canvas canvas) {//Draw text on canvas with parameters: text string, offset of text x and y, brushCanvas.drawtext (Text,0, GetHeight ()-mpaint.descent (), mpaint); }Private int sp2px(intValue) {return(int) typedvalue.applydimension (typedvalue.complex_unit_sp, Value, Getresources (). Getdisplaymetrics ()); }

Initialize the brush in the constructor, and then onDraw() call the canvas's method in the method drwaText() . To be precise, I set the height and width of the view to the width and height of the text. This also involves the issue of font offset, which is discussed later.

Two, Canvas

A canvas canvas, like a blackboard, can be understood as a drawing background.
Common methods:
Drawcolor (); Set Canvas background color
DrawLine (); line
DrawRect () Rectangle
Drawroundrect (); Rounded Rectangle
DrawArc (); Arc, 0° three O'Clock
Drawcircle ();

1, line

Start with the simplest geometry and learn how to use canvas.
Effect:

Code:

mPaint.setStrokeWidth(dp2px(2));canvas.drawLine(01010, mPaint);

Set the brush width to draw a line. In the DrawLine () method, the first two parameters are point coordinates (X1,Y1), 3rd, 4 are the coordinates of the second point (X2,y2), and the last is the brush.

2, Rectangle

Effect:

Code:

    mPaint.setStrokeWidth(dp2px(2));    //设置风格为空心轨迹    mPaint.setStyle(Style.STROKE);    RectF rectF = new RectF(getWidth()/210, getWidth()-10, getHeight()-10);    canvas.drawRoundRect1010, mPaint);

The style of the paint is set to the hollow trajectory, the rectangle is drawn according to the coordinates of the 2 points, and the rounded rectangle is drawn in a rectangle. The parameters and lines of the DrawRect () method are exactly the same, and are plotted according to 2 coordinate points. Drawroundrect () method parameters are rectangles, rounded corners in the x direction, rounded corners in the y direction, brushes

3, round

Effect:

Code:

canvas.drawCircle(getWidth()/2, getHeight()/2, getWidth()/2-30, mPaint);    

Once the brush is set again, draw the circle. The parameters are: the coordinate of the center (x1,y1), the radius of the circle, and the brush.

4, Arc

Effect:

Code:

    //设置画笔抗锯齿（圆滑）        mPaint.setAntiAlias(true);        new RectF(00, getWidth()/2, getHeight());        090true, mPaint);        new RectF(getWidth()/20, getWidth(), getHeight());        090false, mPaint);

The arc is drawn in a rectangle, so we first initialize a rectangle, and then in the rectangle, draw the arc. DrawArc () method parameters are: Rectangle, ARC Center coordinate (x1,y1), whether to connect dots, brush.

5, picture

Original Picture:

Effect:

Code:

Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.star);        canvas.drawBitmap1010, mPaint);

Copy the picture to the Drawable folder, generate the Bitmap object, and draw it through canvas.
The Drawbitmap () method parameters are: Bitmap object, X-direction offset, y-direction offset, brush.

Three, Path

Through the path class, we can draw triangles, trapezoidal and other polygons.
Common methods:
MoveTo (); Set location
LineTo (); Connect 2 points
Close (); Connect start and end

1, Triangle

Effect:

Code:

        angle = new Path();        angle.moveTo(500);//设置起点        angle.lineTo(0100);        angle.lineTo(100100);        angle.close();//闭合路径        canvas.drawPath(angle, mPaint);

Draw on the canvas by creating a triangular path.

Study on android_2d drawing Paint,canvas (I.)