使用貝塞爾曲線實現關鍵幀動畫

2021-09-08 08:19:52 字數 1004 閱讀 1089

貝塞爾曲線,可以通過三個點,來確定一條平滑的曲線。在計算機圖形學應該有講。是圖形開發中的重要工具。

實現的是乙個圖形做圓周運動。不過不是簡單的關鍵幀動畫那樣,是計算出了很多點,當然還是用的關鍵幀動畫,即使用cakeyframeanimation。有了貝塞爾曲線的支援,可以賦值給cakeyframeanimation 貝塞爾曲線的path引用。

用貝塞爾曲線畫圓,是一種特殊情況,我的做法是通過貝塞爾曲線得到4個半圓的曲線,它們合成的路徑就是整個圓。

以下是動畫部分的**:

- (void) doanimation

quartz中有cgmutablepathref,就是為為動畫設定移動路徑的

比如先設個動畫變數

cakeyframeanimation *bounceanimation = [cakeyframeanimation animationwithkeypath @"position"];

然後設定乙個路徑:        

cgmutablepathref thepath = cgpathcreatemutable();

cgpathmovetopoint(thepath, null, startpoint.x, startpoint.y);

cgpathaddquadcurvetopoint(thepath, null, 150, 30, endpoint.x, endpoint.y);

注:startpoint是起點,endpoint是終點,150,30是x,y軸的控制點,自行調整數值可以出現理想弧度效果

把路徑給動畫變數,設定個動畫時間

bounceanimation.path = thepath;

bounceanimation.duration = 0.7;

最後把這個動畫新增給view的layer

[self.layer addanimation:bounceanimation forkey @"move"];

大致這樣就ok了

iOS實現貝塞爾曲線動畫

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

貝塞爾曲線動畫簡單使用

不廢話直接上 public class bezierevaluator implements typeevaluator 呼叫上面的class例如在mainactivity中,可以用下面的方法 private void curve final framelayout layout,int timer...

貝塞爾曲線使用

貝塞爾曲線數學公式 1。兩個控制點 線性公式 x 1 t x0 t x1 0 t 1 y 1 t y0 t y1 0 t 1 2.三個控制點 二次公式 x 1 t 1 t x0 2 t 1 t x1 t t x2 0 t 1 y 1 t 1 t y0 2 t 1 t y1 t t y2 0 t 1 ...