貝賽爾曲線

勿噴:

  

一階貝塞爾曲線(線段)：

意義：由 P0 至 P1 的連續點， 描述的一條線段

 

 

二階貝塞爾曲線(拋物線)：

原理：由 P0 至 P1 的連續點 Q0，描述一條線段。 
      由 P1 至 P2 的連續點 Q1，描述一條線段。 
      由 Q0 至 Q1 的連續點 B(t)，描述一條二次貝塞爾曲線。

 

經驗：P1-P0爲曲線在P0處的切線。

 

三階貝塞爾曲線：

 

 

通用公式：

 

高階貝塞爾曲線：

4階曲線：

5階曲線：

   

#import <UIKit/UIKit.h>

@interfaceFirstViewController : UIViewController

{

    //doc

    floatradius;

    CGPointcenter;

    floatstartAngle;

    floatendAngle;

｝

#import "FirstViewController.h"

#import <QuartzCore/QuartzCore.h>

@interfaceFirstViewController()

@end

@implementationFirstViewController

- (void)viewDidLoad

{

//doc的繞圓得變化

    //圓心

    center= CGPointMake(500, 400);

    //半徑

    radius= 232;

    //其實角度

    startAngle= 223.0/180*M_PI;

    //終於角度

    endAngle= 145.0/180*M_PI;

｝

#pragma mark - 按鈕曲線運動的動畫

-(void)         button:(UIButton*)btn

   AnimationWithCenter:(CGPoint)c

                Radius:(float)r

            StartAngle:(float)sA

              EndAngle:(float)eA

             Clockwise:(BOOL)clockwise

              Duration:(float)duration

{

    //UIbezierPath是封裝在oc裏面的方法

    UIBezierPath*bPath = [UIBezierPathbezierPathWithArcCenter:c radius:r startAngle:sA endAngle:eA clockwise:clockwise];    

    //動畫

    CAKeyframeAnimation*animator = [CAKeyframeAnimationanimationWithKeyPath:@"position"];

    //動畫的路線跟我畫的路線是一個路線

    animator.path= bPath.CGPath;

    //動畫的時間

    animator.duration= duration;

    //btn 得layer加在anmiator動畫上

    [btn.layeraddAnimation:animator forKey:@"btnDollarAnimation"];

    NSDictionary*infodic = [NSDictionarydictionaryWithObjectsAndKeys:bPath,@"bPath",btn,@"btn", nil];

    //在動畫movebtndollor動畫後面執行  哪個是動畫事件傳參進來的

    [selfperformSelector:@selector(moveBtnDollor:) withObject:infodic afterDelay:animator.duration];

}

-(void)moveBtnDollor:(NSDictionary*)infoDic

{

    UIButton*btn = [infoDic objectForKey:@"btn"];

    UIBezierPath*bPath = [infoDic objectForKey:@"bPath"];

    btn.layer.position= [bPath currentPoint];

    [bPath closePath];

}

這個是封裝個裝的方法 傳入的值分別是給的值那個按鈕的點擊事件，圓心，半徑，起始角度，終止角度，以及是正轉還是反轉  裏面還要把畫面di那個在上面因爲動畫是瞬時的，所以要把圖片停到最後一個點上

[selfbutton:self.btnDollar AnimationWithCenter:center Radius:radius StartAngle:startAngle EndAngle:endAngle Clockwise:NO Duration:0.4f];