iOS各种layer的用法

1、CAShapeLayer

CGPath能表示的形状,CAShapeLayer都可以绘制出来。换句话说CGPath可以限制CAShapeLayer的形状。CAShapeLayer有一个属性Path,将路径赋值给这个属性即可。下面是一些应用场景。

1️⃣作为遮罩:CAShapeLayer可以作为其他图层的遮罩使用,用于限制其他图层的形状,通过图层的mask属性赋值。下面是绘制一个圆形的图片,通常我们通过设置imageView.layer的圆角半径来让imageView变成圆形,现在可以直接使用CAShapeLayer生成一个圆形遮罩覆盖在imageView上

    //创建imageView
    UIImageView *imagev = [[UIImageView alloc] init];
    imagev.frame = CGRectMake(100, 100, 100, 100);   //边长100的正方形
    [self.view addSubview:imagev];
 
    CAShapeLayer *shaplayer = [CAShapeLayer layer];
    UIBezierPath *path = [UIBezierPath bezierPath];     //创建路径
    [path addArcWithCenter:CGPointMake(50, 50) radius:50 startAngle:0 endAngle:M_PI*2 clockwise:YES];       //圆形路径 注意这里的center是以imageView为坐标系的
    shaplayer.path = path.CGPath;    //要转成CGPath
    imagev.layer.mask = shaplayer;   //限制imageView的外形

注意:

  • 作为遮罩时不用设置颜色属性,只需设置path属性。
  • 作为遮罩时才会限制父layer的形状
  • 作为子layer时不会限制父layer的形状

2️⃣动画效果:通过不断的改变CAShapeLayer的path从而达到动画的效果,可以做出核心动画难以实现的效果,比如粘性动画、单边的弹性下拉效果、qq的粘性按钮效果、正弦波浪线等等,相当丰富,我这里提供几个链接

粘性动画http://www.cocoachina.com/ios/20150618/12171.html

3️⃣注意两个属性strokeStart和strokeEnd,这两个属性用于对绘制的Path进行区域限制,值为0-1之间,并且这两个属性可做动画,例子如下。

- (void)viewDidLoad {
    [super viewDidLoad];

    CAShapeLayer *layer = [CAShapeLayer layer];
    layer.strokeColor = kRedColor.CGColor;
    layer.fillColor = kClearColor.CGColor;
    layer.lineWidth = 2;   //通过调整线宽可以做成饼状图
    UIBezierPath *path = [UIBezierPath bezierPath];
    //值得一提的是这里圆的起点是-π
    [path addArcWithCenter:CGPointMake(150, 150) radius:100 startAngle:-M_PI endAngle:M_PI clockwise:YES];
    layer.path = path.CGPath;
    layer.strokeEnd = 0.0;
    self.layer = layer;
    [self.view.layer addSublayer:layer];
}

-(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
    CABasicAnimation *anim = [CABasicAnimation animation];
    anim.keyPath = @"strokeEnd";
    anim.fromValue = @0.0;
    anim.toValue = @1.0;
    anim.duration = 2;
    anim.repeatCount = 100;
    [self.layer addAnimation:anim forKey:nil];   
}
QQ20180109-105935-HD.gif

4️⃣虚线效果
虚线效果只需设置lineDashPattern 属性。self.shapLayer.lineDashPattern = @[@(4),@(4)];
数组中第一个4表示先画4个点的实线,第二4表示接着间隔4个点不画线
5️⃣二维码扫描框
二维码的扫描框通常是中间矩形为透明,其余边框为带透明度的黑色

//包裹self.view的路径
UIBezierPath *overlayPath = [UIBezierPath bezierPathWithRect:self.view.bounds];
//中间透明边框的路径
UIBezierPath *transparentPath = [UIBezierPath bezierPathWithRect:CGRectMake(100, 150, 200, 200)];
//合并为一个路径
[overlayPath appendPath:transparentPath];

CAShapeLayer *layer = [CAShapeLayer layer];
layer.path = overlayPath.CGPath;
layer.fillRule = kCAFillRuleEvenOdd;  //奇偶填充规则
layer.fillColor = [UIColor colorWithRed:0 green:0 blue:0 alpha:0.3].CGColor;

[self.view.layer addSublayer:layer];

2、CATextLayer

CATextLayer的绘制功能要比UILabel强大很多,并且速度要快不少。
简单使用

    CATextLayer *textLayer = [CATextLayer layer];
    textLayer.string = @"123abcABC123abcABC123abcABC123abcABC123abcABC123abcABC123a3abcABC123abcABC123abcABC123a3abcABC123abcABC123abcABC123abcABC123abcABC呵呵呵";
    textLayer.font = CGFontCreateWithFontName((__bridge CFStringRef)(@"Georgia"));
    textLayer.fontSize = 12;
    textLayer.backgroundColor = kYellowColor.CGColor;
    textLayer.foregroundColor = kRedColor.CGColor;         //文字颜色,普通字符串时可以使用该属性
    textLayer.wrapped = YES;                               //为yes时自动换行
    textLayer.truncationMode = @"start";                   //字符串过长时的省略位置,注意是最后一行的哪个位置
//    textLayer.alignmentMode = kCAAlignmentCenter;        //对齐方式
//    textLayer.allowsFontSubpixelQuantization = NO;
    textLayer.frame = CGRectMake(0, 0, 100, 100);
//    textLayer.position = self.view.center;                //图层的中心点位于父层的位置
    textLayer.contentsScale = [UIScreen mainScreen].scale;  //按当前的屏幕分辨率显示   否则字体会模糊
    [self.view.layer addSublayer:textLayer];
QQ20180108-111401.png

3、CATransformLayer

CATransformLayer是一个容器layer,backgroundColor等外观显示属性对他是无效的,CATransformLayer只是一个容器,只负责容纳其他layer并显示其他layer。CATransformLayer通常用于构造复杂的3D事物,他不是一个平面化的图层,能够构造多层次的3D结构。这里就创建一个简单的立方体,代码如下。

@interface ViewController ()
@property (nonatomic,strong) NSMutableArray<CALayer *> *layerArray;
@property (nonatomic,strong) NSMutableArray *transArray;
@end

@implementation ViewController
- (void)viewDidLoad {
    [super viewDidLoad];
    //创建图层
    CATransformLayer *cublayer = [CATransformLayer layer];
//    layer.borderColor = kBlackColor.CGColor;      //这些属性设置都是无效的
//    layer.borderWidth = 1;
//    layer. backgroundColor = [UIColor redColor].CGColor;
    cublayer.bounds = CGRectMake(0, 0, 200, 200);
    cublayer.position = self.view.center;
    [self.view.layer addSublayer:cublayer];

    //对容器图层做动画
    CATransform3D transA = CATransform3DMakeRotation(M_PI, 1, 1, 0);
    CATransform3D transB = CATransform3DMakeRotation(M_PI*2, 1, 1, 0);
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform"];
    animation.duration  = 4;
    animation.autoreverses     = YES;
    animation.repeatCount     = 100;
    animation.fromValue     = [NSValue valueWithCATransform3D:transA];
    animation.toValue      = [NSValue valueWithCATransform3D:transB];
    [cublayer addAnimation:animation forKey:nil];

    //创建立方体的6个面
    self.layerArray = [NSMutableArray array];
    for (NSInteger i = 0; i<6; i++) {
        CALayer *sublayer = [CALayer layer];
        sublayer.bounds = CGRectMake(0, 0, 100, 100);
        sublayer.position = CGPointMake(100, 100);
        sublayer.backgroundColor = kRandomColorAndAlpha(0.3).CGColor;
        sublayer.speed = 0.1;
        [self.layerArray addObject:sublayer];
        [cublayer addSublayer:sublayer];
    }

    //为六个面的图层创建3D变换,使之组成立方体
    CATransform3D ct1 = CATransform3DMakeTranslation(0, 0, 50);
    CATransform3D ct2 = CATransform3DMakeTranslation(0, 0, -50);
    CATransform3D ct3 = CATransform3DMakeTranslation(-50, 0, 0);
    ct3 = CATransform3DRotate(ct3, M_PI_2, 0, 1, 0);
    CATransform3D ct4 = CATransform3DMakeTranslation(50, 0, 0);
    ct4 = CATransform3DRotate(ct4, M_PI_2, 0, 1, 0);
    CATransform3D ct5 = CATransform3DMakeTranslation(0, -50, 0);
    ct5 = CATransform3DRotate(ct5, M_PI_2, 1, 0, 0);
    CATransform3D ct6 = CATransform3DMakeTranslation(0, 50, 0);
    ct6 = CATransform3DRotate(ct6, M_PI_2, 1, 0, 0);
    //存入数组待用
    self.transArray = [NSMutableArray arrayWithArray:@[[NSValue valueWithCATransform3D:ct1],
                                                    [NSValue valueWithCATransform3D:ct2],
                                                    [NSValue valueWithCATransform3D:ct3],
                                                    [NSValue valueWithCATransform3D:ct4],
                                                    [NSValue valueWithCATransform3D:ct5],
                                                    [NSValue valueWithCATransform3D:ct6]]];
}

