CAAnimation類的基本操作

今天主要寫的是動畫類的操作赁遗,CAAnimation的兩個子類的運用氢伟,一些動畫的產(chǎn)生高职。

1.CABasicAnimation的屬性疼约,方法的使用
2.CAKeyframeAnimation的屬性,方法的使用
3.CAAnimationGroup組的使用

代碼部分:
屬性

@property (weak, nonatomic) IBOutlet UIImageView *myImageView;

1.翻轉(zhuǎn)屬性

- (void)overturn{
    //創(chuàng)建動畫對象,并且設(shè)置動畫的類型  --這里是rotation翻轉(zhuǎn).z是通過Z軸進(jìn)行翻轉(zhuǎn)逃贝。
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];
    //持續(xù)時間
    animation.duration = 3;
    //這里從開始位置進(jìn)行動畫谣辞,在結(jié)束時回到開始位置。
    //開始位置
    animation.fromValue = @0;
    //結(jié)束位置:轉(zhuǎn)換成對象
    animation.toValue = @(M_PI*2/3);
    //重復(fù)次數(shù) 最大數(shù):(MAXFLOAT)一直旋轉(zhuǎn)
    animation.repeatCount = MAXFLOAT;
    //重復(fù)時間(優(yōu)先級高于重復(fù)次數(shù))(單位:s)
    animation.repeatDuration = 3;
    //是否移除結(jié)果(不復(fù)原)
    animation.removedOnCompletion = NO;
    /*
     kCAFillModeRemoved 這個是默認(rèn)值沐扳,動畫結(jié)束后泥从,會恢復(fù)到之前的狀態(tài)
     kCAFillModeForwards 當(dāng)動畫結(jié)束后,會一直保持著動畫最后的狀態(tài)
     kCAFillModeBackwards 在動畫開始前沪摄,便立即進(jìn)入動畫的初始狀態(tài)并等待動畫開始躯嫉。
     kCAFillModeBoth 這個其實就是上面兩個的合成.保持動畫最后的狀態(tài)
     */
    animation.fillMode = kCAFillModeForwards;
    //給imageView添加動畫,forkey是一個標(biāo)識
    [self.myImageView.layer addAnimation:animation forKey:@"rotationAnimation"];
    
}

2.縮放屬性

- (void)scaleAnimation{
    
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
 
    animation.duration = 3;
    //縮放倍數(shù)
    animation.fromValue = @1;
    animation.toValue = @0.5;
    animation.repeatDuration = 3;
    animation.removedOnCompletion = NO;
    animation.fillMode = kCAFillModeForwards;
    //forkey是一個標(biāo)識
   [self.myImageView.layer addAnimation:animation forKey:@"scaleAnimation"];

    
}

3.路徑繪制
拿貝塞爾曲線舉例:

//繪制一個貝塞爾曲線的路徑
-(void)bezierCurve{
    
    //通過關(guān)鍵幀的動畫來創(chuàng)建
    CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    //設(shè)置時間
    animation.duration = 3;
    //創(chuàng)建一個路徑
    CGMutablePathRef path = CGPathCreateMutable();
    //1.創(chuàng)建起點
    CGPoint startPoint = self.view.center;
    CGPathMoveToPoint(path, nil, startPoint.x,startPoint.y);
    //2.創(chuàng)建各個切線
    CGPoint point1 = CGPointMake(20,300);
    CGPoint point2 = CGPointMake(50, 400);
    CGPoint point3 = CGPointMake(100, 600);
    CGPathAddCurveToPoint(path, nil, point1.x, point1.y, point2.x, point2.y, point3.x, point3.y);
    //3.將路徑添加進(jìn)去
    animation.path = path;
    //不還原
    animation.removedOnCompletion = NO;
    animation.fillMode = kCAFillModeForwards;
    //
    [self.myImageView.layer addAnimation:animation forKey:@"bezierCurve"];
    //手動釋放路徑
    CGPathRelease(path);

    
    
}


2.gif

]

