我們?cè)赪PF中，偶爾也會(huì)涉及到兩條路徑作一些“路徑漸變 ”。

先看看比較簡(jiǎn)單的情形：
如下圖(關(guān)鍵點(diǎn)用紅色圓點(diǎn)加以標(biāo)識(shí))：

（圖1）

上面圖1中的第1幅圖可以說(shuō)是最簡(jiǎn)單的路徑漸變了，它由兩條直線為基礎(chǔ)，中間以插值方式作了兩條直線間的漸變（插入路徑數(shù)量為8，加上原始兩條直線，最終共得到10條直線）。

圖1中的第2幅圖是將第1幅圖中的右邊直線從中間折起（我們稱之為“拐點(diǎn)”），然后以此兩路徑（一條直線，一條折線）為基礎(chǔ)，同樣插入漸變路徑條數(shù)為8,共得到10條路徑，我們看到，由于拐點(diǎn)的作用，中間的八條路徑逐漸呈現(xiàn)不同的拐角的折線。

圖1中的第3幅圖則是將第2幅的拐點(diǎn)變成了平滑彎曲的曲線（我們稱之為“貝塞爾曲線”，關(guān)鍵點(diǎn)使用紅圓點(diǎn)標(biāo)識(shí),貝塞爾控制點(diǎn)使用藍(lán)色小圓點(diǎn)標(biāo)識(shí)并用藍(lán)色細(xì)線連接起來(lái)），同樣插入漸變徑徑的條數(shù)為8，最終得到10條路徑。我們發(fā)現(xiàn)，中間的漸變線也漸變成平滑曲線。

現(xiàn)在的問(wèn)題是，如何實(shí)現(xiàn)兩條給定路徑的漸變呢？此問(wèn)題亦可理解為：如何找到漸變線中的路徑關(guān)鍵點(diǎn)及貝爾塞曲線控制點(diǎn)的坐標(biāo)及相關(guān)點(diǎn)的類(lèi)型（是直線拐點(diǎn)，中間關(guān)鍵點(diǎn)，或者是貝塞爾曲線的控制點(diǎn)）？

再來(lái)看看更復(fù)雜的情形：
下圖2是兩條曲線路徑（一條紅色曲線，一條是黑色曲線），我們將要說(shuō)說(shuō)以它們?yōu)榛A(chǔ)的漸變。

（圖2）

 下圖3是兩條路徑漸變后的結(jié)果（插值路徑數(shù)量為2）：

（圖3）

為了更清晰地示意，下圖4特別標(biāo)示出了路徑關(guān)鍵點(diǎn)（紅點(diǎn)圓點(diǎn)）及貝塞爾曲線控制點(diǎn)（藍(lán)色小圓點(diǎn)及細(xì)線）。

（圖4）

（圖5  可以確定的是：兩條路徑的首/尾點(diǎn)漸變時(shí)得到的中間點(diǎn)也在兩首/尾點(diǎn)的連接直線上并且呈均勻分布，如上圖的①②、③④所示，其他的關(guān)鍵點(diǎn)/控制點(diǎn)則需要根據(jù)兩條路徑及漸變插值數(shù)量而變化）

之所以說(shuō)圖2至圖4復(fù)雜，是因?yàn)椴粌H有線的形狀漸變（注意兩條路徑的關(guān)鍵點(diǎn)的個(gè)數(shù)也是不一樣的，紅線為4個(gè)關(guān)鍵點(diǎn)，黑線為5個(gè)關(guān)鍵點(diǎn)），還有顏色的漸變（從紅色變成為黑色）。

至此，如何找到多關(guān)鍵點(diǎn)、多控制點(diǎn)漸變的算法以及顏色如何進(jìn)行漸變都成了新問(wèn)題。

此問(wèn)題解決了，下面這種更復(fù)雜的效果也就迎刃而解了：

圖5 復(fù)雜曲線的漸變效果

先拋出問(wèn)題，各位可以發(fā)表意見(jiàn)。

最后貼上圖2，圖3的XAML代碼：

圖2的XAML代碼：

  xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation'
  xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'>


 

 

圖3的XAML代碼：

  xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation'
  xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'>