iOS巅峰之UI视图动画详解

最新推荐文章于 2021-10-12 14:43:30 发布
最新推荐文章于 2021-10-12 14:43:30 发布
阅读量422 收藏
点赞数
分类专栏： iOS开发 UIView视图动画
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qw656567/article/details/48690229
版权
UIView动画
- (void)addSubViews
定义一个imageView和button
// 保存一下中心点
_center  = self.imageView.center;
// 保存一下frame
_frame = self.imageView.frame;

- (void)button
{
// UIView动画  特点:全是类方法调用, 开始与结束之间的部分是动画改变的部分
// 动画大小, 位置, 颜色, 透明度等
// 动画开始
// 参数1:标示符(名字)   参数2:携带的参数
[UIView beginAnimations:@“UIView” context:nil];
// 动画提交
// 设置时间, 在多少秒钟完结动画
[UIView setAnimationDuration:1];
// 设置动画延迟多少秒开始
[UIView setAnimationDelay:2];
// 动画设置反转
[UIView setAnimationRepeatAutoreverses:YES];
// 设置代理
[UIView setAnimationDelegate:self];
// 设置代理方法
[UIView setAnimationWillStartSelector:@selector(WillStart)];
[UIView setAnimationDidStopSelector:@selector(DidStop)];
// 设置循环几次
[UIView setAnimationRepeatCount:1];
// 设置速度曲线
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
// UIView改变位置
self.imageView.center = CGPointMake(200, 500);
// 设置持续执行动画
[UIView setAnimationBeginsFromCurrentState:YES];
// 改变颜色
self.imageView.backgroundColor = [UIColor colorWithRed:arc4random() % 256 / 255.0 green:arc4random() % 256 / 255.0 blue:arc4random() % 256 / 255.0 alpha : 1];
// 改变透明度
self.imageView.alpha = arc4random() % 256 / 255.0;
// 改变大小
CGRect frame = self.imageView.frame;
frame.size = CGSizeMake(200, 200);
self.imageView.frame = frame;
// 动画提交
[UIImage commitAnimations];
}
#pragma mark ——自己设置的代理方法
- (void)WillStart
{
NSLog(@“动画开始”);
}
- (void)DidStop
{
NSLog(@“动画结束”);
// 复原位置
self.imageView.center = self.center;
self.imageView.frame = self.frame;
// 记录一下形变属性
_transform = self.imageView.transform;
}

- (void)addSubButton
定义一个button

// UIView 动画的block方法
- (void)actionBlockButton
{
// UIView block方法
[UIView animateWithDuration:1 animations:^{
// 执行的动画方法
self.imageView.center = CGPointMake(400, 400);
}];

// block方法2
//---------------------------------------
// 参数3:该block写动画结束后要干的事
[UIView animateWithDuration:1 animations:^{
// 执行动画
// 2D仿射变换, transform形变属性
// 平移
// 参数一:填要形变的View
self.imageView.transform = CGAffineTransformTranslate(self.imageView.transform, 100 , 0);
} completion:^(BOOL finished) {
// 上面动画结束后, 触发(相当于代理方法的完成动画方法)
// 复原位置
// 如果设置了, 反转属性, 那么在动画结束后, 不用另添加动画效果
[UIView animateWithDuration:1 animations:^{
self.imageView.transform = CGAffineTransformTranslate(self.imageView.transform, -100, 0);
}];

// 用反转不用block实现复原位置
[UIView setAnimationRepeatAutoreverses:YES];
self.imageView.transform = CGAffineTransformTranslate(self.imageView.transform, -100, 0);

#pragma mark————缩放
[UIView animateWithDuration:1 animations:^{
// 设置反转
[UIView setAnimationRepeatAutoreverses:YES];
// 缩放
// 参数2, 3:缩放的比例
self.imageView.transform = CGAffineTransformScale(self.imageView.transform, 2, 2);
} completion:^(BOOL finished) {
// 复原
self.imageView.transform = CGAffineTransformScale(self.imageView.transform, 0.5, 0.5);
self.imageView.transform = _transform;
}];

#pragma mark — 旋转
// 需求:
// 点击按钮:开始一直转,再点停了
//参数2:旋转的角度
self.imageView.transform = CGAffineTransformRotate(self.imageView.transform, M_PI);
}completion:^(BOOL finished) {
// 结束时调用循环转
[self rotateAnimation];
}];
// 更改转动状态
_isRunning = !_isRunning;
}

