一、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;