• CAGradientLayer


    参考:

    CAShapeLayer和CAGradientLayer

    一 简介

     1,CAGradientLayer,处理颜色渐变;

    2,CAGradientLayer的渐变色可以做隐式动画;

    3,大部分情况下,CAGradientLayer都是与CAShapeLayer配合使用的。

    CAShapeLayer提供形状,CAGradientLayer做背景。一般,CAShaperLayer作为CAGradientLayer的遮照——mask来用————CAGradientLayer作为背景使用;

    4,CAGradientLayer可以用作png遮照效果。

    eg:3

        // 创建形状遮罩
        self.circleLayer = [CAShapeLayer LayerWithCircleCenter:CGPointMake(82, 82)
                                                        radius:80
                                                    startAngle:DEGREES(0)
                                                      endAngle:DEGREES(360)
                                                     clockwise:YES
                                               lineDashPattern:@[@10, @10]];
        self.circleLayer.strokeColor   = [UIColor blackColor].CGColor;  // 边缘线的颜色
        self.circleLayer.lineCap       = kCALineCapSquare;              // 边缘线的类型
        self.circleLayer.lineWidth     = 4.f;                           // 线条宽度
        self.circleLayer.strokeStart   = 0.0f;
        self.circleLayer.strokeEnd     = 1.0f; // CAShapeLayer    *circleLayer;
        
        // 创建渐变图层
        self.faucet          = [CAGradientLayer layer]; // CAGradientLayer *faucet;
        self.faucet.frame    = CGRectMake(0, 0, 200, 200);
        self.faucet.position = self.view.center;
        
        // 以CAShapeLayer的形状作为遮罩是实现特定颜色渐变的关键
        self.faucet.mask   = self.circleLayer;
        self.faucet.colors = @[(id)[UIColor greenColor].CGColor,
                               (id)[UIColor redColor].CGColor,
                               (id)[UIColor cyanColor].CGColor,
                               (id)[UIColor purpleColor].CGColor,
                               (id)[UIColor yellowColor].CGColor];
        
        // 设定动画时间
        self.faucet.speed = 0.5f;
        
        // 添加到系统图层中
        [self.view.layer addSublayer:self.faucet];
        
        // 创建定时器   NSTimer         *timer;
        self.timer = [NSTimer scheduledTimerWithTimeInterval:1.f
                                                      target:self
                                                    selector:@selector(timerEvent)
                                                    userInfo:nil
                                                     repeats:YES];
    }

    二 坐标系统

    1,CAGradientLayer的坐标系统是从坐标(0,0)到(1,1)绘制的矩形;

    2,CAGradientLayer的frame值的size不为正方形的话,坐标系统会被拉伸;

    3,CAGradientLayer的startPoint与endPoint会直接影响颜色的绘制方向;

    4,CAGradientLayer的颜色分割点是以0到1的比例来计算的;

    三 色差动画实现

    1,确定渐变色渐变方向;

    2,设定两种颜色,其中一种透明色,另外一种是自定义颜色;

    3,设定好location的颜色分割点值;

    4,CAGradientLayer的颜色分割点是以0到1的比例来计算的。

    四 用CAGradientLayer封装色差动画的view

  • 相关阅读:
    第九章 表单效验
    第八章 使用jQuery操作DOM
    第七章 jQuery中的事件与动画
    CDQZ Day2
    HDU 3783
    CDQZ Day1
    BZOJ 2935/ Poi 1999 原始生物
    Luogu P1801 黑匣子_NOI导刊2010提高(06)
    Intelligent Poetry
    Great Expectations
  • 原文地址:https://www.cnblogs.com/developer-qin/p/4534363.html
Copyright © 2020-2023  润新知