美文网首页
layer的mask属性

layer的mask属性

作者: 冷武橘 | 来源:发表于2020-08-05 10:07 被阅读0次

一、mask

An optional layer whose alpha channel is used to mask the layer’s content.
mask 也是一个layer层,通过它的alpha通道来控制layer层得显示。

    CALayer *backLayer = [[CALayer alloc]init];
    backLayer.frame = CGRectMake(0, 100, 300, 300);
    backLayer.backgroundColor = [UIColor redColor].CGColor;
    [self.view.layer addSublayer:backLayer];
    
    CALayer *masklayer = [[CALayer alloc]init];
    masklayer.frame  = CGRectMake(20, 100, 100, 100);
    masklayer.backgroundColor = [UIColor yellowColor].CGColor;
    backLayer.mask = masklayer;
  • 1、mask并不是我们意义上的遮盖层,它的alpha通道控制着所属layer显示。
  • 2、masklayer必须是不透明的,这里设置masklayer的backgroundColor= [UIColor yellowColor].CGColor并不会真的会将layer渲染成黄色,这里的目的只是让masklayer是不透明的,因此你可以设置任意的颜色。默认masklayer是 clearColor,是透明的,而透明的mask,所属的layer是无法被渲染出来的。
  • 3、layer默认的mask是nil,如果你给layer配置了mask,不要忘了设置masklayer的size和position。只有masklayer的frame内的layer才能被渲染出来,这有点裁剪的意思,也好似masklayer像一个窗户一样,layer只能透过来一部分内容被渲染出来。

二、渐变色进度条


 // 进度条view
  UIView *progressView = [[UIView alloc] initWithFrame:CGRectMake(30.0, 100.0, self.view.bounds.size.width - 30.0 * 2, 5.0)];
  progressView.center = (CGPoint){self.view.bounds.size.width / 2, self.view.bounds.size.height / 3};
  progressView.autoresizingMask = UIViewAutoresizingFlexibleTopMargin;
  progressView.backgroundColor = [[UIColor lightGrayColor] colorWithAlphaComponent:.3];
  progressView.layer.cornerRadius = progressView.bounds.size.height / 2;
  progressView.layer.masksToBounds = YES;
  [self.view addSubview:progressView];

  // 渐变色layer
  CAGradientLayer *gradientLayer = [CAGradientLayer layer];
  gradientLayer.frame = progressView.bounds;
  gradientLayer.colors = @[(__bridge id)[[UIColor greenColor] colorWithAlphaComponent:1.0].CGColor,
                           (__bridge id)[[UIColor blueColor] colorWithAlphaComponent:1.].CGColor,
                           (__bridge id)[[UIColor purpleColor] colorWithAlphaComponent:1.0].CGColor,];
  gradientLayer.startPoint = (CGPoint){.0};
  gradientLayer.endPoint = (CGPoint){1.0};
  [progressView.layer addSublayer:gradientLayer];

  // mask layer
  CALayer *maskLayer = [CALayer layer];
  maskLayer.frame = (CGRect){.0, .0, .0, gradientLayer.bounds.size.height};
  maskLayer.backgroundColor = [UIColor whiteColor].CGColor;
  gradientLayer.mask = maskLayer;

  // 设置变化规则
  CGFloat deltaWidth = gradientLayer.bounds.size.width / 60;
  [NSTimer scheduledTimerWithTimeInterval:.1 repeats:YES block:^(NSTimer * _Nonnull timer) {
      CGRect rect = maskLayer.bounds;
      rect.size.width += deltaWidth;
      maskLayer.frame = rect;
      if (gradientLayer.bounds.size.width - maskLayer.bounds.size.width < deltaWidth) {
          [timer invalidate];
      }
  }];

三 、渐变色的文字

    UIView *contentView = [[UIView alloc]init];
    [self.view addSubview:contentView];
    contentView.backgroundColor = [UIColor redColor];
    contentView.frame = CGRectMake(100, 100, 300, 300);

   // 渐变色layer
    CAGradientLayer *gradientLayer = [CAGradientLayer layer];
    gradientLayer.frame = contentView.bounds;
    gradientLayer.colors = @[(__bridge id)[[UIColor greenColor] colorWithAlphaComponent:1.0].CGColor,
                             (__bridge id)[[UIColor blueColor] colorWithAlphaComponent:1.].CGColor,
                             (__bridge id)[[UIColor purpleColor] colorWithAlphaComponent:1.0].CGColor,];
    gradientLayer.startPoint = CGPointMake(0, 0);
    gradientLayer.endPoint = CGPointMake(1, 0);
    [contentView.layer addSublayer:gradientLayer];

 
    UILabel *lable =[[UILabel alloc]init];
    lable.text = @"测试测试测试测试测试测试测试";
    lable.font = [UIFont systemFontOfSize:30];
    contentView.maskView = lable;
    lable.frame = contentView.bounds;
    

四、给View设置圆角

    UIView *redView = [[UIView alloc]init];
    [self.view addSubview:redView];
    redView.frame = CGRectMake(100, 100, 100, 40);
    redView.backgroundColor = [UIColor redColor];
    UIBezierPath * path = [UIBezierPath bezierPathWithRoundedRect:redView.bounds byRoundingCorners:UIRectCornerTopLeft|UIRectCornerTopRight cornerRadii:CGSizeMake(10, 10)];
    CAShapeLayer*maskLayer = [[CAShapeLayer alloc]init];
    maskLayer.path= path.CGPath;
    redView.layer.mask = maskLayer;

相关文章

  • 5.11复习

    1.材质 材质混合,layer mask, us scale date:调用属性(ocn layer mask)。...

  • layer的mask属性

    一、mask An optional layer whose alpha channel is used to m...

  • CALayer属性mask

    CALayer的属性mask,mask也是一个layer,这边称它为maskLayer。介绍中描述 An opti...

  • 【iOS开发】iOS中的Mask

    CALayer拥有mask属性,Apple的官方解释如下: An optional layer whose alp...

  • 用Layer层蒙板实现圆形滚动条效果

    Mask Mask又叫蒙板,顾名思义Mask就是layer上的一层layer,于普通的layer层不同的是,Mas...

  • iOS 部分圆角+边框的实现

    部分圆角可以通过 layer 的 mask 属性实现。 1. 创建 UIBezierPath 关键参数 corne...

  • iOS 离屏渲染

    1、造成离屏渲染的几种方式 使用了 mask 的 layer (layer.mask)需要进行裁剪的 layer ...

  • IOS 聊天图片气泡显示

    layer.mask 的使用 a.layer.mask = b.layer;b 的不透明的部分,会变成a的内容的显...

  • mask

    mask, 一直不明白 这个属性的作用,官方文档这样解释 -- An optional layer whos...

  • ios xib控件添加边框

    layer.cornerRadius:圆角设置 layer.borderWidth:边框宽度 layer.mask...

网友评论

      本文标题:layer的mask属性

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