图片折叠效果:Layer的contentsRect属性和渐变层
本是做手指点击,这么一个图片动作,找到文章http://www.cocoachina.com/ios/20150722/12622.html
主要用得技术点, 是Layer的一个属性contentsRect,利用它可以控制图层内容的展示,然后还有利用渐变层(CAGradientLayer)做阴影效果。
然后自己写了一遍代码:
#import "ThreeViewController.h" @interface ThreeViewController () @property(nonatomic,weak) UIView *dogView; @property(nonatomic,weak) UIView *topView; @property(nonatomic,weak) UIView *bottomView; @property(nonatomic,strong) UIImageView *dogImageView; @end @implementation ThreeViewController - (void)viewDidLoad { [super viewDidLoad]; float rate=0.8; //0~1 之间 float dogW=200; float dogH=200; float topView_X=0; float bottomView_X=topView_X; float topView_W=dogW; float bottomView_W=topView_W; float topView_H=dogH*rate; float topView_Y=topView_H*0.5; float bottomView_H=dogH-topView_H; float bottomView_Y=topView_H-bottomView_H*0.5; CGRect dogRect=CGRectMake(40, 100, dogW, dogH); UIView *dogView=[[UIView alloc]initWithFrame:dogRect]; _dogView=dogView; UIView *topView=[[UIView alloc]initWithFrame:CGRectMake(topView_X, topView_Y, topView_W, topView_H)]; _topView=topView; UIView *bottomView=[[UIView alloc]initWithFrame:CGRectMake(bottomView_X, bottomView_Y, bottomView_W, bottomView_H)]; _bottomView=bottomView; UIImage *dogImage=[UIImage imageNamed:@"mydog.jpg"]; _topView.layer.contents=(__bridge id)(dogImage.CGImage); _topView.layer.contentsRect=CGRectMake(0.0, 0, 1.0, rate); _bottomView.layer.contents=(__bridge id)(dogImage.CGImage); _bottomView.layer.contentsRect=CGRectMake(0.0, rate, 1.0, (1-rate)); [self.view addSubview:_dogView]; [_dogView addSubview:_topView]; [_dogView addSubview:_bottomView]; _topView.layer.anchorPoint = CGPointMake(0.5, 1); _bottomView.layer.anchorPoint = CGPointMake(0.5, 0); // UITapGestureRecognizer *Tap =[[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(imagePressed:)]; // _upView.userInteractionEnabled=YES; // _dogView.userInteractionEnabled=YES; // [_upView addGestureRecognizer:Tap]; // [_downView addGestureRecognizer:Tap]; // [_dogView addGestureRecognizer:Tap]; //旋转 CABasicAnimation *anim=[CABasicAnimation animation]; anim.keyPath = @"transform.rotation.z"; anim.toValue = @(-M_PI_4); anim.removedOnCompletion=NO; anim.fillMode=kCAFillModeForwards; [_dogView.layer addAnimation:anim forKey:nil]; } -(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { CATransform3D transform3D = CATransform3DIdentity; // 设置立体效果 transform3D.m34 = -1 / 1000.0; // 计算折叠角度 CGFloat angle =6/ 25.0 * M_PI; _topView.layer.transform = CATransform3DRotate(transform3D, angle, 1, 0, 0); } -(void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event { [UIView animateWithDuration:0.4f animations:^{ _topView.layer.transform = CATransform3DIdentity; }]; } //-(void)imagePressed:(UITapGestureRecognizer *)sender //{ // CATransform3D transform3D = CATransform3DIdentity; // // 设置立体效果 // transform3D.m34 = -1 / 1000.0; // // 计算折叠角度 // CGFloat angle =6/ 25.0 * M_PI; // _upView.layer.transform = CATransform3DRotate(transform3D, angle, 1, 0, 0); // // if (sender.state == UIGestureRecognizerStateEnded) { // 手指抬起 // [UIView animateWithDuration:0.4f animations:^{ // _upView.layer.transform = CATransform3DIdentity; // }]; // } // //} - (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated. } @end
浙公网安备 33010602011771号