UIKit和Core Graphics绘图——构造路径，阴影以及渐变扩展

构造路径

通常，一系列点组合一起构成一个形状，而若干个形状组合在一起可以构造一个路径，路径可以规则也可以不规则，随意组合。通过Core Graphics很容易管理路径。

主要用到的函数或方法：

CGPathCreateMutable() 创建可变路径的方法

CGContextAddPath 将路径加入到上下文中

CGContextDrawPath绘制路径

CGPathRelease 路径也需要释放

用路径画一组对角线

- (void)drawRect:(CGRect)rect{    // Drawing code    [self drawTwoLines];}- (void)drawTwoLines{    CGRect screenRect = [[UIScreen mainScreen] bounds];        CGMutablePathRef path = CGPathCreateMutable();    CGPathMoveToPoint(path, NULL, screenRect.origin.x, screenRect.origin.y);    CGPathAddLineToPoint(path, NULL, screenRect.size.width, screenRect.size.height);    CGPathMoveToPoint(path, NULL, screenRect.size.width, screenRect.origin.y);    CGPathAddLineToPoint(path, NULL, screenRect.origin.x, screenRect.size.height);        CGContextRef context = UIGraphicsGetCurrentContext();    CGContextAddPath(context, path);    CGContextSetLineWidth(context, 1.0f);    [[UIColor blueColor] setStroke];    CGContextDrawPath(context, kCGPathStroke);      //第二个参数为画路径的样式，这里为描线，也可以有填充或者既描线也填充        CGPathRelease(path);}

效果

绘制多个矩形

- (void)drawRect:(CGRect)rect{    // Drawing code    //[self drawTwoLines];    [self drawTwoRects];}- (void)drawTwoRects{    CGMutablePathRef path = CGPathCreateMutable();        CGRect rect1 = CGRectMake(20, 20, 200, 100);    CGRect rect2 = CGRectMake(20, 200, 200, 80);    CGRect rects[] = {rect1, rect2};        CGPathAddRects(path, NULL, (const CGRect *)rects, 2);        CGContextRef context = UIGraphicsGetCurrentContext();    CGContextAddPath(context, path);    CGContextSetLineWidth(context, 2.0f);        [[UIColor yellowColor] setFill];    //填充颜色    [[UIColor blackColor] setStroke];   //线条颜色        CGContextDrawPath(context, kCGPathFillStroke);  //设置既填充也描线        CGPathRelease(path);}

效果

绘制阴影

使用上下文绘制阴影主要用到两个函数

CGContextSetShadow（）

三个参数，图形上下文，偏移量（CGSize），模糊值。

CGContextSetShadowWithColor（）

增加了一个参数，CGColorRef可以设置阴影的颜色

- (void)drawTwoRectsWithShadow{    CGMutablePathRef path = CGPathCreateMutable();        CGRect rect1 = CGRectMake(55, 60, 150, 150);    CGPathAddRect(path, NULL, rect1);        CGContextRef context = UIGraphicsGetCurrentContext();    CGContextAddPath(context, path);    CGContextSetShadowWithColor(context, CGSizeMake(10, 10), 20.0f, [[UIColor grayColor] CGColor]);    [[UIColor purpleColor] setFill];    CGContextDrawPath(context, kCGPathFill);    CGPathRelease(path);        CGMutablePathRef path2 = CGPathCreateMutable();        CGRect rect2 = CGRectMake(130, 290, 100, 100);    CGPathAddRect(path2, NULL, rect2);    CGContextAddPath(context, path2);    [[UIColor yellowColor] setFill];    CGContextDrawPath(context, kCGPathFill);        CGPathRelease(path2);}

由于我们没有对上下文SaveGState和Restore所以，绘制出来的两个矩形都会有阴影

渐变扩展

上篇文章的线性渐变使用的是CGGradientsCreateWithColors函数，这里我们使用细化到颜色成分构成的函数来进行CGGradientRef的初始化：

CGGradientCreateWithColorComponents

这里比之前函数增加了一个参数，元素数量，而且传入颜色数组也变为了颜色构成的数组。

如果想知道一个颜色比如[UIColor purpleColor]具体构成，可以调用CGColorGetComponents来获取其构成，返回一个数组，包括R,G,B以及alpha的值。

- (void)drawingGradient{    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();    CGGradientRef gradient = CGGradientCreateWithColorComponents(colorSpace, (CGFloat[]){        0.8, 0.2, 0.2, 1.0,        0.2, 0.8, 0.2, 1.0,        0.2, 0.2, 0.8, 1.0    }, (CGFloat[]){        0.0, 0.5, 1.0    }, 3);        CGContextRef context = UIGraphicsGetCurrentContext();    CGContextSaveGState(context);    CGContextDrawLinearGradient(context, gradient, CGPointMake(100, 200), CGPointMake(220, 280), 0);        CGContextRestoreGState(context);    CGGradientRelease(gradient);    CGColorSpaceRelease(colorSpace);}

调用这个函数的效果：

下面我们可以试图修改DrawLinearGradient函数的最后一个参数值来让渐变后边缘颜色扩展到整个屏幕。

    //CGContextDrawLinearGradient(context, gradient, CGPointMake(100, 200), CGPointMake(220, 280), 0);    CGContextDrawLinearGradient(context, gradient, CGPointMake(100, 200), CGPointMake(220, 280), kCGGradientDrawsBeforeStartLocation | kCGGradientDrawsAfterEndLocation);

然后就变成了这样

比较丑，凑合看吧- -

以上为本篇文章全部内容，欢迎指正和交流。转载注明出处~