//一开始六个面叠在一起,点击屏幕后,立方体的六个面慢慢归位
-(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
    for (NSInteger i = 0; i<6; i++) {
        NSValue *value = self.transArray[I];
        CATransform3D ct = [value CATransform3DValue];
        CALayer *layer = self.layerArray[I];
        [UIView animateWithDuration:1.0 animations:^{
            layer.transform = ct;
        }];
    } 
}
QQ20180108-145949-HD.gif

4、CAGradientLayer

CAGradientLayer是用来生成两种或更多颜色平滑渐变的图层,总而言之就是渐变图层。
这里需要注意一个属性locations ,locations 表示的是渐变区间,数组中的数字必须是递增的。比如下面这个例子layer.locations = @[@0.5,@0.8]; 渐变区间是0.5-0.8,也就是说0.0-0.5是纯红色,0.5-0.8是红色渐变到绿色,0.8-1.0是纯绿色。不设置这个属性就是整个区间0.0-1.0均匀渐变。
1️⃣基础渐变,双色渐变
由红色渐变到绿色

CAGradientLayer *layer = [CAGradientLayer layer];
layer.frame = self.view.bounds;
//颜色梯度数组,需要渐变的颜色
layer.colors = @[(__bridge id)kRedColor.CGColor,(__bridge id)kGreenColor.CGColor];
//渐变区间,
layer.locations = @[@0.5,@0.8];
[self.view.layer addSublayer:layer];
QQ20180108-152620.png

2️⃣单色渐变
红色的渐变,单色渐变其实就是双色渐变,这里要说明另外两个属性startPoint和endPoint,这两个属性是一起使用的,用于确定渐变方向。

CAGradientLayer *layer = [CAGradientLayer layer];
layer.frame = self.view.bounds;
layer.colors = @[(__bridge id)kRedColor.CGColor,(__bridge id)kWhiteColor.CGColor];
layer.startPoint = CGPointMake(0, 0);
layer.endPoint = CGPointMake(0.5, 1);
[self.view.layer addSublayer:layer];
QQ20180108-154528.png

3️⃣多色渐变 彩虹🌈


QQ20180108-160251.png

4️⃣文字的色彩渐变

- (void)viewDidLoad {
    [super viewDidLoad];
    
    //1、创建label
    UILabel *label = [[UILabel alloc] init];
    label.text = @"呵呵🙃";
    label.font = [UIFont systemFontOfSize:30];
    [self.view addSubview:label];
    //2、创建渐变图层
    CAGradientLayer *layer = [CAGradientLayer layer];
    layer.frame = CGRectMake(0, 0, 100, 50);
    layer.colors = @[(__bridge id)kRedColor.CGColor,(__bridge id)kGreenColor.CGColor];
    layer.locations = @[@0.5,@0.8];
    [self.view.layer addSublayer:layer];
    //3、设置遮罩
    layer.mask = label.layer;
    label.frame = layer.bounds;
}

5️⃣使用Core Graphics相关方法实现渐变
iOS Core Graphics中有两个方法用于绘制渐变颜色,CGContextDrawLinearGradient可以用于生成线性渐变,CGContextDrawRadialGradient用于生成圆半径方向颜色渐变。函数可以自定义path,无论是什么形状都可以,原理都是用来做Clip,所以需要在CGContextClip函数前调用CGContextAddPath函数把CGPathRef加入到Context中。
另外一个需要注意的地方是渐变的方向,方向是由两个点控制的,点的单位就是坐标。因此需要正确从CGPathRef中找到正确的点,方法当然有很多种看具体实现,本例中,我就是简单得通过调用CGPathGetBoundingBox函数,返回CGPathRef的矩形区域,然后根据这个矩形取两个点。

