ios動畫之貝塞爾曲線和PaintCode

2021-08-09 16:31:48 字數 1471 閱讀 9040

專案中遇到幾個動畫效果,需要乙個uiimageview沿著乙個特定的路徑移動,美術的設計是這樣的:

通常的實現方法是利用cakeyframeanimationpath屬性,這個屬性接受乙個uibezierpath,可以使得layer沿著path移動,**如下:

// 這個不是飛碟的動畫,就是個例子:-d

uibezierpath *custompath = [uibezierpath bezierpath];

[custompath movetopoint:cgpointmake(100,100)];

[custompath addlinetopoint:cgpointmake(200,100)];

cakeyframeanimation *pathanimation = [cakeyframeanimation animationwithkeypath:@"position"];

pathanimation.duration = 4.0f;

pathanimation.path = custompath.cgpath; // 加入貝塞爾路徑

pathanimation.calculationmode = kcaanimationlinear;

[movinglayer addanimation:pathanimation forkey:@"movinganimation"];

但是問題來了,這條貝塞爾如何製作,難道純粹意淫,或是讓美術標座標?美術表示鴨梨山大啊,貝塞爾曲線咋標啊?如果像下面這樣標條線,你會打死美術嗎?

是不是和sketch很像,操作方法也類似,具體使用細節不說了,這裡說幾個重要的地方:

把下面生成的**放進工程裡面,就可以了。需要注意一點,只需要bezier path的**即可,畫圖的部分是不需要的,下面這些**不要了:

[uicolor.blackcolor setstroke];

bezierpath.linewidth = 1;

[bezierpath stroke];

iOS實現貝塞爾曲線動畫

效果如圖 仿美人相機,手勢滑動隱藏頂部view。為了方便講解,將螢幕分為幾個區域,如圖 在拖動過程中 1 拖動距離小於minmovedistance,貝賽爾曲線發生形變 2 拖動大於minmovedistance,整個view開始下移 在鬆開手時 1 拖動距離小於minmovedistance,未發...

貝塞爾曲線

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

貝塞爾曲線

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