//使勁的晃(其實就是翻轉(zhuǎn)--)


 -(void)ratationWaggle{
    CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"transform.rotation.z"];
    //持續(xù)時間
    animation.duration = 0.1;
    //無限晃動
    animation.repeatCount = MAXFLOAT;
    //設(shè)置一個數(shù)組杨拐,元素:旋轉(zhuǎn)的角度
    CGFloat angle = M_PI/20;
    //0 - 左搖-0-右搖-0
    animation.values = @[@0,@(-angle),@0,@(angle),@0];
    [self.myImageView.layer addAnimation:animation forKey:@"waggle"];

}

1.gif

5.組的運用---合成版

//在點擊事件中進(jìn)行操作
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
    //1.翻轉(zhuǎn)動畫
//    [self overturn];
    //2.縮放動畫
//    [self scaleAnimation];
    //3.貝塞爾曲線路徑動畫
//    [self bezierCurve];
    //4.左右晃動
//    [self ratationWaggle];
    CAAnimationGroup *group = [CAAnimationGroup animation];
    CAAnimation *animation1 = [self scaleAnimation];
    CAAnimation *animation2 = [self bezierCurve];
    CAAnimation *animation3 = [self ratationWaggle];
    group.animations = @[animation1,animation2,animation3];
    group.duration = 3;
    group.repeatCount = MAXFLOAT;
    [self.myImageView.layer addAnimation:group forKey:@"group"];
    
}
- (CAAnimation *)overturn{
    //創(chuàng)建動畫對象,并且設(shè)置動畫的類型  --這里是rotation翻轉(zhuǎn).z是通過Z軸進(jìn)行翻轉(zhuǎn)和敬。
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];
    //持續(xù)時間
    animation.duration = 3;
    //這里從開始位置進(jìn)行動畫,在結(jié)束時回到開始位置戏阅。
    //開始位置
    animation.fromValue = @0;
    //結(jié)束位置:轉(zhuǎn)換成對象
    animation.toValue = @(M_PI*2/3);
    //重復(fù)次數(shù) 最大數(shù):(MAXFLOAT)一直旋轉(zhuǎn)
    animation.repeatCount = MAXFLOAT;
    //重復(fù)時間(優(yōu)先級高于重復(fù)次數(shù))(單位:s)
    animation.repeatDuration = 3;
    //是否移除結(jié)果(不復(fù)原)
    animation.removedOnCompletion = NO;
    /*
     kCAFillModeRemoved 這個是默認(rèn)值昼弟,動畫結(jié)束后,會恢復(fù)到之前的狀態(tài)
     kCAFillModeForwards 當(dāng)動畫結(jié)束后奕筐,會一直保持著動畫最后的狀態(tài)
     kCAFillModeBackwards 在動畫開始前舱痘,便立即進(jìn)入動畫的初始狀態(tài)并等待動畫開始。
     kCAFillModeBoth 這個其實就是上面兩個的合成.保持動畫最后的狀態(tài)
     */
    animation.fillMode = kCAFillModeForwards;
    //給imageView添加動畫离赫,forkey是一個標(biāo)識
    [self.myImageView.layer addAnimation:animation forKey:@"rotationAnimation"];
    return animation;
    
}
- (CAAnimation*)scaleAnimation{
    
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
 
    animation.duration = 3;
    //縮放倍數(shù)
    animation.fromValue = @1;
    animation.toValue = @0.5;
    animation.repeatDuration = 3;
    animation.removedOnCompletion = NO;
    animation.fillMode = kCAFillModeForwards;
    //forkey是一個標(biāo)識
//    [self.myImageView.layer addAnimation:animation forKey:@"scaleAnimation"];
    return animation;
    
}
//繪制一個貝塞爾曲線的路徑
- (CAAnimation *)bezierCurve{
    
    //通過關(guān)鍵幀的動畫來創(chuàng)建
    CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    //設(shè)置時間
    animation.duration = 3;
    //創(chuàng)建一個路徑
    CGMutablePathRef path = CGPathCreateMutable();
    //1.創(chuàng)建起點
    CGPoint startPoint = self.view.center;
    CGPathMoveToPoint(path, nil, startPoint.x,startPoint.y);
    //2.創(chuàng)建各個切線
    CGPoint point1 = CGPointMake(20,300);
    CGPoint point2 = CGPointMake(50, 400);
    CGPoint point3 = CGPointMake(100, 600);
    CGPathAddCurveToPoint(path, nil, point1.x, point1.y, point2.x, point2.y, point3.x, point3.y);
    //3.將路徑添加進(jìn)去
    animation.path = path;
    //不還原
    animation.removedOnCompletion = NO;
    animation.fillMode = kCAFillModeForwards;
    //
    [self.myImageView.layer addAnimation:animation forKey:@"bezierCurve"];
    //手動釋放路徑
    CGPathRelease(path);
    return animation;
    
    
}

