奮斗的七月
屬性說(shuō)明
- values : 一個(gè)NSArray對(duì)象榨惠。里面的元素稱為”關(guān)鍵幀”(keyframe),動(dòng)畫(huà)對(duì)象會(huì)在指定的時(shí)間(duration)內(nèi)，依次顯示values數(shù)組中的每一個(gè)關(guān)鍵幀
- path : (畫(huà)圓懈玻、橢圓、貝塞兒曲線)可以設(shè)置一個(gè)CGPathRef\CGMutablePathRef,讓層跟著路徑移動(dòng),path只對(duì)CALayer的anchorPoint和position起作用,如果你設(shè)置了path，那么values將被忽略
- keyTimes : 可以為對(duì)應(yīng)的關(guān)鍵幀指定對(duì)應(yīng)的時(shí)間點(diǎn),其取值范圍為0到1.0,keyTimes中的每一個(gè)時(shí)間值都對(duì)應(yīng)values中的每一幀.當(dāng)keyTimes沒(méi)有設(shè)置的時(shí)候,各個(gè)關(guān)鍵幀的時(shí)間是平分的
- timingFunctions: 控制動(dòng)畫(huà)快進(jìn)慢出焊切、慢進(jìn)快出等特性
- rotationMode(確定沿路徑動(dòng)畫(huà)的對(duì)象是否旋轉(zhuǎn)以匹配路徑切線)
- tensionValues(定義曲線緊密度的NSNumber對(duì)象數(shù)組)
- continuityValues(NSNumber對(duì)象的數(shù)組砰碴，定義了時(shí)序曲線拐角的銳度)
- biasValues(一個(gè)NSNumber對(duì)象數(shù)組躏筏，用于定義曲線相對(duì)于控制點(diǎn)的位置)
- Rotation Mode Values(這些常量由rotationMode屬性使用。)
- Value calculation modes(這些常量由calculateMode屬性使用)
實(shí)例
點(diǎn)贊動(dòng)畫(huà) ( 紅心動(dòng)畫(huà) )
- (void)initBtn{
UIButton *btn = [[UIButton alloc]init];
btn.frame = CGRectMake(50, 150, 30, 30);
// btn.showsTouchWhenHighlighted = YES;//---點(diǎn)擊閃爍
[btn setImage:[UIImage imageNamed:@"priase_dafault"] forState:UIControlStateNormal];
[btn setImage:[UIImage imageNamed:@"priase_select"] forState:UIControlStateSelected];
[btn addTarget:self action:@selector(btnClick:) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:btn];
}
- (void)btnClick:(UIButton *)sender{
sender.selected = !sender.selected;
CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"transform.scale"];
if (sender.selected) {
animation.values = @[@1.5 ,@0.8, @1.0,@1.2,@1.0];
animation.duration = 0.5;
}else{
animation.values = @[@0.8, @1.0];
animation.duration = 0.4;
}
animation.calculationMode = kCAAnimationCubic;
[sender.layer addAnimation:animation forKey:@"transform.scale"];
}
紅心移動(dòng)到屏幕右下角
- (void)initBtn{
UIButton *btn = [[UIButton alloc]init];
btn.frame = CGRectMake(50, 150, 30, 30);
// btn.showsTouchWhenHighlighted = YES;//---點(diǎn)擊閃爍
[btn setImage:[UIImage imageNamed:@"priase_dafault"] forState:UIControlStateNormal];
[btn setImage:[UIImage imageNamed:@"priase_select"] forState:UIControlStateSelected];
[btn addTarget:self action:@selector(btnClick:) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:btn];
}
- (void)btnClick:(UIButton *)sender{
sender.selected = !sender.selected;
CAKeyframeAnimation *caAnimation = [CAKeyframeAnimation animation];
caAnimation.keyPath = @"position";
NSValue *V1 = [NSValue valueWithCGPoint:sender.center];
NSValue *V2 = [NSValue valueWithCGRect:CGRectMake(self.view.frame.size.width-30, self.view.frame.size.height-30, 30, 30)];
caAnimation.values = @[V1,V2];
caAnimation.duration = 3;
caAnimation.removedOnCompletion = NO;
caAnimation.fillMode = kCAFillModeForwards;
[sender.layer addAnimation:caAnimation forKey:nil];
}
紅心轉(zhuǎn)圈動(dòng)畫(huà)
- (void)initBtn{
UIButton *btn = [[UIButton alloc]init];
btn.frame = CGRectMake(50, 150, 30, 30);
// btn.showsTouchWhenHighlighted = YES;//---點(diǎn)擊閃爍
[btn setImage:[UIImage imageNamed:@"priase_dafault"] forState:UIControlStateNormal];
[btn setImage:[UIImage imageNamed:@"priase_select"] forState:UIControlStateSelected];
[btn addTarget:self action:@selector(btnClick:) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:btn];
}
- (void)btnClick:(UIButton *)sender{
sender.selected = !sender.selected;
//設(shè)置path************************
CAKeyframeAnimation *anim = [CAKeyframeAnimation animation];
// 設(shè)置動(dòng)畫(huà)屬性
anim.keyPath = @"position";
UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0, 0, 200, 200)];
anim.path = path.CGPath;
anim.duration = 0.25;
// 取消反彈
anim.removedOnCompletion = NO;
anim.fillMode = kCAFillModeForwards;
anim.repeatCount = MAXFLOAT;
[sender.layer addAnimation:anim forKey:nil];
}
紅心抖動(dòng)
#define angle2radian(x) ((x) /180.0* M_PI)
- (void)initBtn{
UIButton *btn = [[UIButton alloc]init];
btn.frame = CGRectMake(50, 150, 30, 30);
// btn.showsTouchWhenHighlighted = YES;//---點(diǎn)擊閃爍
[btn setImage:[UIImage imageNamed:@"priase_dafault"] forState:UIControlStateNormal];
[btn setImage:[UIImage imageNamed:@"priase_select"] forState:UIControlStateSelected];
[btn addTarget:self action:@selector(btnClick:) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:btn];
}
- (void)btnClick:(UIButton *)sender{
sender.selected = !sender.selected;
CAKeyframeAnimation*anim = [CAKeyframeAnimation animation];
anim.keyPath=@"transform.rotation";
anim.values=@[@(angle2radian(-5)),@(angle2radian(5)),@(angle2radian(-5))];
anim.repeatCount=MAXFLOAT;
anim.duration=0.5;
[sender.layer addAnimation:anim forKey:nil];
}
keyPath可以使用的key
- #define angle2Radian(angle) ((angle)/180.0*M_PI)
- transform.rotation.x 圍繞x軸翻轉(zhuǎn) 參數(shù)：角度 angle2Radian(4)
transform.rotation.y 圍繞y軸翻轉(zhuǎn) 參數(shù)：同上
transform.rotation.z 圍繞z軸翻轉(zhuǎn) 參數(shù)：同上
transform.rotation 默認(rèn)圍繞z軸
transform.scale.x x方向縮放 參數(shù)：縮放比例 1.5
transform.scale.y y方向縮放 參數(shù)：同上
transform.scale.z z方向縮放 參數(shù)：同上
transform.scale 所有方向縮放 參數(shù)：同上
transform.translation.x x方向移動(dòng) 參數(shù)：x軸上的坐標(biāo) 100
transform.translation.y x方向移動(dòng) 參數(shù)：y軸上的坐標(biāo)
transform.translation.z x方向移動(dòng) 參數(shù)：z軸上的坐標(biāo)
transform.translation 移動(dòng) 參數(shù)：移動(dòng)到的點(diǎn) （100呈枉，100）
opacity 透明度 參數(shù)：透明度 0.5
backgroundColor 背景顏色 參數(shù)：顏色 (id)[[UIColor redColor] CGColor]
cornerRadius 圓角 參數(shù)：圓角半徑 5
borderWidth 邊框?qū)挾?參數(shù)：邊框?qū)挾?5
bounds 大小 參數(shù)：CGRect
contents 內(nèi)容 參數(shù)：CGImage
contentsRect 可視內(nèi)容 參數(shù)：CGRect 值是0～1之間的小數(shù)
hidden 是否隱藏
position
shadowColor
shadowOffset
shadowOpacity
shadowRadius
------注意------
fillMode的作用就是決定當(dāng)前對(duì)象過(guò)了非active時(shí)間段的行為. 比如動(dòng)畫(huà)開(kāi)始之前,動(dòng)畫(huà)結(jié)束之后趁尼。如果是一個(gè)動(dòng)畫(huà)CAAnimation,則需要將其removedOnCompletion設(shè)置為NO,要不然fillMode不起作用.
查文檔看了下removedOnCompletion和fillMode這兩個(gè)屬性配合使用
各個(gè)fillMode的意義
- kCAFillModeRemoved 這個(gè)是默認(rèn)值,也就是說(shuō)當(dāng)動(dòng)畫(huà)開(kāi)始前和動(dòng)畫(huà)結(jié)束后,動(dòng)畫(huà)對(duì)layer都沒(méi)有影響,動(dòng)畫(huà)結(jié)束后,layer會(huì)恢復(fù)到之前的狀態(tài)
- kCAFillModeForwards 當(dāng)動(dòng)畫(huà)結(jié)束后,layer會(huì)一直保持著動(dòng)畫(huà)最后的狀態(tài)
- kCAFillModeBackwards 這個(gè)和kCAFillModeForwards是相對(duì)的,就是在動(dòng)畫(huà)開(kāi)始前,你只要將動(dòng)畫(huà)加入了一個(gè)layer,layer便立即進(jìn)入動(dòng)畫(huà)的初始狀態(tài)并等待動(dòng)畫(huà)開(kāi)始.你可以這樣設(shè)定測(cè)試代碼,將一個(gè)動(dòng)畫(huà)加入一個(gè)layer的時(shí)候延遲5秒執(zhí)行.然后就會(huì)發(fā)現(xiàn)在動(dòng)畫(huà)沒(méi)有開(kāi)始的時(shí)候,只要?jiǎng)赢?huà)被加入了layer,layer便處于動(dòng)畫(huà)初始狀態(tài)
- kCAFillModeBoth 理解了上面兩個(gè),這個(gè)就很好理解了,這個(gè)其實(shí)就是上面兩個(gè)的合成.動(dòng)畫(huà)加入后開(kāi)始之前,layer便處于動(dòng)畫(huà)初始狀態(tài),動(dòng)畫(huà)結(jié)束后layer保持動(dòng)畫(huà)最后的狀態(tài).
rotationAnimation.removedOnCompletion = NO;
rotationAnimation.fillMode = kCAFillModeForwards;
