貝塞爾曲線與翻頁效果

先來看一張翻頁的效果圖。假設從右下角開始翻頁

剪下，組合

過程。

接下來看一下三個顏色的區域怎麼獲取:

假設 a 為當前螢幕的觸點。

f 為右下角的座標。

g 是直線 af 的垂直平分線上的點

eh 是過 g 點垂直於 af 的直線。

—— —— —— —— —— —— ——  —— —— —— —— —— —— —— 

此時通過數學知識可以求得 

g 的座標點: gx = (ax + fx) / 2;  gy = (ay + fy) / 2;

e點的座標  通過公式  em * mf = gm * gm (其中em兩點之間的長度)可以計算出來

同理計算出h的座標

。。。。。。。。。。。。。。。。。

然後就剩下 i-j-k  b-d-c 這兩條貝塞爾曲線的 其中

cj 是  ag 的垂直平分線

根據三角形的性質  ef / ec = gf / go = 2 

可以求出 c 點座標, 同理求出 b k j

現在只剩下d i 兩個點的座標了。。。。

圖中的 di 線話的不是很準。實際上 d 在ep的垂直平分線上。

關係為  de = dp 

d點座標 dx = (ex - px) / 2

di為go的垂直平分線

假設我們已經求得了包含黃色區域和藍色區域的path, 假設為mpath0,那麼綠色區域則可以使用

canvas.clippath(mpath0, region.op.xor)來剪裁繪製；

而藍色區域則可以通過使用(假設黃色區域的path為mpath1)

canvas.clippath(mpath0);   

canvas.clippath(mpath1, region.op.difference); 

//繪製第一次不同於第二次的區域

下面我們來研究如何求取mpath0：

貝塞爾曲線與翻頁效果

先來看一張翻頁的效果圖。假設從右下角開始翻頁 接下來看一下三個顏色的區域怎麼獲取 假設 a 為當前螢幕的觸點。f 為右下角的座標。g 是直線 af 的垂直平分線上的點 eh 是過 g 點垂直於 af 的直線。此時通過數學知識可以求得 g 的座標點 gx ax fx 2 gy ay fy 2 e點的座...

貝塞爾曲線

1.概述 貝塞爾曲線 b zier curve 又稱 貝茲曲線或貝濟埃曲線，是應用於二維圖形應用程式的數學曲線。一般的向量圖形 軟體通過它來精確畫出曲線，貝茲曲線由 線段與節點組成，節點是可拖動的支點，線段像可伸縮的皮筋，我們在繪圖工具上看到的鋼筆工具就是來做這種向量曲線的。貝塞爾曲線是計算機圖形學...

貝塞爾曲線

由於工作需要，最近在研究乙個類似qq訊息劃掉的效果 很多強迫症患者童鞋對這個簡直是愛不釋手，當然這個也包括我自己 貝塞爾曲線就是這樣的一條曲線，它是依據四個位置任意的點座標繪製出的一條 光滑曲線 在歷史上，研究貝塞爾曲線的人最初是按照已知曲線 引數方程 來確定四個點的思路設計出這種向量曲線繪製法。貝...