CABasicAnimation

一、簡介

  • CABasicAnimation是CAPropertyAnimation的子類, CAPropertyAnimation有一個(gè)字符串類型的keyPath屬性
結(jié)構(gòu)圖.png
  • keyPath內(nèi)容是CALayer的可動(dòng)畫Animatable屬性朗涩,可動(dòng)畫屬性可見CAlayer篇

  • 我們可以指定CALayer的某個(gè)屬性名為keyPath,并且對CALayer的這個(gè)屬性的值進(jìn)行修改宜鸯,達(dá)到相應(yīng)的動(dòng)畫效果两曼。

    • 例如:指定keyPath = @"position"敦迄,就會修改CALayer的position屬性的值钠怯,- > 可以實(shí)現(xiàn)平移的動(dòng)畫效果
  • 屬性說明: fromValue:keyPath相應(yīng)屬性的初始值佳魔,ntoValue:keyPath相應(yīng)屬性的結(jié)束值

  • 因此,初始化好CAPropertyAnimation的子類對象后晦炊,必須先設(shè)置keyPath(修改的是CALayer的哪個(gè)屬性)-> 指明執(zhí)行的是怎樣的動(dòng)畫(平移/縮放/旋轉(zhuǎn)等)

動(dòng)畫過程說明:

  • 隨著動(dòng)畫的進(jìn)行鞠鲜,在長度為 duration的持續(xù)時(shí)間內(nèi),keyPath相應(yīng)屬性的值從fromValue漸漸地變?yōu)?code>toValue
  • keyPath內(nèi)容是CALayer的可動(dòng)畫Animatable屬性
  • 如果fillMode=kCAFillModeForwards同時(shí)removedOnComletion=NO断国,那么在動(dòng)畫執(zhí)行完畢后贤姆,圖層會保持顯示動(dòng)畫執(zhí)行后的狀態(tài)。但在實(shí)質(zhì)上稳衬,圖層的屬性值還是動(dòng)畫執(zhí)行前的初始值霞捡,并沒有真正被改變。

二薄疚、應(yīng)用

1碧信、縮放動(dòng)畫

  • 多種方案赊琳,這里實(shí)現(xiàn)三種就。

  • 方案一:CABasicAnimation animationWithKeyPath:@"bounds"

    • layer會從原來的尺寸變?yōu)?0x30
 CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"bounds"];
anim.duration = 2;

anim.toValue = [NSValue valueWithCGRect:CGRectMake(0, 0, 30, 30)];

[_myView.layer addAnimation:anim forKey:nil];
  • 方案二:CABasicAnimation animationWithKeyPath:@"transform"
CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"transform"];
anim.duration = 1.5; // 動(dòng)畫持續(xù)1.5s

// CALayer的寬度從0.5倍變?yōu)?倍
// CALayer的高度從0.5倍變?yōu)?.5倍
anim.fromValue = [NSValue valueWithCATransform3D:CATransform3DMakeScale(0.5, 0.5, 1)];
anim.toValue  = [NSValue valueWithCATransform3D:CATransform3DMakeScale(2, 1.5, 1)];

[_myView.layer addAnimation:anim forKey:nil];
  • 方案三:anim.keyPath = @"transform.scale";
// 創(chuàng)建CABasicAnimation
    CABasicAnimation *anim = [CABasicAnimation animation];
    
    // 告訴系統(tǒng)修改圖層的哪個(gè)屬性
    
    anim.keyPath = @"transform.scale";
    
    // 告訴系統(tǒng)修改圖層的哪個(gè)值
    //    anim.toValue = [NSValue valueWithCGPoint:CGPointMake(300, 300)];
    anim.toValue = @0.5;
    
    // 取消反彈
    // 告訴在動(dòng)畫結(jié)束的時(shí)候不要移除
    anim.removedOnCompletion = NO;
    // 始終保持最新的效果
    anim.fillMode = kCAFillModeForwards;
    
    [_redView.layer addAnimation:anim forKey:nil];

2音婶、平移動(dòng)畫

  • 多種方式實(shí)現(xiàn)

  • 2.1方式一:CABasicAnimation -> anim.keyPath = @"position";

    • 注意:該方式動(dòng)畫執(zhí)行完畢后慨畸,并沒有真正改變CALayer的position屬性的值莱坎,一切都是假象,并不會真實(shí)修改layer的屬性 衣式,不會平移到(250,500)
    CABasicAnimation *anim = [CABasicAnimation animation];
    
    anim.keyPath = @"position";
    
    anim.toValue = [NSValue valueWithCGPoint:CGPointMake(250, 500)];
    
    // 必須設(shè)置代理
    anim.delegate = self;
    
    // 取消反彈
    anim.removedOnCompletion = NO;
    anim.fillMode = kCAFillModeForwards;
    
    [_redView.layer addAnimation:anim forKey:nil];
  • 2.2 CABasicAnimation -> animationWithKeyPath:@"transform"
    • 注意:通過CALayer的transform屬性實(shí)現(xiàn)平移動(dòng)畫,layer會從自己的初始位置平移到(350, 350)位置
CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"transform"];
anim.duration = 1;

CATransform3D form = CATransform3DMakeTranslation(350, 350, 0);
anim.toValue = [NSValue valueWithCATransform3D:form];

