在app开发中,经常会给一些view加上渐变色,下面我写一下我在项目中的实现方法。
渐变色,其实就是一种颜色,所以就是UIColor的一种。因此我们可以给UIColor写一个分类,在需要用的地方直接使用类方法,得到我们想要的渐变色。
首先,我们创建一个UIColor的分类UIColor+Gradient,然后在.h文件中定义一个枚举,用来设置渐变的方向:
typedefNS_ENUM(NSInteger, ZQGradientChangeDirection) {
ZQGradientChangeDirectionLevel, //水平方向渐变
ZQGradientChangeDirectionVertical, //垂直方向渐变
ZQGradientChangeDirectionUpwardDiagonalLine, //主对角线方向渐变
ZQGradientChangeDirectionDownDiagonalLine, //副对角线方向渐变
};
接着定义一个类初始化方法:
/*
size:渐变区域的尺寸
direction:渐变方向
startColor:开始颜色
endColor:结束颜色
*/
+ (instancetype)bm_colorGradientChangeWithSize:(CGSize)size
direction:(IHGradientChangeDirection)direction
startColor:(UIColor*)startcolor
endColor:(UIColor*)endColor;
好了,现在去.m文件中实现就可以了,直接上代码:
+ (instancetype)bm_colorGradientChangeWithSize:(CGSize)size
direction:(IHGradientChangeDirection)direction
startColor:(UIColor*)startcolor
endColor:(UIColor*)endColor {
if(CGSizeEqualToSize(size,CGSizeZero) || !startcolor || !endColor) {
return nil;
}
CAGradientLayer *gradientLayer = [CAGradientLayer layer];
gradientLayer.frame=CGRectMake(0,0, size.width, size.height);
CGPointstartPoint =CGPointZero;
if (direction == IHGradientChangeDirectionDownDiagonalLine) {
startPoint =CGPointMake(0.0,1.0);
}
gradientLayer.startPoint= startPoint;
CGPoint endPoint = CGPointZero;
switch(direction) {
case IHGradientChangeDirectionLevel:
endPoint =CGPointMake(1.0,0.0);
break;
case IHGradientChangeDirectionVertical:
endPoint =CGPointMake(0.0,1.0);
break;
case IHGradientChangeDirectionUpwardDiagonalLine:
endPoint =CGPointMake(1.0,1.0);
break;
case IHGradientChangeDirectionDownDiagonalLine:
endPoint =CGPointMake(1.0,0.0);
break;
default:
break;
}
gradientLayer.endPoint= endPoint;
gradientLayer.colors=@[(__bridgeid)startcolor.CGColor, (__bridgeid)endColor.CGColor];
UIGraphicsBeginImageContext(size);
[gradientLayerrenderInContext:UIGraphicsGetCurrentContext()];
UIImage*image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return [UIColor colorWithPatternImage:image];
}
好了,可以使用了,这是各个方向的效果图:
ZQGradientChangeDirectionLevel:
ZQGradientChangeDirectionVertical:
ZQGradientChangeDirectionUpwardDiagonalLine:
ZQGradientChangeDirectionDownDiagonalLine: