CATransformLayer

好尴尬,按照套路,我点进了CATransformLayer.h,但是空空如也,什么也没有。那么CATransfromLayer的作用是啥呢?只能通过撸代码来体会了。

//先上效果图吧


对比效果吧

部分代码

绘制立方体
    //面1
    transfrom = CATransform3DMakeTranslation(0, 0, sub_width/2);
    [cube addSublayer:[self layerWithTransform:transfrom]];
    
    //面2
    transfrom = CATransform3DMakeTranslation(0, 0, -sub_width/2);
    [cube addSublayer:[self layerWithTransform:transfrom]];
    
    //面3
    transfrom = CATransform3DMakeTranslation(sub_width/2, 0, 0);
    transfrom = CATransform3DRotate(transfrom, M_PI_2, 0, 1, 0);
    [cube addSublayer:[self layerWithTransform:transfrom]];
    
    //面4
    transfrom = CATransform3DMakeTranslation(-sub_width/2, 0, 0);
    transfrom = CATransform3DRotate(transfrom, -M_PI_2, 0, 1, 0);
    [cube addSublayer:[self layerWithTransform:transfrom]];
    
    
    //面5
    transfrom = CATransform3DMakeTranslation(0, sub_width/2, 0);
    transfrom = CATransform3DRotate(transfrom, M_PI_2, 1, 0, 0);
    [cube addSublayer:[self layerWithTransform:transfrom]];

    //面6
    transfrom = CATransform3DMakeTranslation(0, -sub_width/2, 0);
    transfrom = CATransform3DRotate(transfrom, -M_PI_2, 1, 0, 0);
    [cube addSublayer:[self layerWithTransform:transfrom]];
动画
    static float degree = 0.f;
    
    CGFloat duration = 1.f;
    CGFloat singleDuration = 1 / (duration * 60.0);
    CGFloat singleDegree = 45/(duration * 60.0);
    
    
    CATransform3D fromValue = CATransform3DIdentity;
    fromValue.m34 = -1/500;
    fromValue = CATransform3DRotate(fromValue, DEGREE(degree), 0, 1, 0);
    
    CATransform3D toValue = CATransform3DIdentity;
    toValue.m34 = -1/500;
    toValue = CATransform3DRotate(toValue, DEGREE(degree += singleDegree), 0, 1, 0);
    
    //使用transform无法实现旋转2*M_PI,此时可以使用虚拟属性@"transform.rotation.y",可以使用相对值旋转byValue
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform"];
    animation.duration = singleDuration;
    animation.fromValue = [NSValue valueWithCATransform3D:fromValue];
    animation.toValue = [NSValue valueWithCATransform3D:toValue];
    animation.repeatCount = HUGE_VALL;
    animation.removedOnCompletion = NO;
    animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
    [layer addAnimation:animation forKey:@"transform"];

结论:CATransformLayer可以为他的子图层,统一提供景深效果。(如有错误,请指正。如需源码,请点赞留言)

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • CATransformLayer不同于普通的CALayer,因为它不能显示她自己的内容,只有当存在了一个能作用域子...
    HeartPower阅读 557评论 0 3
  • 学习文章 详解CATransformLayer 效果 利用M34做景深 利用CATransformLayer做3D...
    刘大帅阅读 2,603评论 2 8
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,118评论 25 708
  • 在iOS中随处都可以看到绚丽的动画效果,实现这些动画的过程并不复杂,今天将带大家一窥iOS动画全貌。在这里你可以看...
    F麦子阅读 5,141评论 5 13
  • 感谢天杞园特膳,让我甩开肉肉、走出自卑! 大家好,我是娜娜。发这篇文章是想跟大家分享一下我的减肥经历。 其实我也不...
    落辰阁阅读 214评论 0 0