最近在看svg相關(guān)知識時(shí)，看到貝塞爾曲線，之前也知道有這個(gè)，但一直不知道它到底是個(gè)什么東西（大學(xué)好像學(xué)過，但已經(jīng)還給老師了）

在網(wǎng)上找到一篇一看就懂的講解

?

在Android開發(fā)和面試中（尤其是一些中高級崗位面試），面試官可能會(huì)問你自定義控件的詳細(xì)內(nèi)容，我們知道自定義控件這一塊涉及到的內(nèi)容很多，回答的越多越深入，那么面試的印象會(huì)更好。自定義控件涉及的內(nèi)容比如測量和繪制、事件分發(fā)的處理、動(dòng)畫效果的渲染與實(shí)現(xiàn)，當(dāng)然還有不得不提的貝賽爾曲線（實(shí)際上一些面試官自己都不是很理解二階貝塞爾、三階貝塞爾曲線等概念）。

一些朋友看到以歪果仁大佬名字定義的一些計(jì)算公式、定理就頭大（比如梅涅勞斯（Menelaus）定理、塞瓦(Ceva)定理等），不得不承認(rèn)我也是。本著《士兵突擊》不拋棄不放棄的精神，因此就算是在難啃的骨頭我們也要堅(jiān)持啃下來！所以本篇文章主要介紹的是貝賽爾曲線的基本概念、在Android的應(yīng)用場景以及一些思考。不考慮篇幅的情況下力求將概念和理解寫的詳細(xì)。

貝賽爾曲線的前世今生：

貝塞爾曲線，這個(gè)命名規(guī)則一眼看上去大概是一個(gè)叫貝塞爾的數(shù)學(xué)家發(fā)明的。但，貝塞爾曲線依據(jù)的最原始的數(shù)學(xué)公式，是在1912年在數(shù)學(xué)界廣為人知的伯恩斯坦多項(xiàng)式。簡單理解，伯恩斯坦多項(xiàng)式可以用來證明，在[ a, b ] 區(qū)間上所有的連續(xù)函數(shù)都可以用多項(xiàng)式來逼近，并且收斂性很強(qiáng)，也就是一致收斂。再簡單點(diǎn)，就是一個(gè)連續(xù)函數(shù)，你可以將它寫成若干個(gè)伯恩斯坦多項(xiàng)式相加的形式，并且，隨著 n→∞，這個(gè)多項(xiàng)式將一致收斂到原函數(shù)，這個(gè)就是伯恩斯坦斯的逼近性質(zhì)。

時(shí)光荏苒歲月如梭，鏡頭切換到了1959年。當(dāng)時(shí)就職于雪鐵龍的法國數(shù)學(xué)家 Paul de Casteljau 開始對伯恩斯坦多項(xiàng)式進(jìn)行了圖形化的嘗試，并且提供了一種數(shù)值穩(wěn)定的德卡斯特里奧（de Casteljau） 算法。（多數(shù)理論公式是建立在大量且系統(tǒng)的數(shù)學(xué)建模基礎(chǔ)之上研究的規(guī)律性成果）根據(jù)這個(gè)算法，就可以實(shí)現(xiàn) 通過很少的控制點(diǎn)，去生成復(fù)雜的平滑曲線，也就是貝塞爾曲線。

但貝塞爾曲線的聲名大噪，不得不提到1962年就職于雷諾的法國工程師皮埃爾·貝塞爾（Pierre Bézier），他使用這種方法來輔助汽車的車體工業(yè)設(shè)計(jì)（最早計(jì)算機(jī)的誕生則是為了幫助美國海軍繪制彈道圖），并且廣泛宣傳（典型的理論聯(lián)系實(shí)際并獲得成功的示例），因此大家稱為貝塞爾曲線 。

貝賽爾曲線的數(shù)學(xué)理論：

既然貝賽爾曲線的本質(zhì)是通過數(shù)學(xué)計(jì)算公式去繪制平滑的曲線，那就可以通過數(shù)學(xué)工具進(jìn)行實(shí)際求證以及解釋說明。當(dāng)然對其進(jìn)行數(shù)學(xué)求證就沒必要了，因?yàn)檫@些偉大的數(shù)學(xué)家們已經(jīng)做過了，這里只是解釋說明：

• 步驟一：在平面內(nèi)選3個(gè)不同線的點(diǎn)并且依次用線段連接。如下所示..

?

3點(diǎn)連線

• 步驟二：在AB和BC線段上找出點(diǎn)D和點(diǎn)E，使得 AD/AB = BE/BC

  ?

  AD/AB = BE/BC

• 步驟三：連接DE，在DE上尋找點(diǎn)F，F點(diǎn)需要滿足：DF/DE = AD/AB = BE/BC

  ?

  DF/DE = AD/AB = BE/BC

