IOS仿微信红包CAShapeLayer + UIBezierPath

/**
 *  仿微信红包
 */
- (void)wxRedPacket{
    //深色背景
    CAShapeLayer *redLayer = [[CAShapeLayer alloc] init];
    UIBezierPath *pathFang = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(20, 80, kMain_Width-40, kMain_Height-160) cornerRadius:4];
    redLayer.path = pathFang.CGPath;
    [self.view.layer addSublayer:redLayer];
    [redLayer setFillColor:[UIColor colorWithRed:0.7968 green:0.2186 blue:0.204 alpha:1.0].CGColor];
    
    //浅色红包口
    CAShapeLayer *lineLayer = [[CAShapeLayer alloc] init];
    UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(20, 80, kMain_Width-40, kMain_Height-320) byRoundingCorners:(UIRectCornerTopLeft | UIRectCornerTopRight) cornerRadii:CGSizeMake(4, 4)];
    CGPoint startPoint = CGPointMake(20,  kMain_Height-240);
    CGPoint endPoint = CGPointMake(kMain_Width-20, kMain_Height-240);
    CGPoint controlPoint = CGPointMake(kMain_Width*0.5, kMain_Height-180);
    //曲线起点
    [path moveToPoint:startPoint];
    //曲线终点和控制基点
    [path addQuadCurveToPoint:endPoint controlPoint:controlPoint];
    
    //曲线部分颜色和阴影
    [lineLayer setFillColor:[UIColor colorWithRed:0.851 green:0.3216 blue:0.2784 alpha:1.0].CGColor];
    [lineLayer setStrokeColor:[UIColor colorWithRed:0.9401 green:0.0 blue:0.0247 alpha:0.02].CGColor];
    [lineLayer setShadowColor:[UIColor blackColor].CGColor];
    [lineLayer setLineWidth:0.1];
    [lineLayer setShadowOffset:CGSizeMake(6, 6)];
    [lineLayer setShadowOpacity:0.2];
    [lineLayer setShadowOffset:CGSizeMake(1, 1)];
    lineLayer.path = path.CGPath;
    [self.view.layer addSublayer:lineLayer];
    
    //发红包按钮
    UIButton *sendBtn = [[UIButton alloc] initWithFrame:CGRectMake((kMain_Width-100)/2, kMain_Height-240-20, 100, 100)];
    sendBtn.layer.masksToBounds = YES;
    sendBtn.layer.cornerRadius = sendBtn.bounds.size.height/2;
    [sendBtn setTitle:@"发红包" forState:UIControlStateNormal];
    [sendBtn setBackgroundColor:[UIColor brownColor]];
    [self.view addSubview:sendBtn];
}

效果:

IOS仿微信红包CAShapeLayer + UIBezierPath_第1张图片
IMG_2618.PNG

你可能感兴趣的:(IOS仿微信红包CAShapeLayer + UIBezierPath)