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