// ViewController.h
#import <UIKit/UIKit.h>
@interface ViewController : UIViewController
@end
// ViewController.m
#import "ViewController.h"
@interface ViewController ()
@property (weak, nonatomic) IBOutlet UIView *redView;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
}
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
// 位移
// [self move];
// 缩放
// [self scale];
// 透明度
// [self alpha];
// [self move1];
[self move2];
}
// 位移
- (void)move {
// // 首尾式
// [UIView beginAnimations:nil context:nil];
// // 执行动画
// CGRect tempFrame = self.redView.frame;
// tempFrame.origin.y += 50;
// self.redView.frame = tempFrame;
// [UIView commitAnimations];
// // 回调式
// [UIView animateWithDuration:1.0 animations:^{
// // 执行动画
// CGRect tempFrame = self.redView.frame;
// tempFrame.origin.y += 50;
// self.redView.frame = tempFrame;
// }];
// // 花1秒的时间执行平移动画,执行完之后,1秒之后,
// // 花3秒的时间把视图背景色设置成蓝色
// [UIView animateWithDuration:1.0 animations:^{
// //执行动画
// CGRect tempFrame = self.redView.frame;
// tempFrame.origin.y += 50;
// self.redView.frame = tempFrame;
// } completion:^(BOOL finished) {
// if (finished) {
// [UIView animateWithDuration:3.0 animations:^{
// self.redView.backgroundColor = [UIColor blueColor];
// }];
// }
// }];
/*
UIViewAnimationOptionCurveEaseInOut 开始和结束比较慢,中间比较快
UIViewAnimationOptionCurveEaseIn 开场比较慢,后面比较快
UIViewAnimationOptionCurveEaseOut 开场正常,结尾比较慢
UIViewAnimationOptionCurveLinear 线性----> 匀速
*/
// 先延迟3秒,等待3秒,3秒之后,花0.5秒的时间执行平移动画,执行完之后
// 在花3秒的时间把视图背景色设置成蓝色
[UIView animateWithDuration:0.5 delay:3.0 options:UIViewAnimationOptionCurveLinear animations:^{
//执行动画
CGRect tempFrame = self.redView.frame;
tempFrame.origin.y += 100;
self.redView.frame = tempFrame;
} completion:^(BOOL finished) {
if (finished) {
[UIView animateWithDuration:3.0 animations:^{
self.redView.backgroundColor = [UIColor blueColor];
}];
}
}];
}
- (void)move1 {
// 先延迟0秒,等待0秒,0秒之后,花0.5秒的时间执行平移动画,执行完之后
// 在花0.5秒的时间把视图平移回去
[UIView animateWithDuration:0.5 delay:0 options:UIViewAnimationOptionCurveLinear animations:^{
// 执行动画
self.redView.transform = CGAffineTransformMakeTranslation(0, 100);
// self.redView.transform = CGAffineTransformMakeRotation(-M_PI_4);
// self.redView.layer.transform = CATransform3DMakeScale(2.0, 2.0, 1);
// self.redView.transform = CGAffineTransformMakeScale(2.0, 2.0);
} completion:^(BOOL finished) {
if (finished) {
// 清空形变
[UIView animateWithDuration:0.5 animations:^{
self.redView.transform = CGAffineTransformIdentity;
}];
}
}];
}
- (void)move2 {
/*
usingSpringWithDamping: 0.0f到1.0f,数值越小「弹簧」的振动效果越明显
initialSpringVelocity: 表示初始的速度,数值越大一开始移动越快
*/
[UIView animateWithDuration:0.5 delay:0 usingSpringWithDamping:0.3 initialSpringVelocity:0 options:UIViewAnimationOptionCurveLinear animations:^{
self.redView.transform = CGAffineTransformMakeTranslation(0, 100);
} completion:^(BOOL finished) {
if (finished) {
// 清空形变
[UIView animateWithDuration:0.5 animations:^{
self.redView.transform = CGAffineTransformIdentity;
}];
}
}];
}
// 缩放
- (void)scale {
// 先延迟0秒,等待0秒,0秒之后,花0.5秒的时间执行缩放动画,执行完之后
// 在花3秒的时间把视图背景色设置成蓝色
[UIView animateWithDuration:0.5 delay:0 options:UIViewAnimationOptionCurveLinear animations:^{
//执行动画
CGRect tempFrame = self.redView.frame;
tempFrame.size.width += 30;
tempFrame.size.height += 30;
self.redView.frame = tempFrame;
} completion:^(BOOL finished) {
if (finished) {
[UIView animateWithDuration:3.0 animations:^{
self.redView.backgroundColor = [UIColor blueColor];
}];
}
}];
}
// 透明度
- (void)alpha {
// 先延迟0秒,等待0秒,0秒之后,花1.0秒的时间执行透明度动画,执行完之后
// 在花5.0秒的时间把视图设置成可见
[UIView animateWithDuration:1.0 delay:0 options:UIViewAnimationOptionCurveLinear animations:^{
//执行动画
self.redView.alpha = 0;
} completion:^(BOOL finished) {
if (finished) {
[UIView animateWithDuration:5.0 animations:^{
self.redView.alpha = 1.0;
}];
}
}];
}
@end
UIView渐变动画
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
- 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
推荐阅读更多精彩内容
- 前言 你是否注意到,“渐变设计”已经成为了一种美的体验。无论是APP的icon,还是PPT的背景,渐变色都比纯色要...
- iOS实现颜色渐变第二篇 在记录完上一篇的"iOS绘制渐变色背景"学习之后,有一位小伙伴get了上篇文章还给我留了...