美文网首页
用CAReplicatorLayer 来实现虚线效果

用CAReplicatorLayer 来实现虚线效果

作者: 青火 | 来源:发表于2018-04-11 10:46 被阅读17次

一个用来复制图层的 CALayer的子类。

系统提供的API:

@interface CAReplicatorLayer : CALayer

@property NSInteger instanceCount; //复制图层的个数,包括加到上面的

@property BOOL preservesDepth; // 子图层是否平面化(看上面那个CATransformLayer)

@property CFTimeInterval instanceDelay; // 复制层动画延迟时间

@property CATransform3D instanceTransform; //子图层的transform变换,一般用来决定复制图层的初始位置以及初始试图变换

@property(nullable) CGColorRef instanceColor; // 复制层颜色,该颜色是与本体元素色值相乘,鬼知道是什么颜色

@property float instanceRedOffset; // 复制层红色偏移量

@property float instanceGreenOffset; // 复制层绿色偏移量

@property float instanceBlueOffset; // 复制层蓝色偏移量

@property float instanceAlphaOffset; // 复制层透明度偏移量

@end

这个类可以用来实现很多常见的栅格样式、阵列样式的图层,比如虚线的绘制等。

如果再添加上动画效果,就会产生很多奇妙的化学反应。

例如:动画波浪效果

/**

加载波浪动画

*/

- (void)loadWave {

    CAReplicatorLayer *replicatorLayer = [CAReplicatorLayer layer];

    replicatorLayer.bounds = self.view.bounds;

    replicatorLayer.position = self.view.center;

    [self.view.layer addSublayer:replicatorLayer];

    CALayer *layer = [CALayer layer];

    layer.backgroundColor = [UIColor blueColor].CGColor;

    layer.bounds = CGRectMake(0, 0, 5, 60);

    layer.position = CGPointMake(50, self.view.center.y);

    [replicatorLayer addSublayer:layer];

    //

    CABasicAnimation *basicAni = [CABasicAnimation animationWithKeyPath:@"transform.scale.y"];

    basicAni.toValue = @(0.1);

    basicAni.duration = 0.3;

    basicAni.autoreverses = YES;

    basicAni.repeatCount = NSIntegerMax;

    [layer addAnimation:basicAni forKey:@"layerPosition"];

    replicatorLayer.instanceCount = 30;

    CATransform3D transform = CATransform3DIdentity;

    transform = CATransform3DTranslate(transform, 10, 0, 0);

    replicatorLayer.instanceTransform = transform;

    replicatorLayer.instanceDelay = 0.1;

}

了解了上面的动画效果,虚线的实现就很简单了,只需要把元图层大小改为虚线大小,再把动画效果去掉就OK了。

相关文章

网友评论

      本文标题:用CAReplicatorLayer 来实现虚线效果

      本文链接:https://www.haomeiwen.com/subject/curahftx.html