在講使用path繪製多邊形時,講下Canvas的translate(),rotate()方法的使用,本部落格中會使用這方面的知識,先單獨講下,搞懂了這個,下面講path繪製多邊形就簡單的多,我們知道每次我們使用canvas.draw...()繪製什麼圖形的時候,都是建立了一個新的圖層,如果不知道圖層是啥意思,就去看下我之前寫的關於canvas基礎,有講這方面的,其實你可以理解成每次新建立了一個activity,然後把這個activity壓入棧中,translate()是畫布平移,其實每次畫布還是同一個畫布,通過paint繪製的圖形都是在這同一個canvas上,但是繪製的內容跟你是否使用了translate()有關係,下面通過簡單的demo來演示下：

package smart.com.pathview;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View;
/**
 * 繪製多邊形
*/
public class PathmMultiView extends View {
    private Paint paint;
    public 
 
PathmMultiView(Context context) {
        this(context,null);
}
    public PathmMultiView(Context context, AttributeSet attrs) {
        this(context, attrs,0);
}
    public PathmMultiView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
initPaint();
 
}
    private void initPaint() {
        paint = new Paint();
paint.setAntiAlias(true);
paint.setStrokeWidth(5);
paint.setTextSize(24);
}
    @Override
protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
paint.setColor(Color.GREEN);
canvas.drawText("杭州是個美麗的城市",20,20,paint);
paint.setColor(Color.RED);
canvas.drawPoint(100,100,paint);
canvas.translate(100,100);
paint.setColor(Color.BLUE);
canvas.drawText("杭州是個美麗的城市",0,0,paint);
}
}

上面的紅點是座標點(100,100)的位置,為什麼繪製的藍色的文字是在座標點(100,100)的位置呢?是因為你canvas使用了translate(100,100)也就是x,y座標都平移了100px,這個是根據你當前的view的左上角座標為原點進行平移的,平移肯定是相對那個點進行平移的,不人為的去設定畫布的顏色,預設都是透明的,否則你draw...2次,上次繪製的內容就被覆蓋了,文字太蒼白無力,就好像你對一個女孩說一千篇我愛你,還不如說你在杭州買了套房來的實際,就好像香港有一個電影中的臺詞是這麼說的,這是一個最好的時代,也是一個最壞的時代,好了廢話不多說,圖,我要圖!

關於如何恢復畫布有三種情況 就以平移例子來講

第一種：

你x,y平移了多少後,我們知道x>0是向右平移,x<0是向左平移,那麼恢復就很簡單了

canvas.translate(-x,-y)

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
paint.setColor(Color.GREEN);
canvas.drawText("杭州是個美麗的城市",20,20,paint);
paint.setColor(Color.RED);
canvas.drawPoint(100,100,paint);
canvas.translate(100,100);
paint.setColor(Color.BLUE);
canvas.translate(-100,-100);
canvas.drawText("杭州是個美麗的城市",20,20,paint);
}

你會發現綠色和藍色是重疊了,

第二種：

配套使用canvas.save() canvas.restore() ;save()是繫結畫布,restore()是讓畫布恢復到最初的狀態

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
paint.setColor(Color.GREEN);
canvas.save();
canvas.drawText("杭州是個美麗的城市",20,20,paint);
paint.setColor(Color.RED);
canvas.drawPoint(100,100,paint);
canvas.translate(100,100);
paint.setColor(Color.BLUE);
canvas.restore();
canvas.drawText("杭州是個美麗的城市",20,20,paint);
}

第三種：

 int count = canvas.save(Canvas.MATRIX_SAVE_FLAG);//這個看你是在canvas.draw...哪裡呼叫了,就相當於儲存畫布
 canvas.restoreToCount(count);//恢復

畫圖：

現在講下畫多邊形,先確定下思路：

1:把這個多邊形的外切圓畫出來當做一個輔助的參考目標,

2:計算多個點的座標然後連線成一條線

如圖分析：

現在根據這個思路把程式碼實現下：

程式碼如下：

package smart.com.pathview;
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 android.view.View;
/**
 * 繪製多邊形
*/
public class PathmMultiView extends View {
    private Paint paint;
    private Path path;
    private int width,height;
    public PathmMultiView(Context context) {
        this(context,null);
}
    public PathmMultiView(Context context, AttributeSet attrs) {
        this(context, attrs,0);
}
    public PathmMultiView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
initPaint();
}
    private void initPaint() {
        width = 400;
height = 400;
path = new Path();
paint = new Paint();
paint.setAntiAlias(true);
paint.setStrokeWidth(5);
paint.setColor(Color.BLUE);
paint.setStyle(Paint.Style.STROKE);
}
    @Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        setMeasuredDimension(width,height);
}
    @Override
protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
drawMultShape(canvas,6,width/2);
}
    /**
     * @param canvas 畫布
* @param count 繪製幾邊形
* @param radius //外圓的半徑
*/
public void drawMultShape(Canvas canvas,int count,float radius){
        canvas.translate(radius,radius);//
if(count<5){
            return;
}
        for (int i=0;i<count;i++){
            if (i==0){
                path.moveTo(radius*cos(360/count*i),radius*sin(360/count*i));//繪製起點
}else{
                path.lineTo(radius*cos(360/count*i),radius*sin(360/count*i));
}
        }
        paint.setStrokeWidth(3);
path.close();
paint.setColor(Color.GREEN);
canvas.drawPath(path,paint);
//因為我下面不再繪製內容了 所以畫布就不恢復了
}
    float sin(int num){
        return (float) Math.sin(num*Math.PI/180);
}
    float cos(int num){
        return (float) Math.cos(num*Math.PI/180);
}
}

哪繪製正8變形呢?好說,直接

drawMultShape(canvas,6,width/2); 第二個引數就是幾邊形的改為8就ok了,試試看看效果：

就一句話,哦了,

還有一個問題就是如果所繪製的是多邊形,但是好像形狀不一樣,怎麼修改,這個時候只要旋轉畫布就行了,比如這張圖片：

使用canvas.rotate(30);旋轉30度後是這樣的,

當然你要在繪製這個圖形之前對畫布進行旋轉,不然不起作用,網上有些五角星的效果,是怎麼實現的呢？比如這樣的效果：

這是正6變形所形成的星星形狀,分析如圖：

先吃飯