// 循环转
- (void)rotateAnimation
{
if (_isRunning == YES) {
[UIView animateWithDuration:1 animations:^{
self.imageView.transform = CGAffineTransformRotate(self.imageView.transform, M_PI);
} completion:^(BOOL finished) {
[self rotateAnimation];
}];
}
}


// UIView 切换的动画
+ (void)transitionFromView:(UIView *)fromView toView:(UIView *)toView duration:(NSTimeInterval)duration options:(UIViewAnimationOptions) options completion:(void(^)(BOOL finished)) completion

// 创建视图
- (void)addSubViews
{
定义一个UIView的对象myView(属性)
// layer是负责显示图层的
//要更改咱们看到的图形形状, 需要更改layer
// 设置圆角
// 先决条件变圆必须是长宽相同
self.myView.layer.cornerRadius = self.myView.frame.size.width / 2;
// 设置阴影的颜色
//CGColorRef 涂层绘制的颜色
self.myView.layer.shadowColor = [UIColor greenColor].CGColor;
// 阴影的显示范围
self.myView.layer.shadowOffset = CGSizeMake(10, 10);
// 阴影的透明度
self.myView.layer.shadowOpacity = 1;
// 阴影的模糊程度
self.myView.layer.shadowRadius = 50;
// 设置边框宽度
self.myView.layer.borderWith = 10;
// 设置边框的颜色
self.myView.layer.borderColor = [UIColor purpleColor].CGColor;
//layer层动画
// CAPropertyAnimation 抽象类
// CABasicAnimation 基础动画, 更改大小, 旋转等
// CAKeyframeAnimation 主要有按轨迹移动, 位置, 比如执行一组动画时使用背景颜色
}
// 实现点击方法
- (void)actionButton:(UIButton *)button
{
[self xyAnimation];
[self sizeAnimation];
[self colorAnimation];
[self positionPoint];
[self douDongImage];
[self transform3D];
[self groupAnimation];
}
// 旋转
- (void)xyAnimation
{
// 新建一个基础动画
// 咱们要更改的是transform.rotation.x 形变属性下弧度的点x轴
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@“transform.rotation.x”];
// 设置属性变化到什么值
// toValue 需要一个对象类型即NSNumber 或NSValue
animation.toValue = [NSNumber numberWithFloat:M_PI * 2];
// 设置动画时间
animation.duration = 1;
// 设置动画重复
animation.repeatCount = 1;
// 把设置添加到layer上
//参数2:添加的动画的标识
[self.myView.layer addAnimation:animation forKey:@“transform.rotation.x”];
}

// 改变size的
- (void)sizeAnimation
{
// 更改大小的话, 需要更改bounds.size
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@“bounds.size”];
// 设置更改的值
// fromValue 初始值
animation.fromValue = [NSValue valueWithCGSize:CGSizeMake(10, 10)];
// 结束值
animation.toValue = [NSValue valueWithCGSize:CGSizeMake(100, 100)];
// 动画时间
animation.duration = 1;
// 添加到layer上
[self.myView.layer addAnimation:animation forKey:@“bounds.size”];
}

