实现文字的渐变效果

来源:互联网 发布:js判断上传文件的类型 编辑:程序博客网 时间:2024/04/30 10:13

CAGradientLayer 是用来生成两种或更多颜色平滑渐变的 也是一个图层,layer的mask属性也是一个图层(CALayer),mask属性就像一个饼干切割机,mask图层的不透明的部分会被保存下来,透明的部分会被抛弃,也就是说 一个layerA 本身自带一张图片,假设再设置这个layerA的mask属性为layerB,layerB也含有一张图片,那么结果就是 相当于把layerB覆盖到layerA上,大小一样,然后layerA会根据layerB的透明部分裁剪,将透明的部分抛弃,不透明的部分保留,最终显示的是被layerB裁减过的layerA 用一张图表示如下,常用的场景无边框图片气泡:


layerA      layerB    layerA+mask layerB的效果
下面是文字的渐变

CAGradientLayer * gradientLayer = [CAGradientLayerlayer];

// 设置图层的颜色数组

    gradientLayer.colors =@[(__bridgeid)[UIColoryellowColor].CGColor,(__bridgeid)[UIColorredColor].CGColor];

// locations 属性是一个浮点数值的数组(以NSNumber包装),这些浮点数定义了colors属性中每个不同颜色的位置 0.0代表渐变开始,1.0代变结束

 // 一定要确保locations的数组大小和colors数组大小相同

    gradientLayer.locations =@[@0.0,@1.0];

// CAGradientLayer startPoint endPoint属性他们决定了渐变的方向,这两个参数是以单位坐标系进行的定义,所以左上角的左边是{00右下角坐标是{11

    gradientLayer.startPoint =CGPointMake(0,0);

    gradientLayer.endPoint =CGPointMake(1,1);

//    gradientLayer.opacity = 0.5; // 图层的透明度


UILabel * label = [[UILabelalloc]initWithFrame:CGRectMake(100,300,100, 30)];

    label.text =@"颜色渐变";

    [self.viewaddSubview:label];

//    设置frame

gradientLayer.frame = label.frame;

    [self.view.layeraddSublayer:gradientLayer];

//    将gradientLayer的mask属性设置为label.layer

    gradientLayer.mask = label.layer;

//    重新设置frame  相当于设置gradientLayer的mask的frame 与 本身的frame相等 

//    gradientLayer.mask.frame = gradientLayer.bounds; 与这个意思一样


    label.layer.frame = gradientLayer.bounds;



2 0
原创粉丝点击