iOS CALayer综合学习

2018-08-12  本文已影响0人  Zonpai

实现图片随者手势拖动进行翻转

效果图:

图片翻转.gif
- (void)viewDidLoad {
    [super viewDidLoad];
    UIPanGestureRecognizer *panGs = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(PanAction:)];
    [self.view addGestureRecognizer:panGs];
    self.panGs = panGs;
    [self setImage];
}
//设置图片
- (void)setImage {
    //设置顶图
    //contentsRect设置图片的内容区域
    self.topImage.layer.contentsRect = CGRectMake(0, 0, 1, 0.5);
    self.topImage.layer.anchorPoint = CGPointMake(0.5, 1);
    //设置底图
    self.bottomImage.layer.contentsRect = CGRectMake(0, 0.5, 1, 0.5);
    self.bottomImage.layer.anchorPoint = CGPointMake(0.5, 0);
    //设置底部image的渐变层
    CAGradientLayer *gradient = [CAGradientLayer layer];
    gradient.frame = self.bottomImage.bounds;
    gradient.colors = @[(id)[UIColor clearColor].CGColor,(id)[UIColor blackColor].CGColor];
#pragma  mark  - 渐变层
    //设置渐变层渐变的区间
    //其location属性可以设置开始渐变的区域
    //下面为设置渐变qujian
    //layer中有很多属性其取值范围在0~1之间
    gradient.startPoint = CGPointMake(0, 0);
    gradient.endPoint = CGPointMake(0, 1);
    //opacity--->不透明度
    gradient.opacity = 0;
    self.gradient = gradient;
    [self.bottomImage.layer addSublayer:gradient];
}
- (void)PanAction:(UIPanGestureRecognizer *)sender {
    CGPoint curPoint = [sender translationInView:self.touchView];
    CGFloat angle = (curPoint.y / 200) *M_PI;
    CATransform3D transform = CATransform3DIdentity;
    //设置立体效果,注意要加上“.0“;
    transform.m34 = -1/300.0;
    self.topImage.layer.transform = CATransform3DRotate(transform, -angle, 1, 0, 0);
    self.gradient.opacity = curPoint.y/200;
    if (sender.state == UIGestureRecognizerStateEnded) {
        [UIView animateWithDuration:1 delay:0 usingSpringWithDamping:0.5 initialSpringVelocity:1 options:UIViewAnimationOptionCurveEaseOut animations:^{
            //重置transForm
            self.topImage.layer.transform = CATransform3DIdentity;
            self.gradient.opacity = 0;
        } completion:nil];
    }
}

CAlayer复制层CAReplicatorLayer

实现效果也:音量振动条

效果图: 音量震动条.gif
- (void)setLayer {
    //设置复制层
    CAReplicatorLayer *replicator = [CAReplicatorLayer layer];
    replicator.frame = self.backView.bounds;
    replicator.backgroundColor = [UIColor yellowColor].CGColor;
    replicator.instanceCount = 8;
    replicator.instanceTransform = CATransform3DMakeTranslation(30, 0, 0);
    replicator.instanceDelay = 1;
    //设置子layer
    CALayer *layer = [CALayer layer];
    CGFloat weight = 20;
    CGFloat height = 100;
    CGFloat y = self.backView.bounds.size.height - height;
    CGFloat x = 20;
    layer.anchorPoint = CGPointMake(0.5, 1);
    layer.frame = CGRectMake(x, y, weight, height);
    layer.backgroundColor = [UIColor redColor].CGColor;
    [replicator addSublayer:layer];
    [self.backView.layer addSublayer:replicator];
    //设置动画
    CABasicAnimation *baseAnim = [CABasicAnimation animation];
    baseAnim.keyPath = @"transform.scale.y";
    baseAnim.fromValue = @0;
    baseAnim.toValue = @1.5;
    baseAnim.repeatCount = MAXFLOAT;
    baseAnim.duration = 1;
    baseAnim.autoreverses = YES;
    [layer addAnimation:baseAnim forKey:nil];
}
上一篇下一篇

猜你喜欢

热点阅读