iOS-记录实现渐变色及圆角不同角度切割的办法

一、渐变色

  1. 找的几个方法,都是需要先确定fram值的,先用着吧,其实最快捷方式还是弄个图片省事

在view的类方法里扩展,通过绘制渐变色生成图片,然后设置背景色。

typedef enum : NSUInteger {
    TmyCustAxisNeither = 0,
    TmyCustAxisHorizontal = 1 << 0,
    TmyCustAxisVertical = 1 << 1,
    TmyCustAxisBoth = (TmyCustAxisHorizontal | TmyCustAxisVertical),
} TmyCustAxis;

- (void)tmyCustLineHChangeColor:(UIColor *)color toColor:(UIColor *)toColor withDir:(TmyCustAxis)changeDirection {
    if (CGRectEqualToRect(self.frame, CGRectZero) || self.frame.size.height < 1) {
        return;
    }
    CAGradientLayer *gradientL = [CAGradientLayer layer];
    if (changeDirection == TmyCustAxisHorizontal) {
        gradientL.startPoint = CGPointMake(0, 0);
        gradientL.endPoint = CGPointMake(1, 0);
    }else if (changeDirection == TmyCustAxisVertical) {
        gradientL.startPoint = CGPointMake(0, 0);
        gradientL.endPoint = CGPointMake(0, 1);
    }else if (changeDirection == TmyCustAxisBoth) {
        gradientL.startPoint = CGPointMake(0, 0);
        gradientL.endPoint = CGPointMake(1, 1);
    }else {
        gradientL.startPoint = CGPointMake(0, 1);
        gradientL.endPoint = CGPointMake(1, 0);
    }
    gradientL.frame = self.bounds;
    gradientL.colors = @[(id)color.CGColor, (id)toColor.CGColor];
    UIGraphicsBeginImageContextWithOptions(self.bounds.size, self.opaque, 0);
    [gradientL renderInContext:UIGraphicsGetCurrentContext()];
    UIImage *tmpImg = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    self.backgroundColor = [UIColor colorWithPatternImage:tmpImg];
}

参考:iOS 实现颜色渐变的几个方法

二、圆角切割

设置不同的圆角
rectCorner :每个圆角的半径值 左上top 右上left 左下bottom 右下right
radView :要设置的view

- (void)qiHandleFourConnerWithView:(UIView *)radView edge:(UIEdgeInsets)rectCorner {
//    左上top 右上left  左下bottom 右下right
    CGPathRef pathR = [self qiHandlePathWithRect:radView.bounds CornerRect:rectCorner];
    CAShapeLayer *shaperLayer = [[CAShapeLayer alloc] init];
    shaperLayer.frame = radView.bounds;
    shaperLayer.path = pathR;
    radView.layer.mask = shaperLayer;
}

/// 四个不同角度的圆角
/// @param rect 当前view 的 rect
/// @param cornerRect 圆角的半径rect。 UIEdgeInsets 对应:top:左上; left:右上;  bottom:左下; right:右下;
- (CGPathRef)qiHandlePathWithRect:(CGRect)rect CornerRect:(UIEdgeInsets)cornerRect {
    CGFloat minX = CGRectGetMinX(rect);
    CGFloat minY = CGRectGetMinY(rect);
    CGFloat maxX = CGRectGetMaxX(rect);
    CGFloat maxY = CGRectGetMaxY(rect);
    
//    top 左上 left 右上 bottom 左下 right 右下 圆角的半径
// 4个角的圆心
    CGPoint topLeftPoint = CGPointMake(minX + cornerRect.top, minY + cornerRect.top); // 左上角
    CGPoint topRightPoint = CGPointMake(maxX - cornerRect.left, minY + cornerRect.left); // 右上
    CGPoint bottomLeftPoint = CGPointMake(minX + cornerRect.bottom, maxY - cornerRect.bottom);// 左下角
    CGPoint bottomRightPoint = CGPointMake(maxX - cornerRect.right, maxY - cornerRect.right);// 右下角
    
    // fales理解为从顺时针方向开始
    CGMutablePathRef mutRef = CGPathCreateMutable();
    CGPathAddArc(mutRef, nil, topLeftPoint.x, topLeftPoint.y, cornerRect.top, M_PI, 3*M_PI_2, false);
    CGPathAddArc(mutRef, nil, topRightPoint.x, topRightPoint.y, cornerRect.left, 3*M_PI_2, 0, false);
    CGPathAddArc(mutRef, nil, bottomRightPoint.x, bottomRightPoint.y, cornerRect.right, 0, M_PI_2, false);
    CGPathAddArc(mutRef, nil, bottomLeftPoint.x, bottomLeftPoint.y, cornerRect.bottom, M_PI_2, M_PI, false);

    CGPathCloseSubpath(mutRef);
    
    return mutRef;
}
  • 起始角度理解
    绘制圆弧路径的理解 false 顺时针方向

调用方式:
[self qiHandleFourConnerWithView:self.mallTagImgView edge:UIEdgeInsetsMake(8, 2, 0, 13)];

  • 实际效果
    实际效果
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值