iOS CALayer-实现颜色的渐变和曲线图

最近研究了一下颜色的渐变

效果,下面简单抽出一个类的代码,方便查看:

#import <UIKit/UIKit.h>

@interface YXLayerView : UIView
{
    CAShapeLayer * _lineLayer,* _maskLayer;
    CAGradientLayer * _backgroundLayer;
}

@end

#import "YXLayerView.h"

@implementation YXLayerView

- (instancetype)init
{
    self = [super init];
    if (self) {
        [self inits];
    }
    return self;
}

- (instancetype)initWithCoder:(NSCoder *)coder
{
    self = [super initWithCoder:coder];
    if (self) {
        [self inits];
    }
    return self;
}

- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        [self inits];
    }
    return self;
}

- (void)inits
{
    self.backgroundColor = [UIColor grayColor];
    self.clipsToBounds = YES;
    
    _maskLayer = [[CAShapeLayer alloc] init];
    
    _backgroundLayer = [[CAGradientLayer alloc] init];
    _backgroundLayer.colors = @[(id)[UIColor redColor].CGColor,(id)[UIColor greenColor].CGColor,(id)[UIColor blueColor].CGColor];
    _backgroundLayer.startPoint = CGPointMake(0.5, 0);
    _backgroundLayer.endPoint = CGPointMake(0.5, 1.0);
    [self.layer addSublayer:_backgroundLayer];
    
    _lineLayer = [[CAShapeLayer alloc] init];
    _lineLayer.lineCap = kCALineCapRound;
    _lineLayer.lineJoin = kCALineJoinRound;
    _lineLayer.fillColor = [UIColor clearColor].CGColor;
    _lineLayer.strokeColor = [UIColor redColor].CGColor;
    _lineLayer.lineWidth = 5.0;
    [self.layer addSublayer:_lineLayer];
}

// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
    // Drawing code
    CGRect bounds = self.bounds;
    CGFloat space = CGRectGetWidth(bounds)/4.0;
    CGFloat y = CGRectGetHeight(bounds)/2.0;
    UIBezierPath * bezierPath = [UIBezierPath bezierPath];
    [bezierPath moveToPoint:CGPointMake(0, y)];
    [bezierPath addQuadCurveToPoint:CGPointMake(space, y - 10) controlPoint:CGPointMake(space/2.0, y - 80)];
    [bezierPath addQuadCurveToPoint:CGPointMake(2 * space, y - 10) controlPoint:CGPointMake(space + space/2.0, y - 80)];
    [bezierPath addQuadCurveToPoint:CGPointMake(3 * space, y - 40) controlPoint:CGPointMake(2 * space + space/2.0, (y - 40)/2.0)];
    [bezierPath addQuadCurveToPoint:CGPointMake(4 * space, y) controlPoint:CGPointMake(3 * space + space/2.0, y/2.0)];
    _lineLayer.path = bezierPath.CGPath;
    
    _backgroundLayer.frame = bounds;
    [bezierPath addLineToPoint:CGPointMake(CGRectGetWidth(bounds), CGRectGetHeight(bounds))];
    [bezierPath addLineToPoint:CGPointMake(0, CGRectGetHeight(bounds))];
    [bezierPath closePath];
    _maskLayer.path = bezierPath.CGPath;
    _backgroundLayer.mask = _maskLayer;
}

@end


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值