首先需要准备素材,一张图片,如下:
然后就是打开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
效果图: