android Graphics（一）：概述及基本幾何圖形繪製

前言：我最近想抽空研究研究android的各種特效，android的特效真是其它平臺無法比擬的，而且一個漂亮的UI交互，會給APP增色不少，而學習特效之前，有關graphics繪圖的基礎知識是必不可少的，下面就分幾篇對涉及到的基礎知識進行梳理。

志不強者智不達，言不信者行不果。——墨翟

（凡諸事有成者都有驚人的毅力做後盾，相信自己，持之以恆，不久的將來，我們都將有一番成就，勤不富也飽,懶不死也餓）

一、Paint與Canvas

像我們平時畫圖一樣，需要兩個工具，紙和筆。Paint就是相當於筆，而Canvas就是紙，這裏叫畫布。

所以，凡有跟要要畫的東西的設置相關的，比如大小，粗細，畫筆顏色，透明度，字體的樣式等等，都是在Paint裏設置；同樣，凡是要畫出成品的東西，比如圓形，矩形，文字等相關的都是在Canvas裏生成。

下面先說下Paint的基本設置函數：

paint.setAntiAlias(true);//抗鋸齒功能
paint.setColor(Color.RED); //設置畫筆顏色
paint.setStyle(Style.FILL);//設置填充樣式
paint.setStrokeWidth(30);//設置畫筆寬度
paint.setShadowLayer(10, 15, 15, Color.GREEN);//設置陰影

前兩個沒什麼好說的，看填充樣式的區別：

1、void setStyle (Paint.Style style) 設置填充樣式

Paint.Style.FILL :填充內部
Paint.Style.FILL_AND_STROKE ：填充內部和描邊
Paint.Style.STROKE ：僅描邊

看下這三個類型的不同，下面以畫的一個圓形爲例：

可見，FILL與FILL_AND_STROKE沒什麼區別。

2、setShadowLayer (float radius, float dx, float dy, int color) 添加陰影

參數：

radius:陰影的傾斜度
dx:水平位移
dy:垂直位移

使用代碼：

[java] view plain copy

paint.setShadowLayer(10, 15, 15, Color.GREEN);//設置陰影

然後是Canvas的基本設置：

畫布背景設置：

canvas.drawColor(Color.BLUE);
canvas.drawRGB(255, 255, 0); //這兩個功能一樣，都是用來設置背景顏色的。

二、實例操作

先給大家講下怎麼在寫畫圖程序，大家可以邊看邊寫邊看效果是怎樣的，先利用一個畫直線的函數來測試一下吧，劃直線當然是canvas.drawline();上面說了，有關畫筆設置的都是Paint，有關畫圖的都在Canvas類中；

1、首先新建一個工程，把默認的XML改成FrameLayout佈局，佈局代碼如下：

[html] view plain copy

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/root"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.try_paint_blog.MainActivity" >
</FrameLayout>

這裏有個特別要注意的地方，給根結點FrameLayout加一個ID號，後面用來在它的內部添加視圖用的

2、然後新建一個視圖類，派生自View，爲什麼要新建視圖類呢，因爲我們要自由的顯示東西，當然要重寫視圖類了，在OnDraw（）函數中返回什麼，這個視圖就會長什麼樣。話不多說，新建一個派生自View的類MyView，然後重寫OnDraw()函數：

[java] view plain copy

public class MyView extends View {
Context m_context;
public MyView(Context context) {
super(context);
// TODO Auto-generated constructor stub
m_context=context;
}
//重寫OnDraw（）函數，在每次重繪時自主實現繪圖
@Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
super.onDraw(canvas);
//設置畫筆基本屬性
Paint paint=new Paint();
paint.setAntiAlias(true);//抗鋸齒功能
paint.setColor(Color.RED); //設置畫筆顏色
paint.setStyle(Style.FILL);//設置填充樣式 Style.FILL/Style.FILL_AND_STROKE/Style.STROKE
paint.setStrokeWidth(5);//設置畫筆寬度
paint.setShadowLayer(10, 15, 15, Color.GREEN);//設置陰影
//設置畫布背景顏色
canvas.drawRGB(255, 255,255);
//畫圓
canvas.drawCircle(190, 200, 150, paint);
}
}

