Android自定義控件之基本圖形繪制

入門示例代碼

在Android中Paint類就是畫筆,Canvas 就是畫布

對於畫筆的大小,粗細,顏色,透明度都在paint類中設置,對於畫出的成品,比如圓,方形,等在canvas類中的函數生成

入門案例:

package com.loaderman.customviewdemo.paint;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.view.View;
public class BasisView extends View {
    public BasisView(Context context) {
        super(context);
    }

    public BasisView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
    }

    public BasisView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        Paint paint = new Paint();//畫筆
        paint.setColor(Color.RED);//設置顏色
        paint.setStyle(Paint.Style.STROKE); // 填充樣式//Paint.Style.FILL填充內部  Paint.Style.FILL_AND_STROKE 填充內部和描邊 Paint.Style.STROKE  僅描邊
        paint.setStrokeWidth(50);//描邊寬度值
        canvas.drawCircle(190,200,150,paint);//繪制圓
    }
}

---

畫筆的基本設置

• setColor(int color)設置畫筆顏色

參數color由0xAARRGGBB 組成 ,A代表透明度,R代表紅色值,G代表綠色值,B代表藍色值

• setStyle(tStyle style)設置填充樣式

參數styl取值如下:

1. 　　Paint.Style.FILL                                     填充內部
2.        Paint.Style.FILL_AND_STROKE            填充內部和描邊
3.        Paint.Style.STROKE                              僅描邊

• setStrokeWidth(float width)

width參數單位是px,當畫筆的樣式不為FILl時有效

• setAntiAlias(boolean aa)

是否打開抗鋸齒功能,一般在繪制不規則的圖形中使用,比如圓文字等,在繪制菱角分明的圖形中是不需要開啟的

---

canvas基本使用

 畫布背景設置

drawColor(int color)
drawARGB(int a, int r, int g, int b)
drawRGB(int r, int g, int b) 

畫一條直線

drawLine(float startX, float startY, float stopX, float stopY, Paint paint)  
//畫一條直線
如 canvas.drawLine(100,100,200,200,paint);
注意:畫直線的錯寫和畫布的style是沒有關系

畫多條直線

drawLines(float[] pts, Paint paint)
//pts是點的集合,這里不是形成連接線,而是每兩個點形成兩條直線,ps的組織方式為{x1,y1,x2,y2,x3,y3.....}
//如:
float[] pts ={10,10,100,100,200,200,400,400};
canvas.drawLines(pts,paint);//效果是兩條直線

drawLines(float[] pts, int offset, int count, Paint paint)
//如:
 float[] pts ={10,10,100,100,200,200,400,400};
 canvas.drawLines(pts,2,4,paint);
//表示從pts數據中索引問的數組開始繪制,有4個數組參與繪圖,也就是點100,100 和點200,200 效果就是這兩個點的直線

畫點

 drawPoint(float x, float y, Paint paint) //點x代表x坐標 y代表點y坐標
//如:
 canvas.drawPoint(100,100,paint);

畫多個點

drawPoints(float[] pts, Paint paint) 
drawPoints(float[] pts, int offset, int count, Paint paint)
//說明:pts為點的集合 offset指集合中跳過數值的個數,不是點的個數,點的個數有二個數值
//如:
 float[] pts ={10,10,100,100,200,200,400,400};
 canvas.drawPoints(pts,paint);
 canvas.drawPoints(pts,2,4,paint);

畫矩形

Rect構造函數

Rect() 
Rect(int left, int top, int right, int bottom)
Rect(Rect r)

RectF構造函數

public RectF()
public RectF(float left, float top, float right, float bottom) 
public RectF(RectF r)
public RectF(Rect r)

其實這兩個構造函數基本相同只是參數的數據類型不同而已

構造矩形結構一般如下

//直接構造
canvas.drawRect(10, 10, 100, 100, paint);
//間接構造
Rect rect = new Rect();
rect.set(10,10,100,100)

繪制矩形

  public void drawRect(RectF rect, Paint paint)

    public void drawRect(Rect r, Paint paint)
    public void drawRect(float left, float top, float right, float bottom, Paint paint) 

繪制圓角矩形

 drawRoundRect(RectF rect, float rx, float ry, Paint paint)
 drawRoundRect(float left, float top, float right, float bottom, float rx, float ry, Paint paint)
//其中rx代表x軸的圓角半徑,ry代表y軸的圓角半徑

繪制圓形

drawCircle(float cx, float cy, float radius, Paint paint)//cx代表x軸坐標,cy代表y軸坐標,radius代表圓的半徑
//如
canvas.drawCircle(200,200,100,paint);

繪制橢圓

RectF rectF = new RectF(100,10,300,100);    
canvas.drawOval(rectF,paint);

繪制弧

drawArc(RectF oval, float startAngle, float sweepAngle, boolean useCenter, Paint paint) 
drawArc(float left, float top, float right, float bottom, float startAngle, float sweepAngle, boolean useCenter, Paint paint)
說明:
　　startAngle 代表弧開始的角度
　　sweepAngle 弧持續的角度
　　useCenter 是否有弧的兩邊,為true則有,false只有一條

---

color

android 定義了很多常量的顏色值可以直接使用

    public static final int BLACK = -16777216;
    public static final int BLUE = -16776961;
    public static final int CYAN = -16711681;
    public static final int DKGRAY = -12303292;
    public static final int GRAY = -7829368;
    public static final int GREEN = -16711936;
    public static final int LTGRAY = -3355444;
    public static final int MAGENTA = -65281;
    public static final int RED = -65536;
    public static final int TRANSPARENT = 0;
    public static final int WHITE = -1;
    public static final int YELLOW = -256;

上面可以通過Color.XXX來直接使用這些顏色

還有其他構造顏色

   public static int alpha(int color)) //提取顏色分量

    public static int red(int color) ) //提取顏色分量

    public static int green(int color)) //提取顏色分量

    public static int blue(int color) //提取顏色分量

    public static int rgb(int red, int green, int blue) //不帶有透明度顏色
    
    public static int rgb(float red, float green, float blue)  //不帶有透明度顏色

    public static int argb(int alpha, int red, int green, int blue)  //帶有透明度顏色

    public static int argb(float alpha, float red, float green, float blue) //帶有透明度顏色