前言
扯來扯去，前面三篇自定義 View 文章，終于扯完了一些知識點，有些枯燥，所以我也是講下核心點，沒有細分析，主要是讓各位有點印象和了解。這篇終于是實踐，敲代碼的了，因為工作原因，這篇拖的比較久，不過這系列會一直更新下去的，會把我工作中用到的自定義 View 也會加上去。好了，回歸正原題，說到自定義 View ，似乎都離不開貝塞爾曲線，因此，第一篇實踐就是與貝塞爾曲線有關的。
目錄
一、貝塞爾曲線
1、貝塞爾曲線簡介
來看看官方對神奇的賽貝爾曲線的介紹：貝塞爾曲線于 1962，由法國工程師皮埃爾·貝塞爾所廣泛發表，他運用貝塞爾曲線來為汽車的主體進行設計。貝塞爾曲線最初由 Paul de Casteljau 于 1959 年運用 de Casteljau 演算法開發，以穩定數值的方法求出貝茲曲線。貝塞爾曲線主要用于二維圖形應用程序中的數學曲線，曲線由起始點，終止點（也稱錨點）和控制點組成，通過調整控制點，貝塞爾曲線的形狀會發生變化。
看完后是不是一臉蒙蔽，一句話理解貝塞爾曲線就是：將任意一條曲線轉化為精確的數學公式。
2、賽貝爾曲線公式
竟然說了是將曲線轉化為精確的數學公式，那么我們來看下具體的數學公式（ 注：以下公式中，B(t) 為 t 時間下點的坐標； P0 為起點,Pn 為終點,Pi 為控制點 ）：
(1) 一階貝塞爾曲線(線段)
由 P0 至 P1 的連續點， 描述的一條線段
(2) 二階貝塞爾曲線(拋物線)：
由 P0 至 P1 的連續點 Q0，描述一條線段。
由 P1 至 P2 的連續點 Q1，描述一條線段。
由 Q0 至 Q1 的連續點 B(t)，描述一條二次貝塞爾曲線。
(3) 三階貝塞爾曲線：
3、貝塞爾曲線在 Android 中的應用
其實貝塞爾曲線在 Android 自定義 View 中運用還是挺多的，比如
- Android 5.0 后下拉刷新的陰影曲線
- QQ 消息提醒的小紅點
- 用于左右滑動時顯示個數的點的移動動畫
- 水流波動效果
- 一個彈性效果的抽屜菜單
4、Android Path 類中提供貝塞爾曲線的操作方法
在 Android 開發中，要實現貝塞爾曲線其實還是很簡單的，因為 Android 已經給我們提供了相關接口，此接口方法在 Path 類中，而關于 Path 類的講解，前面一篇博客就介紹過了。而且通過 Android 的 API 可以知道，貝塞爾曲線從 API1 就開始支持了。下面就是賽貝爾曲線對應的 API 方法了。
| 貝塞爾曲線 | 對應的方法 | 演示動畫 |
|---|---|---|
| 一階曲線 (線性曲線) |
lineTo |  一階貝塞爾曲線動圖.gif
|
| 二階曲線 | quadTo |  二階貝塞爾曲線(拋物線)動圖.gif
|
| 三階曲線 | cubicTo |  三階貝塞爾曲線動圖.gif
|
| 四階曲線 | 無 |  四階貝塞爾曲線動圖.gif
|
5、通過 de Casteljau 算法繪制貝塞爾曲線
上面提過，Path 類中提供了畫一到三階的貝塞爾曲線的方法，如果我們需要繪制更高階的貝塞爾曲線呢？我們可以采用德卡斯特里奧算法（De Casteljau’s Algorithm）來實現貝塞爾曲線。
效果圖：
Github 上的代碼：beziercurve
里面主要就一個類，beziercurve ，這是個自定義 View ，BezierCurve 里面主要提供了以下的方法：
Methods:
| method 方法 | description 描述 |
|---|---|
| void start() | 開始貝塞爾曲線（required） |
| void stop() | 停止貝塞爾曲線（optional） |
| boolean addPoint() | 增加控制點（optional） |
| boolean delPoint() | 刪除控制點（optional） |
| int getOrder() | 獲取貝塞爾曲線階數（optional） |
| void setRate(int rate) | 設置移動速率（optional） |
| void setTangent(boolean tangent) | 設置是否顯示切線（optional） |
| void setLoop(boolean loop) | 設置是否循環（optional） |
| void setOrder(int order) | 設置貝塞爾曲線階數（optional） |
最后通過 BezierCurveActivity 來展示。
二、貝塞爾曲線的應用
1.QQ 消息提醒可拖拽紅點
Github 上的項目地址：qqmsgnotify
效果圖：
主要是在繪制紅點的時候運用了貝塞爾曲線，在固定的位置中，拖拽的時候，有一種粘性的效果，就是這里運用了貝塞爾曲線。
運用：
(1) 在對應的位置創建一個 TextView
(2) 設置 GooViewListener 監聽事件就可以了
mTvPoint = (TextView) findViewById(R.id.point_conversation);
mTvPoint.setText("10");
mTvPoint.setTag(10);
GooViewListener listener = new GooViewListener(this, mTvPoint) {
@Override
public void onDisappear(PointF mDragCenter) {
super.onDisappear(mDragCenter);
Toast.makeText(QQMsgNotifyActivity.this, "消失了", Toast.LENGTH_SHORT).show();
}
@Override
public void onReset(boolean isOutOfRange) {
super.onReset(isOutOfRange);
Toast.makeText(QQMsgNotifyActivity.this, "重置了", Toast.LENGTH_SHORT).show();
}
};
mTvPoint.setOnTouchListener(listener);
2.Viewpage頁面引導切換動畫
Github 上的項目地址：guideview
效果圖：
其實這個例子也是，運用貝塞爾曲線也就是在繪制那個圓形的地方而已，其他地方基本不怎么使用貝塞爾曲線。