// 改变颜色
- (void)colorAnimation
{
// 执行一组动画
CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@“backgroundColor”];
// 创建绘制颜色
CGColorRef greed = [UIColor greenColor].CGColor;
CGColorRef red = [UIColor redColor].CGColor;
CGColorRef purp = [UIColor purpleColor].CGColor;
CGColorRef yell = [UIColor yellowColor].CGColor;
// 改变一组颜色
animation.values = @[(id)greed, (id)red, (id)purp, (id)yell];
// 设置一个时间
animation.duration = 5;
// 添加到layer上
[self.myView.layer addAnimation:animation forKey:@“backgroundColor”];
}

// 轨迹移动
- (void)positionPoint
{
CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@“position”];
// 构建一堆点
NSValue *point1 = [NSValue valueWithCGPoint:CGPointMake(200, 400)];
NSValue *point2 = [NSValue valueWithCGPoint:CGPointMake(20, 80)];
// 添加点进数组
animation.values = @[point1, point2];
animation.duration = 2;
[self.myView.layer addAnimation:animation forKey:@“position”];
}

// 抖动
- (void)douDongImage
{
CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@“position.x”];
CGFloat center = self.myView.layer.position.x;
CGFloat left = center - 10;
CGFloat right = center + 10;
NSNumber *l = [NSNumber numberWithFloat:left];
NSNumber *c = [NSNumber numberWithFloat:center];
NSNumber *r = [NSNumber numberWithFloat:right];
animation.values = @[l, c, r, l, c, r];
animation.duration = 1;
[self.myView.layer addAnimation:animation forKey:@“position.x”];
}

// 3D旋转

