ios学习之核心动画-图片折叠
来源:互联网 发布:截图台词拼接软件 编辑:程序博客网 时间:2024/04/29 20:35
首先需要准备素材,一张图片,如下:
然后就是打开xcode创建项目,连线:
然后,写代码:
//// ViewController.m// 图片折叠//// Created by apple on 16/7/28.// Copyright © 2016年 XinHuoYuan. All rights reserved.//#import "ViewController.h"@interface ViewController ()@property (weak, nonatomic) IBOutlet UIImageView *topView;@property (weak, nonatomic) IBOutlet UIImageView *buttomView;@property (weak, nonatomic) IBOutlet UIView *outView;@property (weak, nonatomic) CAGradientLayer *gradient;@end@implementation ViewController- (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view, typically from a nib.// self.view.translatesAutoresizingMaskIntoConstraints = NO; //让上部分图片只显示上半部分 self.topView.layer.contentsRect = CGRectMake(0, 0, 1, 0.5); //让下半部分图片只显示下半部分 self.buttomView.layer.contentsRect = CGRectMake(0, 0.5, 1, 0.5); self.topView.layer.anchorPoint = CGPointMake(0.5, 1); self.buttomView.layer.anchorPoint = CGPointMake(0.5, 0); //添加手势 UIPanGestureRecognizer *pan = [[UIPanGestureRecognizer alloc]initWithTarget:self action:@selector(pan:)]; [self.outView addGestureRecognizer:pan]; //渐变层 CAGradientLayer *gradient = [CAGradientLayer layer]; gradient.frame = self.buttomView.bounds; gradient.colors = @[(id)[UIColor clearColor].CGColor,(id)[UIColor blackColor].CGColor]; //设置不透明度 gradient.opacity = 0; self.gradient = gradient; [self.buttomView.layer addSublayer:gradient];}- (void)pan:(UIPanGestureRecognizer *)pan{ CGPoint transP = [pan translationInView:self.outView]; CATransform3D transform = CATransform3DIdentity; //立体效果,近大远小 transform.m34 = -1/550.0; //设置不透明度 CGFloat opcity = transP.y * 1/ 256; self.gradient.opacity = opcity; CGFloat angle= transP.y * M_PI / 256.0; //让上半部分图片做旋转 self.topView.layer.transform = CATransform3DRotate(transform, -angle, 1, 0, 0); if (pan.state == UIGestureRecognizerStateEnded) { self.gradient.opacity = 0; [UIView animateWithDuration:0.5 delay:0 usingSpringWithDamping:0.25 initialSpringVelocity:0 options:UIViewAnimationOptionCurveLinear animations:^{ //让图片反弹回去 self.topView.layer.transform = CATransform3DIdentity; } completion:^(BOOL finished) { }]; }}- (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated.}@end
效果图:
0 0
- ios学习之核心动画-图片折叠
- 核心动画之图片折叠和倒影
- IOS学习之核心动画-复制层
- IOS学习之核心动画-倒影
- IOS学习之核心动画-粒子效果
- 十二 iOS之 折叠图片
- iOS核心动画学习
- iOS学习笔记-081.图片折叠
- iOS学习笔记-核心动画
- iOS学习总结----核心动画
- IOS学习之—— 图层与核心动画
- IOS学习之核心动画-音乐震动条
- iOS 核心动画之CABasicAnimation
- iOS 核心动画之CAKeyFrameAnimation
- iOS 核心动画之CATransition
- iOS 核心动画之CAAnimationGroup
- iOS核心动画之CABasicAnimation
- iOS开发之核心动画
- 数据结构的各种树
- 【cpp面向对象编程学习笔记】Class经典分类(2)with pointer member(s)
- hdu 2389 Rain on your Parade(二分图最大匹配,Hopcroft-Karp)
- eclipse重构
- 时间同步和日志同步~
- ios学习之核心动画-图片折叠
- MyEclipse的常用快捷键
- 杭电2037解题报告
- 利用MyEclipse自动创建PO类、hbm文件(映射文件)、DAO
- Codevs 1171 潜伏者 2009年NOIP全国联赛提高组
- 十三、职责链模式Chain of Responsibility(行为型)
- LeetCode进阶之路(Implement strStr())
- 栈帧
- SD卡相关辅助类 SDCardUtils