-(CAAnimation *)ratationWaggle{
    CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"transform.rotation.z"];
    //持續(xù)時間
    animation.duration = 0.1;
    //無限晃動
    animation.repeatCount = MAXFLOAT;
    //設(shè)置一個數(shù)組芭逝,元素:旋轉(zhuǎn)的角度
    CGFloat angle = M_PI/20;
    //0 - 左搖-0-右搖-0
    animation.values = @[@0,@(-angle),@0,@(angle),@0];
//    [self.myImageView.layer addAnimation:animation forKey:@"waggle"];
    return animation;
}

3.gif
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市渊胸,隨后出現(xiàn)的幾起案子旬盯,更是在濱河造成了極大的恐慌,老刑警劉巖翎猛,帶你破解...
    沈念sama閱讀 219,270評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件胖翰,死亡現(xiàn)場離奇詭異,居然都是意外死亡切厘,警方通過查閱死者的電腦和手機(jī)萨咳,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,489評論 3 395
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來疫稿,“玉大人培他,你說我怎么就攤上這事鹃两。” “怎么了舀凛?”我有些...
    開封第一講書人閱讀 165,630評論 0 356
  • 文/不壞的土叔 我叫張陵俊扳,是天一觀的道長。 經(jīng)常有香客問我猛遍,道長馋记,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,906評論 1 295
  • 正文 為了忘掉前任螃壤,我火速辦了婚禮抗果,結(jié)果婚禮上筋帖,老公的妹妹穿的比我還像新娘奸晴。我一直安慰自己,他們只是感情好日麸,可當(dāng)我...
    茶點故事閱讀 67,928評論 6 392
  • 文/花漫 我一把揭開白布寄啼。 她就那樣靜靜地躺著,像睡著了一般代箭。 火紅的嫁衣襯著肌膚如雪墩划。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,718評論 1 305
  • 那天嗡综,我揣著相機(jī)與錄音乙帮,去河邊找鬼。 笑死极景,一個胖子當(dāng)著我的面吹牛察净,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播盼樟,決...
    沈念sama閱讀 40,442評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼氢卡,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了晨缴?” 一聲冷哼從身側(cè)響起译秦,我...
    開封第一講書人閱讀 39,345評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎击碗,沒想到半個月后筑悴,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,802評論 1 317
  • 正文 獨居荒郊野嶺守林人離奇死亡稍途,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,984評論 3 337
  • 正文 我和宋清朗相戀三年雷猪,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片晰房。...
    茶點故事閱讀 40,117評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡求摇,死狀恐怖射沟,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情与境,我是刑警寧澤验夯,帶...
    沈念sama閱讀 35,810評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站摔刁,受9級特大地震影響挥转,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜共屈,卻給世界環(huán)境...
    茶點故事閱讀 41,462評論 3 331
  • 文/蒙蒙 一绑谣、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧拗引,春花似錦借宵、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,011評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至哼凯,卻和暖如春欲间,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,139評論 1 272
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留崭添,地道東北人。 一個月前我還...
    沈念sama閱讀 48,377評論 3 373
  • 正文 我出身青樓她渴,卻偏偏與公主長得像,于是被迫代替她去往敵國和親虱疏。 傳聞我的和親對象是個殘疾皇子惹骂,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,060評論 2 355

推薦閱讀更多精彩內(nèi)容