iOS编程------动画
来源:互联网 发布:淘宝潮男衣服店铺推荐 编辑:程序博客网 时间:2024/04/23 18:22
//// ViewController.h// UI23_Animation//// Created by l on 15/10/7.// Copyright (c) 2015年 lon. All rights reserved.//#import <UIKit/UIKit.h>@interface ViewController : UIViewController@property (strong, nonatomic) IBOutlet UIImageView *imageView;@property (strong, nonatomic) IBOutlet UITextField *textField;@end//// ViewController.m// UI23_Animation//// Created by l on 15/10/7.// Copyright (c) 2015年 lon. All rights reserved.//#import "ViewController.h"#import "SecondViewController.h"@interface ViewController ()@end@implementation ViewController- (void)viewDidLoad { [super viewDidLoad];#pragma mark ---------------- 动画概述 ---------------------- /* UI23 动画 --> 属性动画 CALayer 动画 --> UIView 动画 --> 过渡动画 --> 仿射动画 CALayer 层 核心绘制层 CAAnimation 核心动画 */ //一. UIView 动画 //1.属性动画 //UIView 做动画有两种方式, 动画块方式和block方式, 通常我们使用block方式. //常用的属性有 背景色, alpha, center, frame, bounds等. //二. CALayer 核心 绘画层 //UIView 和 CALayer 的关系 //UIView 并不进行渲染和绘画,真正负责渲染的是CALayer //UIView可以看做是CALayer的代理,负责展示内容以及用户进行交互. //UIView创建的时候带一个CALayer,UIView与绘制和渲染相关的属性其实是CALayer的属性,比如背景颜色. //CALayer有很多的属性,UIView可以直接使用只是其中一部分,比如CALayer的圆角等. //1.创建一个CALayer对象 CALayer *layer = [[CALayer alloc] init]; //2.设置属性 layer.frame = CGRectMake(200, 50, 100, 100); //圆角 layer.cornerRadius = 50; // 0.5 宽 //边框宽度 layer.borderWidth = 2; //边框颜色 layer.borderColor = [UIColor redColor].CGColor; //阴影颜色 layer.shadowColor = [UIColor blueColor].CGColor; //阴影透明度,默认为 0 layer.shadowOpacity = 0.5; //阴影偏移量 layer.shadowOffset = CGSizeMake(10, 10); //背景颜色 layer.backgroundColor = [UIColor yellowColor].CGColor; //锚点 //x , y 0.0 ~ 1.0 之间数 //默认为 0.5 , 0.5 中心点 layer.anchorPoint = CGPointMake(0, 0); layer.position = CGPointMake(200 + 50, 50 + 50); // anchorPoint 默认在视图的中心点, // layer 的postion 就是 anchorPoint 在父坐标系中的位置为 x: frame.x + 0.5 * width // y: frame.y + 0.5 * height // 我们通常设置 如果想要设置position 和 frame 相等。则只要设置 锚点为左上角,则 postion 和 frame 就相等了,但是如果之前设置了frame 会发现 更改锚点后,实际位置会发生变化,这是因为 // 本来 // position.x = frame.x + 0.5 * width // 250 200 50 // position.y = frame.y + 0.5 *height // 100 50 50 // frame 为 200 50 position 为 250 100 // 设置锚点为0 。0 后,重新绘制了视图 position 和 frame相等 // 因此frame 变为 200 50 ----> 250 100 //3.添加到父 layer上 [self.view.layer addSublayer:layer]; //需求:设置一张圆角图片,QQ个人头像 //更改imageView的layer //圆角 _imageView.layer.cornerRadius = 50; //边框 _imageView.layer.borderWidth = 2; _imageView.layer.borderColor = [UIColor yellowColor].CGColor; //边界马赛克, 边界遮罩 _imageView.layer.masksToBounds = YES; //显示到边界 // Do any additional setup after loading the view, typically from a nib.}#pragma mark-------- 1.UIView属性动画------------- (IBAction)propertyAnimation:(id)sender { //iOS3.0之前UIView的动画方法都是类方法,需要我们把动画写在一个动画块里面. /* [UIView beginAnimation:] //设置动画属性 [UIView commitAnimations] */ //1.开始动画 [UIView beginAnimations:@"动画名称" context:@"传递给代理的参数"]; //2.设置动画 //动画持续时间,重复几次,是否反转等等. [UIView setAnimationDuration:2]; //动画时间// [UIView setAnimationRepeatCount:2];//重复次数// [UIView setAnimationRepeatAutoreverses:YES];//反转 [UIView setAnimationDelegate:self];//默认就是self //代理触发的两个方法: //动画开始之前触发 [UIView setAnimationWillStartSelector:@selector(animationWillStart:context:)]; //动画结束之后触发sel方法 [UIView setAnimationDidStopSelector:@selector(animationDidStop:finished:context:)]; //3.设置动画 _imageView.frame = CGRectMake(275, 50, 100, 100); //4.提交动画 [UIView commitAnimations];}- (void)animationWillStart:(NSString *)animationID context:(void *)context { NSLog(@"动画开始"); _imageView.backgroundColor = [UIColor yellowColor];}- (void)animationDidStop:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context { NSLog(@"动画结束"); //从右边再移动左边 //1.设置开始 [UIView beginAnimations:nil context:nil]; //2.设置动画 [UIView setAnimationDuration:2]; [UIView setAnimationDelegate:self]; [UIView setAnimationDidStopSelector:@selector(propertyAnimation:)]; //3.更改属性 _imageView.frame = CGRectMake(0, 50, 100, 100); //4.提交动画 [UIView commitAnimations];}// 重复动画- (void)repeatAnimation{ [self propertyAnimation:nil];}#pragma mark---------- 1.1 block 动画 --------------- (IBAction)blockAnimation:(id)sender { //iOS4.0 使用block封装了 动画块相关的方法,方便我们的使用. //block 动画方法也是类方法// [UIView animateWithDuration:2 animations:^{// _imageView.frame = CGRectMake(275, 50, 100, 100);// }]; [UIView animateWithDuration:2 animations:^{ _imageView.frame = CGRectMake(275, 50, 100, 100); } completion:^(BOOL finished) { [UIView animateWithDuration:2 animations:^{ _imageView.frame = CGRectMake(0, 50, 100, 100); } completion:^(BOOL finished) { [self blockAnimation:nil]; }]; }];}#pragma mark ----------- 1.2 过渡动画 ----------/*- (IBAction)translateAnimation:(id)sender { //1.创建secondVC SecondViewController *secondVC = [self.storyboard instantiateViewControllerWithIdentifier:@"second"]; secondVC.view.backgroundColor = [UIColor yellowColor]; //2.父视图 UIView *superView = self.view.superview; //3.过渡动画 //过渡动画也是类方法 //1.自己做动画 //需求, self.view 从父视图上面移除, secondVC.view添加到父视图上 //因此需要做动画的视图为父视图self.view.superView //参数1 容器视图, 需要做动画的视图 //当block是另一个页面的属性时,页面间传值的时候需要防止重复引用. __weak typeof(self) WeakSelf = self;// [UIView transitionWithView:self.view.superview duration:0.5 options:UIViewAnimationOptionTransitionCurlUp animations:^{// //动画操作 移除当前视图 添加second.view// [self.view removeFromSuperview];// // [superView addSubview:secondVC.view];// // } completion:nil]; //方法二. 两个页面间过渡 [UIView transitionFromView:self.view toView:secondVC.view duration:1 options:(UIViewAnimationOptionTransitionCurlUp) completion:nil]; //添加子视图 [self addChildViewController:secondVC];}*/#pragma mark---------- 2. 仿射变换 ------------------static int k = 10;- (IBAction)rotationAnimation:(id)sender { //仿射变换通常做三种样式的变换 //1.旋转 2.平移 3.缩放 //变换时有基于初始状态和基于上一次变换状态的两种 [UIView animateWithDuration:0.01 animations:^{ //旋转角度单位 -> 弧度 π -> 180角度对应的弧度 //弧度π 角度° π = 180° //1°对应的弧度 = π / 180°// _imageView.transform = CGAffineTransformMakeRotation(M_PI); //(2)以上次变化为基准 CGAffineTransform angle = CGAffineTransformMakeRotation(k * M_PI / 180); _imageView.transform = angle; //(1)以原始状态为基准// _imageView.transform = CGAffineTransformRotate(_imageView.transform, M_PI / 180); //基于上一次状态. } completion:^(BOOL finished) { k += 10; //每次增加10 [self rotationAnimation:nil]; }];}#pragma mark------------- 3.1 核心 基本动画 --------- (IBAction)basicAnimation:(id)sender { //给某一个属性做动画 //"opsition" //1.创建基本动画对象 CABasicAnimation *basic = [CABasicAnimation animationWithKeyPath:@"position"]; //2.设置起始Value basic.fromValue = [NSValue valueWithCGPoint:_imageView.layer.position]; //3.结束 basic.toValue = [NSValue valueWithCGPoint:(CGPointMake(325, 100))]; //4.设置动画 basic.duration = 2; //2秒 //5.给layer层添加核心动画 指定做动画的属性 [_imageView.layer addAnimation:basic forKey:@"position"]; //动画结束后,更改position _imageView.layer.position = CGPointMake(325, 100);}#pragma mark--------- 3.2 关键帧动画 ------------ (IBAction)keyframe:(id)sender { _textField.backgroundColor = [UIColor redColor]; //实现晃动效果 //1.创建关键帧动画对象,指定属性 CAKeyframeAnimation *keyframe = [CAKeyframeAnimation animationWithKeyPath:@"position.x"]; //2.设置position.x的变化范围 CGFloat centerX = _textField.layer.position.x; //移动到左边的位置 CGFloat left = centerX - 10; //右边 CGFloat right = centerX + 10; //3.创建运动轨迹 NSNumber *l = [NSNumber numberWithFloat:left]; NSNumber *c = [NSNumber numberWithFloat:centerX]; NSNumber *r = [NSNumber numberWithFloat:right]; //4.添加到帧动画的value数组中 keyframe.values = @[l, c, r, l, c, r, l, c, r, l, c, r, l, c, r]; //5.设置动画持续时间 keyframe.duration = 0.5; //6.添加动画 [_textField.layer addAnimation:keyframe forKey:@"position.x"];}#pragma mark-------- 3.3 组动画 ------------------ (IBAction)groupAnimation:(id)sender { //1.创建一个动画组// CAAnimationGroup *group = [[CAAnimationGroup alloc] init]; CAAnimationGroup *group = [CAAnimationGroup animation]; //2.创建基本动画 移动 旋转 //创建移动动画对象 CABasicAnimation *move = [CABasicAnimation animationWithKeyPath:@"position"]; CGFloat centerX = _imageView.layer.position.x; CGFloat endX = 325; //起始值value move.fromValue = [NSValue valueWithCGPoint:(CGPointMake(centerX, 100))]; //最终value move.toValue = [NSValue valueWithCGPoint:(CGPointMake(endX, 100))]; //设置move动画时间 move.duration = 2; //创建旋转动画对象 CABasicAnimation *rotation = [CABasicAnimation animationWithKeyPath:@"transform"]; //fromValue rotation.fromValue = [NSValue valueWithCATransform3D:_imageView.layer.transform]; //toValue rotation.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI_2, 1, 0, 1)]; //动画时间 rotation.duration = 2; //3.把多个动画对象添加到动画数组里面 group.animations = @[move, rotation]; group.duration = 2; //4.给layer添加组动画 [_imageView.layer addAnimation:group forKey:@"group"];}#pragma mark---------- 3.4 核心过渡动画 ----------- (IBAction)translateAnimation:(id)sender { //1.创建过渡动画对象 CATransition *transition = [CATransition animation]; //2.设置过渡动画类型和动画方式 transition.type = @"cube"; //立方体 //动画执行的方式 transition.subtype = kCATransitionFromRight; //动画持续时间 transition.duration = 0.5; //3.添加动画 [self.view.superview.layer addAnimation:transition forKey:@"立方体效果"]; //4.移除当前视图 添加secondVC 视图 SecondViewController *secondVC = [self.storyboard instantiateViewControllerWithIdentifier:@"second"]; secondVC.view.backgroundColor = [UIColor whiteColor]; UIView *superView = self.view.superview; [self.view removeFromSuperview]; [superView addSubview:secondVC.view]; //添加子视图控制器 [self addChildViewController:secondVC];}- (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated.}@end///////////////////////////////////////////////////////////////////// SecondViewController.h// UI23_Animation//// Created by l on 15/10/7.// Copyright (c) 2015年 lon. All rights reserved.//#import <UIKit/UIKit.h>@interface SecondViewController : UIViewController@end//// SecondViewController.m// UI23_Animation//// Created by l on 15/10/7.// Copyright (c) 2015年 lon. All rights reserved.//#import "SecondViewController.h"@interface SecondViewController ()@end@implementation SecondViewController- (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view.}- (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated.}#pragma mark----------- 返回上一个页面 ----------//过渡动画- (IBAction)backUp:(id)sender { [UIView transitionFromView:self.view toView:self.parentViewController.view duration:1 options:(UIViewAnimationOptionTransitionCurlDown) completion:nil];}/*#pragma mark - Navigation// In a storyboard-based application, you will often want to do a little preparation before navigation- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender { // Get the new view controller using [segue destinationViewController]. // Pass the selected object to the new view controller.}*/@end![animation](http://img.blog.csdn.net/20151007191900134)
0 0
- iOS编程------动画
- iOS动画编程-1
- iOS动画编程-2
- [IOS]动画编程总结
- iOS核心动画编程
- iOS动画编程-CAAnimation
- iOS动画编程-View动画[ 1 ] 基础View动画
- iOS动画编程-View动画[ 2 ] Spring动画
- iOS核心系统编程最佳实践:动画
- iOS边城之动画编程(Core Animation)
- iOS-核心动画高级编程/1-图层树
- iOS-核心动画高级编程/4-视觉效果
- iOS-核心动画高级编程/5-变换
- iOS-核心动画高级编程/10-缓冲
- iOS边城之动画编程(Core Animation)
- iOS动画编程1-仿射变换
- iOS动画编程1-仿射变换
- iOS-核心动画高级编程/7-隐式动画
- MYISAM表批量压缩
- Activity之间返回结果
- php date 处理
- Log4j1X迁移至Log4j2(基于SLF4j)
- 关系演算
- iOS编程------动画
- 软件测试行业浅析
- 装饰模式
- 1023. 组个最小数 (20)
- POJ 2533 Longest Ordered Subsequence (LIS)
- 程序题
- @ModelAttribute运用详解
- 域关系演算
- HP实训软件测试第一阶段测试基础知识总结