iOS实现背景的渐变色

1.根据系统的CAGradientLayer实现


#define SC_WIDTH    [UIScreen mainScreen].bounds.size.width//屏幕宽度
#define SC_HEIGHT   [UIScreen mainScreen].bounds.size.height//屏幕高度
 //初始化梯度图层
    CAGradientLayer *gradientLayer = [[CAGradientLayer alloc] init];
    //设置梯度变化颜色数组
    gradientLayer.colors = @[(__bridge id)[UIColor redColor].CGColor,(__bridge id)[UIColor orangeColor].CGColor,(__bridge id)[UIColor blueColor].CGColor];
    //设置开始点
    gradientLayer.startPoint = CGPointMake(0, 0);
    //设置结束点
    gradientLayer.endPoint = CGPointMake(1, 1);
    //大小
    gradientLayer.frame = CGRectMake(0, 0, SC_WIDTH, SC_HEIGHT);
    [self.view.layer addSublayer:gradientLayer];

效果图如下:


    

注:左上角为(0,0)点,右下角为(1,1)点,可根据具体情况来设置相应的坐标点

2.通过绘制图片来实现:

添加枚举类型:

typedef NS_ENUM(NSUInteger, DYGradientType) {
    DYGradientTypeTopToBottom = 0,//从上到小
    DYGradientTypeLeftToRight = 1,//从左到右
    DYGradientTypeUpleftToLowright = 2,//左上到右下
    DYGradientTypeUprightToLowleft = 3,//右上到左下
};
添加静态方法:
+ (UIImage *)gradientColorImageFromColors:(NSArray*)colors gradientType:(DYGradientType)gradientType imgSize:(CGSize)imgSize;

实现静态方法
+ (UIImage *)gradientColorImageFromColors:(NSArray*)colors gradientType:(DYGradientType)gradientType imgSize:(CGSize)imgSize {
    NSMutableArray *ar = [NSMutableArray array];
    for(UIColor *c in colors) {
        [ar addObject:(id)c.CGColor];
    }
    UIGraphicsBeginImageContextWithOptions(imgSize, YES, 1);
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSaveGState(context);
    CGColorSpaceRef colorSpace = CGColorGetColorSpace([[colors lastObject] CGColor]);
    CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (CFArrayRef)ar, NULL);
    CGPoint start;
    CGPoint end;
    switch (gradientType) {
        case DYGradientTypeTopToBottom:
            start = CGPointMake(0.0, 0.0);
            end = CGPointMake(0.0, imgSize.height);
            break;
        case DYGradientTypeLeftToRight:
            start = CGPointMake(0.0, 0.0);
            end = CGPointMake(imgSize.width, 0.0);
            break;
        case DYGradientTypeUpleftToLowright:
            start = CGPointMake(0.0, 0.0);
            end = CGPointMake(imgSize.width, imgSize.height);
            break;
        case DYGradientTypeUprightToLowleft:
            start = CGPointMake(imgSize.width, 0.0);
            end = CGPointMake(0.0, imgSize.height);
            break;
        default:
            break;
    }
    CGContextDrawLinearGradient(context, gradient, start, end, kCGGradientDrawsBeforeStartLocation | kCGGradientDrawsAfterEndLocation);
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    CGGradientRelease(gradient);
    CGContextRestoreGState(context);
    CGColorSpaceRelease(colorSpace);
    UIGraphicsEndImageContext();
    return image;
}
使用:
 [UIColor colorWithRed:r/255.0 green:g/255.0 blue:b/255.0 alpha:1]
<pre name="code" class="objc">UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage(如果用的不是类别,此处为你的方法名) gradientColorImageFromColors:@[RGB_COLOR(199, 221, 253),RGB_COLOR(255, 255, 255)] gradientType:DYGradientTypeTopToBottom imgSize:CGSizeMake(SC_WIDTH, SC_HEIGHT)]];
    
imageView.frame = self.view.bounds;
[self.view addSubview:imageView];
 
 

效果图如下:第一张是小编要实现的效果图,第二张是为了增强效果设置的红黄蓝三色

   

 
 


3.两者对比分析:

第一种方法是直接在UIView的图层上添加一个渐变图层,相对而言是比较简单、轻量级的一种实现方法,第二种方法是通过在图层上绘制图片,然后根据画布生成图片,相对而言更容易控制显示效果,但相对于第一种稍显复杂。


  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值