CAReplicatorLayer
发布日期:2022-03-18 08:27:36 浏览次数:58 分类:技术文章

本文共 2937 字,大约阅读时间需要 9 分钟。

CAReplicatorLayer简介

转载自:

CAReplicatorLayer的目的是为了高效生成许多相似的图层。它会绘制一个或多个图层的子图层,并在每个复制体上应用不同的变换。看上去演示能够更加解释这些,我们来写个例子吧。

重复图层(Repeating Layers)

我们在屏幕的中间创建了一个小白色方块图层,然后用CAReplicatorLayer生成十个图层组成一个圆圈。instanceCount属性指定了图层需要重复多少次。instanceTransform指定了一个CATransform3D3D变换(这种情况下,下一图层的位移和旋转将会移动到圆圈的下一个点)。

变换是逐步增加的,每个实例都是相对于前一实例布局。这就是为什么这些复制体最终不会出现在同意位置上。

CAReplicatorLayer重复图层。

@interface ViewController ()@property (nonatomic, weak) IBOutlet UIView *containerView;@end@implementation ViewController- (void)viewDidLoad{    [super viewDidLoad];    //create a replicator layer and add it to our view    CAReplicatorLayer *replicator = [CAReplicatorLayer layer];    replicator.frame = self.containerView.bounds;    [self.containerView.layer addSublayer:replicator];    //configure the replicator    replicator.instanceCount = 10;    //apply a transform for each instance    CATransform3D transform = CATransform3DIdentity;    transform = CATransform3DTranslate(transform, 0, 200, 0);    transform = CATransform3DRotate(transform, M_PI / 5.0, 0, 0, 1);    transform = CATransform3DTranslate(transform, 0, -200, 0);    replicator.instanceTransform = transform;    //apply a color shift for each instance    replicator.instanceBlueOffset = -0.1;    replicator.instanceGreenOffset = -0.1;    //create a sublayer and place it inside the replicator    CALayer *layer = [CALayer layer];    layer.frame = CGRectMake(100.0f, 100.0f, 100.0f, 100.0f);    layer.backgroundColor = [UIColor whiteColor].CGColor;    [replicator addSublayer:layer];}@end

这里写图片描述

反射

使用CAReplicatorLayer并应用一个负比例变换于一个复制图层,你就可以创建指定视图(或整个视图层次)内容的镜像图片,这样就创建了一个实时的『反射』效果。让我们来尝试实现这个创意:指定一个继承于UIViewReflectionView,它会自动产生内容的反射效果。实现这个效果的代码很简单,实际上用ReflectionView实现这个效果会更简单,我们只需要把ReflectionView的实例放置于Interface Builder,它就会实时生成子视图的反射,而不需要别的代码.

CAReplicatorLayer自动绘制反射

#import "ReflectionView.h"#import 
@implementation ReflectionView+ (Class)layerClass{ return [CAReplicatorLayer class];}- (void)setUp{ //configure replicator CAReplicatorLayer *layer = (CAReplicatorLayer *)self.layer; layer.instanceCount = 2; //move reflection instance below original and flip vertically CATransform3D transform = CATransform3DIdentity; CGFloat verticalOffset = self.bounds.size.height + 2; transform = CATransform3DTranslate(transform, 0, verticalOffset, 0); transform = CATransform3DScale(transform, 1, -1, 0); layer.instanceTransform = transform; //reduce alpha of reflection layer layer.instanceAlphaOffset = -0.6;}- (id)initWithFrame:(CGRect)frame{ //this is called when view is created in code if ((self = [super initWithFrame:frame])) { [self setUp]; } return self;}- (void)awakeFromNib{ //this is called when view is created from a nib [self setUp];}@end

这里写图片描述

在Interface Builder中使用ReflectionView

这里写图片描述

ReflectionView自动实时产生反射效果。

开源代码ReflectionView完成了一个自适应的渐变淡出效果(用CAGradientLayer和图层蒙板实现),代码见 。

CAReplicatorLayer的应用

CAReplicatorLayer的应用请参考:

  • 动画效果如下
    这里写图片描述
    这里写图片描述
    这里写图片描述

  • 动画效果如下:
    这里写图片描述
    这里写图片描述

转载地址:https://windzen.blog.csdn.net/article/details/49421011 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!

上一篇:CATransformLayer
下一篇:提高Interface Builder高效工作的8个技巧

发表评论

最新留言

不错!
[***.144.177.141]2024年04月12日 23时58分37秒