• 步驟四：最最重要的！根據(jù)DE線段和計(jì)算公式找出所有的F點(diǎn)，記住是所有的F點(diǎn)，然后將其這些點(diǎn)連接起來。那，連接規(guī)則是什么？以上圖為例，第一個(gè)連接點(diǎn)是A-F，第二連接點(diǎn)是A-F1（這個(gè)F1必須滿足DF1/DE = AD/AB = BE/BC）以此類推，直到最后連接上C點(diǎn)，下面上一個(gè)動(dòng)圖加深理解：

• ?

?

貝塞爾曲線

可能有些朋友還是不理解，那么這個(gè)GIF我截下其中的一張圖說明，如下圖：

示例說明

動(dòng)圖里的P0、P1、P2分別代表的是上圖的：P0 == A；P1 == B；P2 == C。那么這個(gè)黑色點(diǎn)，代表的就是F點(diǎn)，綠色線段的2個(gè)端點(diǎn)（P0-P1線段上的綠色點(diǎn)，代表是就是D點(diǎn)，P0-P2線段上的綠色點(diǎn)，代表是就是E點(diǎn)）。線段上面點(diǎn)的獲取，必須要滿足等比關(guān)系。

關(guān)于貝賽爾曲線的基本數(shù)學(xué)理論大概就是上面的內(nèi)容。兩個(gè)線段根據(jù)等比關(guān)系找點(diǎn)的貝塞爾曲線，一般也稱為二階貝塞爾曲線。

貝賽爾曲線的N階拓展（三階貝塞爾與N階貝塞爾曲線）

剛才說到，上面的貝賽爾曲線一般稱為二階貝塞爾曲線，既然是二階貝塞爾曲線，那肯定有三階貝塞爾曲線、四階貝賽爾曲線等等。其實(shí)三階貝塞爾與四階貝賽爾曲線以及N階貝賽爾曲線曲線的規(guī)則都是一樣的，都是先在線段上找點(diǎn)，這個(gè)點(diǎn)必須要滿足等比關(guān)系，然后依次連接，下面是三階貝賽爾曲線的解釋說明：

• 步驟一：三階貝賽爾曲線，簡單理解就是在平面內(nèi)選4個(gè)不同線的點(diǎn)并且依次用線段連接（也就是三條線）。如下所示

• 步驟二：同二階貝塞爾曲線一樣首先需要在線段上找對應(yīng)的點(diǎn)（E、F、G），對應(yīng)的點(diǎn)必須要符合等比的計(jì)算規(guī)則，計(jì)算規(guī)則如下：AE/AB = BF/BC = CG/CD；找到對應(yīng)的點(diǎn)以后接著依次鏈接EF、FG；接著在EF、FG線段上面繼續(xù)找點(diǎn)H、I，對應(yīng)的點(diǎn)依舊要符合等比的計(jì)算規(guī)則，也就是 EH/EF = FI/FG；最后連接H、I線段，在HI線段上面繼續(xù)找點(diǎn)J、點(diǎn)J的計(jì)算規(guī)則需要符合：EH/EF = FI/FG = HJ/HI

• 三階貝賽爾曲線找點(diǎn)

• 步驟三：重復(fù)步驟二的動(dòng)作，找到所有的J點(diǎn)，依次將J點(diǎn)連接起來，這樣最終完成了三階貝賽爾曲線。

  J點(diǎn)依次連線

• 整一個(gè)三階貝賽爾曲線的動(dòng)作加起來就是下面的一張動(dòng)圖：

三階貝塞爾

那么四階貝賽爾曲線的實(shí)現(xiàn)步驟也是一樣的，平面上先選取5個(gè)點(diǎn)（5點(diǎn)4線）、依次選點(diǎn)（滿足等比關(guān)系）、依次連接、根據(jù)計(jì)算規(guī)則找到所有的點(diǎn)（逐個(gè)連接）。。。。。。

四階貝賽爾曲線

貌似都是從二階貝塞爾曲線說起的，那么一階貝賽爾又是怎么樣的？一階貝賽爾如圖：

一階貝賽爾

?

可以看到一階貝賽爾是一條直線！因此，N階貝賽爾不僅可以畫平滑的曲線也可以畫直線，因此自定義控件畫直線又多了一種可選擇的方式，但是一般用貝賽爾主要是畫曲線，這里只是提供了一種別的解決思路；另外，在Android屬性動(dòng)畫，系統(tǒng)為我們提供了一個(gè)PathInterpolator插值器。這個(gè)PathInterpolator里面就有貝塞爾曲線的身影。有興趣的小伙伴也可以去了解一下。

?

轉(zhuǎn)自簡書? ?作者：騎小豬看流星
鏈接：https://www.jianshu.com/p/0c9b4b681724
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請注明出處。

總結(jié)

以上是生活随笔為你收集整理的通俗易懂的贝塞尔曲线讲解（转载）的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。