线性渐变
- (void)drawLinearGradient:(CGContextRef)context
                      path:(CGPathRef)path
                startColor:(CGColorRef)startColor
                  endColor:(CGColorRef)endColor
{
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGFloat locations[] = { 0.0, 1.0 };
    NSArray *colors = @[(__bridge id) startColor, (__bridge id) endColor];
    CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef) colors, locations);
    CGRect pathRect = CGPathGetBoundingBox(path);
    //具体方向可根据需求修改
    CGPoint startPoint = CGPointMake(CGRectGetMinX(pathRect), CGRectGetMidY(pathRect));
    CGPoint endPoint = CGPointMake(CGRectGetMaxX(pathRect), CGRectGetMidY(pathRect));
    CGContextSaveGState(context);
    CGContextAddPath(context, path);
    CGContextClip(context);
    CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0);
    CGContextRestoreGState(context);
    CGGradientRelease(gradient);
    CGColorSpaceRelease(colorSpace);
}
- (void)viewDidLoad 
{
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    //创建CGContextRef
    UIGraphicsBeginImageContext(self.view.bounds.size);
    CGContextRef gc = UIGraphicsGetCurrentContext();
    //创建CGMutablePathRef
    CGMutablePathRef path = CGPathCreateMutable();
    //绘制Path
    CGRect rect = CGRectMake(0, 100, 300, 200);
    CGPathMoveToPoint(path, NULL, CGRectGetMinX(rect), CGRectGetMinY(rect));
    CGPathAddLineToPoint(path, NULL, CGRectGetMidX(rect), CGRectGetMaxY(rect));
    CGPathAddLineToPoint(path, NULL, CGRectGetWidth(rect), CGRectGetMaxY(rect));
    CGPathCloseSubpath(path);
    //绘制渐变
    [self drawLinearGradient:gc path:path startColor:[UIColor greenColor].CGColor endColor:[UIColor redColor].CGColor];
    //注意释放CGMutablePathRef
    CGPathRelease(path);
    //从Context中获取图像,并显示在界面上
    UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    UIImageView *imgView = [[UIImageView alloc] initWithImage:img];
    [self.view addSubview:imgView];
}
圆半径方向渐变
- (void)drawRadialGradient:(CGContextRef)context
                      path:(CGPathRef)path
                startColor:(CGColorRef)startColor
                  endColor:(CGColorRef)endColor
{
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGFloat locations[] = { 0.0, 1.0 };
    NSArray *colors = @[(__bridge id) startColor, (__bridge id) endColor];
    CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef) colors, locations);
    CGRect pathRect = CGPathGetBoundingBox(path);
    CGPoint center = CGPointMake(CGRectGetMidX(pathRect), CGRectGetMidY(pathRect));
    CGFloat radius = MAX(pathRect.size.width / 2.0, pathRect.size.height / 2.0) * sqrt(2);
    CGContextSaveGState(context);
    CGContextAddPath(context, path);
    CGContextEOClip(context);
    CGContextDrawRadialGradient(context, gradient, center, 0, center, radius, 0);
    CGContextRestoreGState(context);
    CGGradientRelease(gradient);
    CGColorSpaceRelease(colorSpace);
}
- (void)viewDidLoad 
{
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    //创建CGContextRef
    UIGraphicsBeginImageContext(self.view.bounds.size);
    CGContextRef gc = UIGraphicsGetCurrentContext();
    //创建CGMutablePathRef
    CGMutablePathRef path = CGPathCreateMutable();
    //绘制Path
    CGRect rect = CGRectMake(0, 100, 300, 200);
    CGPathMoveToPoint(path, NULL, CGRectGetMinX(rect), CGRectGetMinY(rect));
    CGPathAddLineToPoint(path, NULL, CGRectGetMidX(rect), CGRectGetMaxY(rect));
    CGPathAddLineToPoint(path, NULL, CGRectGetWidth(rect), CGRectGetMaxY(rect));
    CGPathAddLineToPoint(path, NULL, CGRectGetWidth(rect), CGRectGetMinY(rect));
    CGPathCloseSubpath(path);
    //绘制渐变
    [self drawRadialGradient:gc path:path startColor:[UIColor greenColor].CGColor endColor:[UIColor redColor].CGColor];
    //注意释放CGMutablePathRef
    CGPathRelease(path);
    //从Context中获取图像,并显示在界面上
    UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    UIImageView *imgView = [[UIImageView alloc] initWithImage:img];
    [self.view addSubview:imgView];
}

