呃,圖拿錯(cuò)了 = =
回到正題 ----> 項(xiàng)目中偶爾會(huì)遇到cell背景漸變或者view背景漸變的界面需求,偷懶解決的方法就是讓UI妹紙給切個(gè)圖拿來就用植榕。但是如果項(xiàng)目中需要的漸變色比較多的話蛛芥,顯然切圖是很不合適的,也容易使得項(xiàng)目的體積冗余伏伐。
創(chuàng)建一個(gè)背景View,重寫drawRect方法
關(guān)于CGContextRef有一篇博客介紹的還不錯(cuò) - 傳送門---其中原博中的有些方法因版本過久被廢棄了晕拆,修改了之后的Demo.
- (void)drawRect:(CGRect)rect {
// Drawing code
CGContextRef context = UIGraphicsGetCurrentContext();
CGColorSpaceRef colorSpaceRef = CGColorSpaceCreateDeviceRGB();
// 創(chuàng)建起點(diǎn)的顏色
CGColorRef beginColor = CGColorCreate(colorSpaceRef, (CGFloat[]){1.0f,1.0f,1.0f,1.0f});
CGColorRef endColor = CGColorCreate(colorSpaceRef, (CGFloat[]){0.83f, 0.83f, 0.83f, 1.0f});
CGRect paperRect = self.bounds;
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGFloat locations[] = {0.0,1.0};
NSArray *colors = [NSArray arrayWithObjects:(__bridge id)beginColor,(__bridge id)endColor, nil];
CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (CFArrayRef)CFBridgingRetain(colors), locations);
CGPoint startPoint = CGPointMake(CGRectGetMidX(rect), CGRectGetMinY(rect));
CGPoint endPoint = CGPointMake(CGRectGetMidX(rect), CGRectGetMaxY(rect));
CGContextSaveGState(context);
CGContextAddRect(context, rect);
CGContextClip(context);
CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0);
CGContextRestoreGState(context);
CGGradientRelease(gradient);
CGColorSpaceRelease(colorSpace);
// add line stroke
CGRect strokeRect = CGRectInset(paperRect, 5.0, 5.0);
CGColorRef lineColor = CGColorCreate(colorSpaceRef, (CGFloat[]){0.81,0.43,0.99,1.0f});
CGContextSetStrokeColorWithColor(context, lineColor);
CGContextSetLineWidth(context, 0.5);
CGContextStrokeRect(context, strokeRect);
}
- 然后將
cell.backgroundView
設(shè)置為我們創(chuàng)建的漸變View就可以了藐翎。
制作成GIF圖后會(huì)感覺有些分層,實(shí)際中并沒有
- 還有一個(gè)漸變的寫法实幕,導(dǎo)入類庫quartcore并#import <QuartzCore/QuartzCore.h>吝镣,這個(gè)就不屬于在context上畫,而是將圖層插入到view層上面昆庇。那么這里就涉及到Quartz Core 圖層編程了赤惊。
CAGradientLayer *_gradientLayer = [CAGradientLayer layer];
_gradientLayer.bounds = cell.contentView.bounds;
_gradientLayer.borderWidth = 0;
_gradientLayer.frame = cell.contentView.bounds;
_gradientLayer.colors = [NSArray arrayWithObjects:
(id)[[UIColor clearColor] CGColor],
(id)[[UIColor blackColor] CGColor],nil];
_gradientLayer.startPoint = CGPointMake(0.5, 0.5);
_gradientLayer.endPoint = CGPointMake(0.5, 1.0);
[cell.contentView.layer insertSublayer:_gradientLayer atIndex:0];
這個(gè)漸變的就比較刺眼了。凰锡。未舟。當(dāng)然尺寸小的話視覺效果還是不錯(cuò)的
具體可以查看上面的[Demo](https://github.com/zHfUmR/CGContextRefTest)