一. UIView 動畫
動畫的屬性：
frame: 視圖框架?
center: 視圖的位置
alpha: 視圖的透明度
bounds: 視圖的大小
transform: 視圖的裝換
backgroundColor: 背景色
1.UIView的設(shè)置方法
//開始動畫設(shè)置 ?參數(shù)1:標(biāo)識符(名字) ?參數(shù)2:攜帶的參數(shù) ?
[UIView?beginAnimations:@"UIView"?context:nil];
//?設(shè)置動畫持續(xù)時間
[UIView?setAnimationDuration:3];
//?設(shè)置動畫延遲,?延遲多少秒開始??
[UIView?setAnimationDelay:0];?
//?設(shè)置動畫的速度曲線 ?
[UIView?setAnimationCurve:UIViewAnimationCurveEaseIn]?
//?設(shè)置反轉(zhuǎn)??
[UIView?setAnimationRepeatAutoreverses:YES];?
//?設(shè)置動畫循環(huán)次數(shù)?
[UIView?setAnimationRepeatCount:1];?
//?設(shè)置動畫的代理??
[UIView?setAnimationDelegate:self];
//設(shè)置動畫開始的代理方法
[UIView?setAnimationWillStartSelector:@selector(willStart)];
//設(shè)置動畫結(jié)束的代理方法
[UIView?setAnimationWillEndSelector:@selector(willEnd)];?
//?動畫從當(dāng)前狀態(tài)繼續(xù)執(zhí)行
[UIView?setAnimationBeginsFromCurrentState:YES];?
// 動畫提交??
[UIView?commitAnimations];
2.UIView 動畫的兩種 block方法:
2.1 簡單式的block
[UIView?animateWithDuration:1?animations:^{??
//?執(zhí)行的動畫??
_imageView.center?=?CGPointMake(100, 200);??
????}];?
2.2 ?該 block 動畫結(jié)束后可以做需要的操作
// action: block 動畫結(jié)束后該做的事??
[UIView?animateWithDuration:1?animations:^{??
//?如果設(shè)置了反轉(zhuǎn)屬性,那么在動畫結(jié)束后不用在另行添加動畫效果了??
[UIView?setAnimationRepeatAutoreverses:YES];??
//?這里寫執(zhí)行的動畫??
}?completion:^(BOOL?finished)?{ ?
//?上面動畫結(jié)束觸發(fā)(相當(dāng)于?代理方法中的完成動畫的方法)??
//?還可以繼續(xù)添加其他的動畫??
[UIView?animateWithDuration:1?animations:^{??
}?completion:^(BOOL?finished)?{??
?}]; ?
action;???}];?
CGAffineTransform2D仿射變換
1>平移(2D仿射變換方法) ?
[UIView?animateWithDuration:1?animations:^{??
//?如果設(shè)置了反轉(zhuǎn)屬性,那么在動畫結(jié)束后不用在另行添加動畫效果了??
[UIView?setAnimationRepeatAutoreverses:YES];??
//?執(zhí)行的動畫??
//?平移(2D仿射變換方法) ?
//?transform?形變屬性??
// self.imageView:要形變的?View??
self.imageView.transform?=?CGAffineTransformTranslate(self.imageView.transform,?100,?0);??
}?completion:^(BOOL?finished)?{ ?
//?上面動畫結(jié)束觸發(fā)(相當(dāng)于?代理方法中的完成動畫的方法)??
//?復(fù)原位置??
self.imageView.transform?=?CGAffineTransformTranslate(self.imageView.transform,?-100,?0);??
? ? }];
2>?縮放(2D仿射變換方法)??
[UIView?animateWithDuration:1?animations:^{ ?
//?反轉(zhuǎn) ?
[UIView?setAnimationRepeatAutoreverses:YES];??
//?縮放(2D仿射變換方法) ?
//?參數(shù)2/3?是縮放的比例??
self.imageView.transform?=?CGAffineTransformScale(self.imageView.transform,?2,?2);??
}?completion:^(BOOL?finished)?{ ?
self.imageView.transform?=?_transform;??
????}];
3>?旋轉(zhuǎn)(2D仿射變換方法)??
//?需求: ?
//?點擊按鈕,開始旋轉(zhuǎn),再點停止轉(zhuǎn)動??
[UIView?animateWithDuration:0.1?animations:^{ ?
//?旋轉(zhuǎn)??
//?參數(shù)二:旋轉(zhuǎn)角度??
self.imageView.transform?=?CGAffineTransformRotate(self.imageView.transform,?M_PI_2);??
}?completion:^(BOOL?finished)?{??
//?結(jié)束時調(diào)用旋轉(zhuǎn)方法??
[self?rotateAnimation];??
????}];??
? ? _isRuning?=?!_isRuning; ?
}??
//?循環(huán)轉(zhuǎn) ?
-?(void)rotateAnimation??
{??
if?(_isRuning?==?YES)?{??
[UIView?animateWithDuration:0.1?animations:^{??
//?旋轉(zhuǎn)??
//?參數(shù)二:旋轉(zhuǎn)角度??
self.imageView.transform?=?CGAffineTransformRotate(self.imageView.transform,?M_PI_2);??
//?給旋轉(zhuǎn)的初值??
self.isRuning?=?YES;??
}?completion:^(BOOL?finished)?{??
//?結(jié)束時調(diào)用旋轉(zhuǎn)方法??
[self?rotateAnimation];??
????????}];??
????}??
}?
二.?CALayer 動畫
CALayer層的屬性
//?layer?是負責(zé)顯示圖層的??
//?要更改看到的形狀,需要更改?layer??
//?設(shè)置圓角 ?
//?變圓的先決條件必須是長寬相同??
self.myView?=?[[UIView?alloc]?initWithFrame:CGRectMake(100,?100,?100,?100)];?
self.myView.layer.cornerRadius?=?self.myView.frame.size.width?/?2;??
//?設(shè)置陰影的顏色??
//?CGColorRef?是涂層繪制的顏色??
self.myView.layer.shadowColor?=?[UIColor?yellowColor].CGColor;??
//?設(shè)置陰影的顯示范圍??
self.myView.layer.shadowOffset?=?CGSizeMake(10,?10);??
//?陰影透明度??
self.myView.layer.shadowOpacity?=?1;??
//?模糊程度??
self.myView.layer.shadowRadius?=?50;??
//?設(shè)置邊框??
self.myView.layer.borderWidth?=?5;??
//?設(shè)置邊框的顏色??
self.myView.layer.borderColor?=?[UIColor?redColor].CGColor;?
1>CABasicAnimation 基礎(chǔ)動畫
//?旋轉(zhuǎn)??
-?(void)xyAnimation??
{??
//?創(chuàng)建一個基礎(chǔ)動畫??
//?注意:?KeyPath?一定不要拼錯??
//?要更改的是?transform.rotation.x??
//?形變屬性下?弧度的點?X?軸??
CABasicAnimation?*animation?=?[CABasicAnimation?animationWithKeyPath:@"transform.rotation.x"];??
//?設(shè)置屬性變化?到什么值??
//?toValue?需要一個對象類型,即?NSNumber?或?NSValue??
animation.toValue?=?[NSNumber?numberWithFloat:M_PI];??
//?設(shè)置動畫時間??
animation.duration?=?1;??
//?設(shè)置動畫重復(fù)??
animation.repeatCount?=?2;??
//?把設(shè)置好的動畫添加到?layer上 ?
//?參數(shù)2:添加的動畫標(biāo)識??
[self.myView.layer?addAnimation:animation?forKey:@"transform.rotation.x"];??
}
2>//?改變?size??
-?(void)sizeAnimation??
{??
//?更改大小的話,需要更改?bounds.size??
CABasicAnimation?*animation?=?[CABasicAnimation?animationWithKeyPath:@"bounds.size"];??
//?設(shè)置改變的值??
//?fromValue?初始值??
animation.fromValue?=?[NSValue?valueWithCGSize:CGSizeMake(10,?10)];??
//?toValue?結(jié)束值??
animation.toValue?=?[NSValue?valueWithCGSize:CGSizeMake(100,?100)];??
//?設(shè)置時間??
animation.duration?=?1;??
//?添加到?layer?上??
[self.myView.layer?addAnimation:animation?forKey:@"bounds.size"];??
}?
3> 3D旋轉(zhuǎn) ?
-?(void)transform3D??
{??
CABasicAnimation?*animation?=?[CABasicAnimation?animationWithKeyPath:@"transform"];??
//?結(jié)束值 ?
animation.toValue?=?[NSValue?valueWithCATransform3D:CATransform3DRotate(self.myView.layer.transform,?M_PI,?10,?20,?20)];??
animation.duration?=?1; ?
[self.myView.layer?addAnimation:animation?forKey:@"transform"]; ?
}
CAKeyframeAnimation 類似按軌跡移動, 位置, 執(zhí)行一組動畫的組動畫
1>//?改變顏色??
-?(void)changeBackGroundColor??
{??
//?可以執(zhí)行一組動畫??
CAKeyframeAnimation?*animation?=?[CAKeyframeAnimation?animationWithKeyPath:@"backgroundColor"];??
//?創(chuàng)建繪制顏色 ?
CGColorRef?color1?=?[UIColor?orangeColor].CGColor;??
CGColorRef?color2?=?[UIColor?lightGrayColor].CGColor;??
CGColorRef?color3?=?[UIColor?greenColor].CGColor;??
CGColorRef?color4?=?[UIColor?blueColor].CGColor;??
//?改變一組顏色 ?
animation.values?=?@[(id)color1,?(id)color2,?(id)color3,?(id)color4];??
//?設(shè)置時間 ?
animation.duration?=?2;??
//?添加到?layer?上??
[self.myView.layer?addAnimation:animation?forKey:@"backgroundColor"];??
}?
2>?軌跡移動??
-?(void)positionPoint??
{??
//????NSLog(@"%@",?NSStringFromCGPoint(self.myView.layer.position));??
CAKeyframeAnimation?*animation?=?[CAKeyframeAnimation?animationWithKeyPath:@"position"];??
//?創(chuàng)建一堆點??
NSValue?*point1?=?[NSValue?valueWithCGPoint:CGPointMake(100,?200)];??
NSValue?*point2?=?[NSValue?valueWithCGPoint:CGPointMake(200,?200)];??
NSValue?*point3?=?[NSValue?valueWithCGPoint:CGPointMake(100,?300)];??
NSValue?*point4?=?[NSValue?valueWithCGPoint:CGPointMake(200,?300)];??
NSValue?*point5?=?[NSValue?valueWithCGPoint:CGPointMake(100,?400)];??
//?添加點進數(shù)組 ?
animation.values?=?@[point1,?point2,?point3,?point4,?point5];??
//?設(shè)置時間 ?
animation.duration?=?1;??
//?添加到?layer上??
[self.myView.layer?addAnimation:animation?forKey:@"position"];??
}?
3>??左右晃動??
-?(void)positionX??
{??
CAKeyframeAnimation?*animation?=?[CAKeyframeAnimation?animationWithKeyPath:@"position.x"];??
CGFloat?center?=self.myView.layer.position.x; ?
CGFloat?left?=?center?-100;??
CGFloat?right?=?center?+100;??
NSNumber?*r?=?[NSNumber?numberWithFloat:right]; ?
NSNumber?*c?=?[NSNumber?numberWithFloat:center];??
NSNumber?*l?=?[NSNumber?numberWithFloat:left];??
animation.values?=?@[r,?c,?l,?c];??
//?設(shè)置時間??
animation.duration?=?0.5;??
//?設(shè)置重復(fù)次數(shù)??
animation.repeatCount?=?1000;??
//?添加到?layer上??
[self.myView.layer?addAnimation:animation?forKey:@"position.x"];??
}?
3>組動畫??
-?(void)groupAnimation??
{??
//?創(chuàng)建組動畫??
CAAnimationGroup?*group?=?[CAAnimationGroup?animation];??
/***********改變顏色************/ ?
//?改變顏色??
//?可以執(zhí)行一組動畫??
CAKeyframeAnimation?*animation1?=?[CAKeyframeAnimation?animationWithKeyPath:@"backgroundColor"];??
//?創(chuàng)建繪制顏色??
CGColorRef?color1?=?[UIColor?orangeColor].CGColor;??
CGColorRef?color2?=?[UIColor?lightGrayColor].CGColor;??
CGColorRef?color3?=?[UIColor?greenColor].CGColor;??
CGColorRef?color4?=?[UIColor?blueColor].CGColor;??
//?改變一組顏色??
animation1.values?=?@[(id)color1,?(id)color2,?(id)color3,?(id)color4];??
/*********改變大小**********/ ?
//?更改大小的話,需要更改?bounds.size ?
CABasicAnimation?*animation2?=?[CABasicAnimation?animationWithKeyPath:@"bounds.size"];??
//?設(shè)置改變的值??
//?fromValue?初始值??
animation2.fromValue?=?[NSValue?valueWithCGSize:CGSizeMake(10,?10)];??
//?toValue?結(jié)束值??
animation2.toValue?=?[NSValue?valueWithCGSize:CGSizeMake(100,?100)];??
//?設(shè)置組動畫時間??
group.duration?=?3;??
//?設(shè)置組動畫執(zhí)行的動畫數(shù)組??
group.animations?=?@[animation1,?animation2];??
//?添加到?layer?上??
[self.myView.layer?addAnimation:group?forKey:@"group"];??
}
