Android 繪圖貝塞爾曲線簡單使用
在Android中某些自定義View的時候需要繪制某些曲線，這時候貝塞爾曲線就登場了。
我們不用深入了解貝塞爾曲線的詳細(xì)信息满粗，我們的最終目的還是需要學(xué)會如何使用号涯。貝塞爾曲線分為3種，分別為一階貝塞爾曲線脓规、二階貝塞爾曲線、三階貝塞爾曲線险领。
一階貝塞爾曲線
一階貝塞爾曲線是一條直線抖拦，只需要指定兩個點(diǎn)就可以畫出了，簡單粗暴的使用就是：
Bézier_1_big.gif
canvas.drawLine(start.x,start.y,end.x,end.y);
二階貝塞爾曲線:
二階貝塞爾曲線的原理圖是這樣的:
![Bézier_2_big.gif]
Uploading Bézier_1_big_930113.gif . . .
由上圖看舷暮，P0是起點(diǎn)态罪，P2是終點(diǎn)。P1是控制點(diǎn)下面，t是一個系數(shù)复颈，表示從0-1的變化過程，紅色的線就是最終畫出的曲線沥割。然后說了這么多可能也沒什么卵用。帜讲。
其實(shí)只要我們知道，我們指點(diǎn)了P1、P2腋舌、P3的坐標(biāo)，即可實(shí)現(xiàn)畫出上圖中紅色的曲線授艰。具體的代碼是如何的呢？
在Android中使用二階貝薩爾曲線的函數(shù)是岛心，Path對象的quadTo方法，如下送朱。
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
mPaint.setColor(Color.RED); //畫筆顏色
mPaint.setStrokeWidth(10); //畫筆寬度
mPaint.setStyle(Paint.Style.STROKE);
mPath.reset();
//起點(diǎn)
mPath.moveTo(startPoint.x, startPoint.y);
//mPath
mPath.quadTo(assistPoint.x, assistPoint.y, endPoint.x, endPoint.y);
//畫path
canvas.drawPath(mPath, mPaint);
//畫控制點(diǎn)
canvas.drawPoint(assistPoint.x, assistPoint.y, mPaint);
//畫線
canvas.drawLine(startPoint.x, startPoint.y, assistPoint.x, assistPoint.y, mPaint);
canvas.drawLine(endPoint.x, endPoint.y, assistPoint.x, assistPoint.y, mPaint);
}
三階貝塞爾曲線
三階貝塞爾曲線和二階的有限類似争群，不過是多了一個控制點(diǎn)玉雾，指定一個起點(diǎn)和一個終點(diǎn)冲泥，再指定兩個控制點(diǎn)即可實(shí)現(xiàn)
原理圖 :
Bézier_3_big.gif
在Android中使用二階貝薩爾曲線的函數(shù)是幸冻，Path對象的cubicTo方法，如下碑定。
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
mPaint.setColor(Color.RED); //畫筆顏色
mPaint.setStrokeWidth(10); //畫筆寬度
mPaint.setStyle(Paint.Style.STROKE);
mPath.reset();
//起點(diǎn)
mPath.moveTo(startPoint.x, startPoint.y);
//mPath
mPath.cubicTo(assistPoint1.x, assistPoint1.y, assistPoint2.x, assistPoint2.y, endPoint.x, endPoint.y);
//畫path
canvas.drawPath(mPath, mPaint);
//畫控制點(diǎn)
canvas.drawPoint(assistPoint1.x, assistPoint1.y, mPaint);
canvas.drawPoint(assistPoint2.x, assistPoint2.y, mPaint);
//畫線
canvas.drawLine(startPoint.x, startPoint.y, assistPoint1.x, assistPoint1.y, mPaint);
canvas.drawLine(endPoint.x, endPoint.y, assistPoint2.x, assistPoint2.y, mPaint);
canvas.drawLine(assistPoint1.x, assistPoint1.y, assistPoint2.x, assistPoint2.y, mPaint);
}
整體的效果運(yùn)行圖如下：
二階貝塞爾曲線.gif
三階貝塞爾曲線.gif