[_myView.layer addAnimation:anim forKey:nil];
  • 2.3 _redView.layer.position :修改layer的可動(dòng)畫屬性檐什,UIView 的方法animateWithDuration:.......執(zhí)行動(dòng)畫
    • 該方式碴卧,實(shí)現(xiàn)了真正的平移到(250,500)
   [UIView animateWithDuration:0.25 animations:^{
       
        _redView.layer.position = CGPointMake(250, 500);
        
    } completion:^(BOOL finished) {
        NSLog(@"%@", NSStringFromCGPoint(_redView.layer.position));
    }];

3、旋轉(zhuǎn)動(dòng)畫

  • 這里就例舉一種實(shí)現(xiàn)方案了乃正。
CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"transform"];
anim.duration = 1.5;

// 繞著(0, 0, 1)這個(gè)向量軸 Z 軸住册,順時(shí)針旋轉(zhuǎn)45°(M_PI_4)
anim.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI_4, 0, 0, 1)];

[_redView.layer addAnimation:anim forKey:nil];
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市瓮具,隨后出現(xiàn)的幾起案子荧飞,更是在濱河造成了極大的恐慌,老刑警劉巖名党,帶你破解...
    沈念sama閱讀 206,968評論 6 482
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件叹阔,死亡現(xiàn)場離奇詭異,居然都是意外死亡传睹,警方通過查閱死者的電腦和手機(jī)耳幢,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,601評論 2 382
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來欧啤,“玉大人睛藻,你說我怎么就攤上這事⌒纤恚” “怎么了店印?”我有些...
    開封第一講書人閱讀 153,220評論 0 344
  • 文/不壞的土叔 我叫張陵,是天一觀的道長倒慧。 經(jīng)常有香客問我吱窝,道長,這世上最難降的妖魔是什么迫靖? 我笑而不...
    開封第一講書人閱讀 55,416評論 1 279
  • 正文 為了忘掉前任院峡,我火速辦了婚禮,結(jié)果婚禮上系宜,老公的妹妹穿的比我還像新娘照激。我一直安慰自己,他們只是感情好盹牧,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,425評論 5 374
  • 文/花漫 我一把揭開白布俩垃。 她就那樣靜靜地躺著励幼,像睡著了一般。 火紅的嫁衣襯著肌膚如雪口柳。 梳的紋絲不亂的頭發(fā)上苹粟,一...
    開封第一講書人閱讀 49,144評論 1 285
  • 那天,我揣著相機(jī)與錄音跃闹,去河邊找鬼嵌削。 笑死,一個(gè)胖子當(dāng)著我的面吹牛望艺,可吹牛的內(nèi)容都是我干的苛秕。 我是一名探鬼主播,決...
    沈念sama閱讀 38,432評論 3 401
  • 文/蒼蘭香墨 我猛地睜開眼找默,長吁一口氣:“原來是場噩夢啊……” “哼艇劫!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起惩激,我...
    開封第一講書人閱讀 37,088評論 0 261
  • 序言:老撾萬榮一對情侶失蹤店煞,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后风钻,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體顷蟀,經(jīng)...
    沈念sama閱讀 43,586評論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,028評論 2 325
  • 正文 我和宋清朗相戀三年魄咕,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了衩椒。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,137評論 1 334
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡哮兰,死狀恐怖毛萌,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情喝滞,我是刑警寧澤阁将,帶...
    沈念sama閱讀 33,783評論 4 324
  • 正文 年R本政府宣布,位于F島的核電站右遭,受9級特大地震影響做盅,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜窘哈,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,343評論 3 307
  • 文/蒙蒙 一吹榴、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧滚婉,春花似錦图筹、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,333評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽扣溺。三九已至,卻和暖如春瓜晤,著一層夾襖步出監(jiān)牢的瞬間锥余,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,559評論 1 262
  • 我被黑心中介騙來泰國打工痢掠, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留驱犹,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 45,595評論 2 355
  • 正文 我出身青樓志群,卻偏偏與公主長得像着绷,于是被迫代替她去往敵國和親蛔钙。 傳聞我的和親對象是個(gè)殘疾皇子锌云,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,901評論 2 345

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

  • 在iOS中隨處都可以看到絢麗的動(dòng)畫效果,實(shí)現(xiàn)這些動(dòng)畫的過程并不復(fù)雜吁脱,今天將帶大家一窺ios動(dòng)畫全貌桑涎。在這里你可以看...
    每天刷兩次牙閱讀 8,465評論 6 30
  • 在iOS中隨處都可以看到絢麗的動(dòng)畫效果,實(shí)現(xiàn)這些動(dòng)畫的過程并不復(fù)雜兼贡,今天將帶大家一窺iOS動(dòng)畫全貌攻冷。在這里你可以看...
    F麥子閱讀 5,096評論 5 13
  • 在iOS實(shí)際開發(fā)中常用的動(dòng)畫無非是以下四種:UIView動(dòng)畫,核心動(dòng)畫遍希,幀動(dòng)畫等曼,自定義轉(zhuǎn)場動(dòng)畫。 1.UIView...
    請叫我周小帥閱讀 3,078評論 1 23
  • Core Animation Core Animation凿蒜,中文翻譯為核心動(dòng)畫禁谦,它是一組非常強(qiáng)大的動(dòng)畫處理API,...
    45b645c5912e閱讀 3,016評論 0 21
  • 本文目錄 一废封、平移動(dòng)畫 二州泊、縮放動(dòng)畫 三、旋轉(zhuǎn)動(dòng)畫 四漂洋、其他 CABasicAnimation是CAPropert...
    隨風(fēng)飄蕩的小逗逼閱讀 281評論 0 0