5、CAReplicatorLayer

CAReplicatorLayer就是复制图层。CAReplicatorLayer又是一个容器图层,他可以将他的子图层复制指定的次数,复制出来的这些图层都拥有相同的图层属性和动画属性,通过下面的例子来介绍一些重要的属性
1️⃣辐射动画
属性instanceCount表示拷贝图层的次数,默认为1 。 举个栗子instanceCount = 6 表示总共有6个子图层,其中5个是拷贝出来的。
属性instanceDelay表示拷贝延时,拷贝一个图层后延时多少秒拷贝下一个图层
这里为了使动画连续,我让动画的duration = 0.6 * 6 = 3.6

    //创建复制图层容器
    CAReplicatorLayer *replicator = [CAReplicatorLayer layer];
    replicator.frame = self.view.bounds;
    [self.view.layer addSublayer:replicator];
    replicator.instanceCount = 6;
    replicator.instanceDelay = 0.6;
    //放大动画
    CABasicAnimation *anim = [CABasicAnimation animation];
    anim.keyPath = @"transform.scale";
    anim.fromValue = @1;
    anim.toValue = @20;
    anim.duration = 3.6;
    //透明度动画
    CABasicAnimation *anim2 = [CABasicAnimation animation];
    anim2.keyPath = @"opacity";
    anim2.toValue = @0.0;
    anim2.fromValue = @1.0;
    anim2.duration = 3.6;
    
    CAAnimationGroup *group = [CAAnimationGroup animation];
    group.animations = @[anim,anim2];
    group.duration = 3.6;
    group.repeatCount = 100;
    //创建子图层
    CALayer *layer = [CALayer layer];
    [layer addAnimation:group forKey:nil];
    layer.bounds = CGRectMake(0, 0, 10, 10);
    layer.position = self.view.center;
    layer.cornerRadius = 5;
    layer.backgroundColor = kRedColor.CGColor;
    [replicator addSublayer:layer];
QQ20180108-172909-HD.gif

更改一下属性replicator.instanceCount = 3; 动画就不连续了


QQ20180108-173130-HD.gif

2️⃣加载动画
属性instanceTransform 表示复制图层在被创建时产生的和上一个复制图层的位移

    CAReplicatorLayer *replicator = [CAReplicatorLayer layer];
    replicator.frame = self.view.bounds;
    [self.view.layer addSublayer:replicator];
    replicator.instanceCount = 6;
    replicator.instanceDelay = 0.2;
    //位移属性
    CATransform3D trans = CATransform3DMakeTranslation(25, 0, 0); //圆点依次向右移动25
    replicator.instanceTransform = trans;
    //透明度动画
    CAKeyframeAnimation *anim = [CAKeyframeAnimation animation];
    anim.keyPath = @"opacity";
    anim.values = @[@1.0,@0.0,@1.0];
    anim.duration = 1.2;
    anim.repeatCount = 100;

    CALayer *layer = [CALayer layer];
    [layer addAnimation:anim forKey:nil];
    layer.bounds = CGRectMake(0, 0, 20, 20);
    layer.position = self.view.center;
    layer.cornerRadius = 10;
    layer.backgroundColor = kRedColor.CGColor;
    [replicator addSublayer:layer];
QQ20180108-175746-HD.gif

其他的一些属性
instanceColor : 设置多个复制图层的颜色,默认位白色
//RGB偏移量
instanceRedOffset: 设置每个复制图层相对上一个复制图层的红色偏移量
instanceGreenOffset: 设置每个复制图层相对上一个复制图层的绿色偏移量
instanceBlueOffset: 设置每个复制图层相对上一个复制图层的蓝色偏移量
instanceAlphaOffset: 设置每个复制图层相对上一个复制图层的透明度偏移量
以下就是设置instanceAlphaOffset = -0.1的效果,其他几个属性用法类似

    CAReplicatorLayer *replicator = [CAReplicatorLayer layer];
    replicator.frame = self.view.bounds;
    [self.view.layer addSublayer:replicator];
    replicator.instanceCount = 6;
    replicator.instanceAlphaOffset = -0.1; // 透明度递减,每个图层都比上一个复制图层的透明度小0.1
    
    CATransform3D trans = CATransform3DMakeTranslation(25, 0, 0);
    replicator.instanceTransform = trans;

    CALayer *layer = [CALayer layer];
    layer.bounds = CGRectMake(0, 0, 20, 20);
    layer.position = self.view.center;
    layer.cornerRadius = 10;
    layer.backgroundColor = kRedColor.CGColor;
    [replicator addSublayer:layer];
