layer的mask屬性

一、mask

An optional layer whose alpha channel is used to mask the layer’s content.
mask 也是一個(gè)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必須是不透明的,這里設(shè)置masklayer的backgroundColor= [UIColor yellowColor].CGColor并不會(huì)真的會(huì)將layer渲染成黃色,這里的目的只是讓masklayer是不透明的,因此你可以設(shè)置任意的顏色。默認(rèn)masklayer是 clearColor,是透明的,而透明的mask,所屬的layer是無法被渲染出來的。
  • 3、layer默認(rèn)的mask是nil,如果你給layer配置了mask,不要忘了設(shè)置masklayer的size和position。只有masklayer的frame內(nèi)的layer才能被渲染出來,這有點(diǎn)裁剪的意思,也好似masklayer像一個(gè)窗戶一樣,layer只能透過來一部分內(nèi)容被渲染出來。

二、漸變色進(jìn)度條


 // 進(jìn)度條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;

  // 設(shè)置變化規(guī)則
  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 = @"測(cè)試測(cè)試測(cè)試測(cè)試測(cè)試測(cè)試測(cè)試";
    lable.font = [UIFont systemFontOfSize:30];
    contentView.maskView = lable;
    lable.frame = contentView.bounds;
    

四、給View設(shè)置圓角

    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;
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

友情鏈接更多精彩內(nèi)容