- (void)transform3D
{
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@“transform”];
// 结束值
animation.toValue = [NSValue valueWithCATransform3D:CATransform3DRotate(self.myView.layer.transform, M_PI, 100, 0, 0)];
animation.duration = 1;
[self.myView.layer addAnimation:animation forKey:@“transform”];

}
骑着猪狂飙
关注
专栏目录
iOS 视图（UIView）动画
weixin_46642112的博客
04-29 683
如果需要在视图（UIView）上进行一些简单动画，可以使用视图动画。视图动画底层也是使用Core Animation，只是动画的实现细节都封装起来了。UIKit类通常都有animated布尔型参数，它可以开启动画效果。 例： swift：func setOn(_ on:Bool,animated:Bool) objectiveC:-(void)setOn:(BOOL)on animated:(BO...
ios开发——视图动画
DC的博客
07-27 158
#import "ViewController.h" @interface ViewController () { //小球运动方向标志，1表示向下运行，-1表示向上运行 int flag; } @property(strong, nonatomic) UIImageView *ball; @end @implementation ViewController - (...
iOS动画技术——视图动画
run_in_road的博客
01-29 182
每个视图都关联到一个图层（CALayer）对象，视图主要用来处理事件，图层用来处理动画。视图上所有动画、绘制和可视效果都直接或间接的由图层处理。 动画块 通过一个实例介绍一下动画块的使用，以及动画处理的过程。 [UIView animateWithDuration:1.5 animations:^ { CGRect frame = self.ball.frame; frame.origin.y += 100 *self->flag; self->flag *= -
ios开发——视图动画(动画开始与结束设置)
DC的博客
07-27 1129
- (void)onClick:(id)sender {          //动画开始将按钮设置为不可见     self.button.alpha = 0.0;       [UIView animateWithDuration:1.5 animations:^{         CGRect frame = self.ball.frame;         frame.orig...
系统学习iOS动画之一：视图动画
weixin_33860737的博客
12-27 258
本文是我学习《iOS Animations by Tutorials》 笔记中的一篇。 文中详细代码都放在我的Github上 andyRon/LearniOSAnimations。 这个部分介绍UIKit动画API，这些API专门用于轻松制作视图动画(View Animations)，同时避免核心动画(Core Animation)(见系统学习iOS动画之三：图层动画)的复杂性。 UIKit动...
实例讲解iOS应用UI开发之基础动画的创建
01-20
在iOS应用UI开发中，创建基础动画是提升用户体验的关键元素之一。本文将通过实例深入讲解如何使用Core Animation框架中的CAPropertyAnimation子类，特别是CABasicAnimation，来实现平移动画。 首先，...
IOS 开发之PickerView自定义视图的实例详解
08-29
在iOS开发中，PickerView是一种常用的UI组件，用于展示用户可以选择的多个选项。在某些情况下，我们可能需要自定义PickerView的视图，以便更好地适应应用程序的需求。本篇实例将详细讲解如何在iOS中实现PickerView...
详解iOS开发中的转场动画和组动画以及UIView封装动画
01-05
iOS比Mac OS X的转场动画效果少一点 UINavigationController就是通过CATransition实现了将控制器的视图推入屏幕的动画效果 属性解析: type：动画过渡类型 subtype：动画过渡方向 startProgress：动画起点(在整体动画...
IOS视图控制器的生命周期实例详解
08-30
iOS中的视图控制器（UIViewController）是构建用户界面的核心组件，它的生命周期是指从创建到销毁过程中一系列方法的调用顺序。了解这些生命周期方法对于正确管理视图控制器的状态和更新UI至关重要。下面我们将详细...
iOS常用视图切换动画
11-27
iOS常用视图切换动画 博客文章：http://blog.csdn.net/z251257144/article/details/8230025
iOS动画系列之一--视图与图层
u013915422的博客
05-28 685
1> 视图–(UIView) –>> 在iOS当中，所有的视图都从一个叫做UIVIew的基类派生而来，UIView可以处理触摸事件，可以支持基于Core Graphics绘图，可以做仿射变换（例如旋转或者缩放），或者简单的类似于滑动或者渐变的动画。 2> CALayer类在概念上和UIView类似，同样也是一些被层级关系树管理的矩形块，同样也可以包含一些内容（像图片，文本或者背景色），管理子图层
IOS视图切换实现简单动画
12-05 1131
1.两个简单视图间的切换算法。 if (self.pRedViewController.view.superview == nil) { if (self.pRedViewController.view == nil) { LinRedViewController * red = [[LinRedViewController all
ios开发——视图动画（过渡动画）
DC的博客
07-27 1782
- (IBAction)doUIViewAnimation:(id)sender { UIButton *button = (UIButton *)sender; NSLog(@"tag = %li", (long)button.tag); switch (button.tag) { case 1: [UIVi...
iOS7教程系列：自定义导航转场动画以及更多
^遗失
12-25 1085
转自cocoachina:http://www.cocoachina.com/gamedev/misc/2013/1224/7597.html 原文：iOS 7 Tutorial Series: Custom Navigation Transitions & More 感谢翻译小组成员dingdaojun热心翻译。本篇文章是我们每周推荐优秀国外的技术类文章的
iOS弹出视图动画
ios_xumin的专栏
10-12 817
本次要做的例子是iOS的弹出视图动画，不喜欢废话，直接上图： popAnimation.gif 上图就是要实现的效果，不喜欢看文章的人，点击这里直达代码。 该Demo中涉及两个类： PopOutView：弹出视图类 MJPopTool：弹出视图工具类 1、PopOutView .h文件代码如下： #import <UIKit/UIKit.h> @class PopOutView; typedef void(^PopOutViewDismissBlock)(Pop..
基于java的校园美食交流系统设计与实现.docx
最新发布
09-19
基于java的校园美食交流系统设计与实现.docx
#_ssm_126_mysql_实习支教中小学学校信息管理系统_.zip
09-19
均包含代码，文章，部分项目包含ppt
iOS应用UI基础动画实战：CAPropertyAnimation详解
本篇文章主要讲解了iOS应用UI开发中的基础动画创建，特别是围绕着CAPropertyAnimation的子类，如CABasicAnimation，来实现视觉效果。CABasicAnimation是一种关键路径动画，它通过设置fromValue和toValue属性来定义...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值