QQ20180108-181331.png

3️⃣着重介绍一下instanceTransform属性,还是通过例子吧

    CAReplicatorLayer *replicator = [CAReplicatorLayer layer];
    replicator.frame = self.view.bounds;
    [self.view.layer addSublayer:replicator];
    replicator.instanceCount = 2;
    CATransform3D trans = CATransform3DMakeTranslation(0, -50, 0);  //y的负方向平移50  也就是方块的上方
    trans = CATransform3DRotate(trans, M_PI_4, 0, 0, 1);    //然后旋转45度
    replicator.instanceTransform = trans;

    CALayer *layer = [CALayer layer];
    layer.bounds = CGRectMake(0, 0, 30, 30);
    layer.position = self.view.center;
    layer.backgroundColor = kRedColor.CGColor;
    [replicator addSublayer:layer];

我们来看看instanceTransform是怎么运作的,先设置replicator.instanceCount = 2; 效果如下,很明显上面那个小方块向上平移了50个点然后旋转了45度。


QQ20180109-100035.png

设置replicator.instanceCount = 3; 效果如下,由于方块2旋转了45度,所以方块2的上方(黑色边表示上方)也是旋转之后的上方,方块3就是沿着方块2的上方平移50点然后再旋转45度。


QQ20180109-100650.png

设置replicator.instanceCount = 4; 经过上面的推断,下面的效果应该能自己想出来了。
QQ20180109-101304.png

这里要特别注意CATransform3DRotate旋转变换,该方块旋转之后自己的坐标系也发生了同样角度的旋转(感觉是每个方块都有自己的坐标系),在旋转之后再要进行平移操作,那也是按照旋转之后的坐标系进行平移。 (上面的推断纯属个人判断,如有错误还望指正!)

CATransform3D trans = CATransform3DMakeTranslation(0, -50, 0); 
trans = CATransform3DRotate(trans, M_PI_4, 0, 0, 1);
trans = CATransform3DTranslate(trans, 21, 0, 0);  //按照上面旋转之后的坐标系进行平移(当前坐标系的右方向平移21)
QQ20180109-102913.png

6、CAScrollLayer

- (void)viewDidLoad {
    [super viewDidLoad];

    CALayer *layer = [CALayer layer];
    layer.contents = (id)kImage(@"111").CGImage;
    layer.frame = CGRectMake(0, 0, 375, 667);
    
    self.scrollLayer = [CAScrollLayer layer];
    self.scrollLayer.frame = CGRectMake(60, 60, 200, 200);
    [self.scrollLayer addSublayer:layer];
    self.scrollLayer.scrollMode = kCAScrollBoth;
    [self.view.layer addSublayer:self.scrollLayer];
    
    UIPanGestureRecognizer *pan = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(gestureChanged:)];
    [self.view addGestureRecognizer:pan];
}

-(void)gestureChanged:(UIPanGestureRecognizer *)gesture
{
    CGPoint translation = [gesture translationInView:self.view];
    CGPoint origin = self.scrollLayer.bounds.origin;
    origin = CGPointMake(origin.x-translation.x, origin.y-translation.y);
    [self.scrollLayer scrollToPoint:origin];
    [gesture setTranslation:CGPointZero inView:self.view];
}
QQ20180109-145321-HD.gif

7、CATiledLayer

8、CAEmitterLayer

下面这两篇文章写的不错,我就没必要再写了

https://www.jianshu.com/p/197c2257f597
https://www.cnblogs.com/densefog/p/5424155.html
https://www.kancloud.cn/manual/ios/97766

注意点:birthRate、velocity和lifetime属性是对CAEmitterCell设置的,对CAEmitterLayer设置无效

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,602评论 6 481
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,442评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 152,878评论 0 344
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,306评论 1 279
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,330评论 5 373
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,071评论 1 285
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,382评论 3 400
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,006评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,512评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,965评论 2 325
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,094评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,732评论 4 323
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,283评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,286评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,512评论 1 262
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,536评论 2 354
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,828评论 2 345

推荐阅读更多精彩内容