在這段代碼中，首先對畫筆進行基本的樣式設置，（對幾何圖形設置陰影，好像沒作用），然後利用DrawCircle（）畫了一個圓。關於這個函數，下面會再講，大家只知道用來畫圓就好了。
3、視圖類寫好了，下面就要將其加入到Activity中，讓它顯示出來，在MainActiviy中添加如下代碼：

[java] view plain copy

public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
FrameLayout root=(FrameLayout)findViewById(R.id.root);
root.addView(new MyView(MainActivity.this));
}
}

首先找到FrameLayout結點，然後把新生成的MyView實例加入到其中。
運行之後，效果如下：

源碼下載地址：http://download.csdn.net/detail/harvic880925/7834517

三、基本幾何圖形繪製

1、畫直線

void drawLine (float startX, float startY, float stopX, float stopY, Paint paint)

參數：

startX:開始點X座標
startY:開始點Y座標
stopX:結束點X座標
stopY:結束點Y座標

[java] view plain copy

Paint paint=new Paint();
paint.setColor(Color.RED); //設置畫筆顏色
paint.setStyle(Style.FILL);//設置填充樣式
paint.setStrokeWidth(5);//設置畫筆寬度
canvas.drawLine(100, 100, 200, 200, paint);

2、多條直線

void drawLines (float[] pts, Paint paint)
void drawLines (float[] pts, int offset, int count, Paint paint)

參數：

pts:是點的集合，大家下面可以看到，這裏不是形成連接線，而是每兩個點形成一條直線，pts的組織方式爲｛x1,y1,x2,y2,x3,y3,……｝

[java] view plain copy

Paint paint=new Paint();
paint.setColor(Color.RED); //設置畫筆顏色
paint.setStyle(Style.FILL);//設置填充樣式
paint.setStrokeWidth(5);//設置畫筆寬度
float []pts={10,10,100,100,200,200,400,400};
canvas.drawLines(pts, paint);

（上面有四個點：（10，10）、（100，100），（200，200），（400，400）），兩兩連成一條直線；

3、點

void drawPoint (float x, float y, Paint paint)

參數：
float X：點的X座標
float Y：點的Y座標

[java] view plain copy

Paint paint=new Paint();
paint.setColor(Color.RED); //設置畫筆顏色
paint.setStyle(Style.FILL);//設置填充樣式
paint.setStrokeWidth(15);//設置畫筆寬度
canvas.drawPoint(100, 100, paint);

4、多個點

void drawPoints (float[] pts, Paint paint)
void drawPoints (float[] pts, int offset, int count, Paint paint)

參數：
float[] pts:點的合集，與上面直線一直，樣式爲｛x1,y1,x2,y2,x3,y3,……｝
int offset:集合中跳過的數值個數，注意不是點的個數！一個點是兩個數值；
count:參與繪製的數值的個數，指pts[]里人數值個數，而不是點的個數，因爲一個點是兩個數值

下面舉例說明上面offset與count的含義：（跳過第一個點，畫出後面兩個點，第四個點不畫），注意一個點是兩個數值！

[java] view plain copy

Paint paint=new Paint();
paint.setColor(Color.RED); //設置畫筆顏色
paint.setStyle(Style.FILL);//設置填充樣式
paint.setStrokeWidth(15);//設置畫筆寬度
float []pts={10,10,100,100,200,200,400,400};
canvas.drawPoints(pts, 2, 4, paint);

（同樣是上面的四個點：（10，10）、（100，100），（200，200），（400，400），drawPoints里路過前兩個數值，即第一個點橫縱座標，畫出後面四個數值代表的點，即第二，第三個點，第四個點沒畫；效果圖如下）

5、矩形工具類RectF與Rect

這兩個都是矩形輔助類，區別不大，用哪個都行，根據四個點構建一個矩形結構；在畫圖時，利用這個矩形結構可以畫出對應的矩形或者與其它圖形Region相交、相加等等；

RectF：

構造函數有下面四個，但最常用的還是第二個，根據四個點構造出一個矩形；

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

Rect

構造函數如下，最常用的也是根據四個點來構造矩形

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

6、矩形

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

參數：

第一個的寫法是直接傳入矩形的四個點，畫出矩形

第二、三個構造函數是根據傳入RectF或者Rect矩形變量來指定所畫的矩形的

[java] view plain copy