在Quard 2D中使用gradient绘制arrow。

draw-arrow-with-gradient.mm

- (void)drawRect:(CGRect)rect
{
    // assume the background color is white
    
    CGContextRef con = UIGraphicsGetCurrentContext();
    CGContextSaveGState(con);
    
    // punch triangle hole in context clipping region
    CGContextMoveToPoint(con, 90, 100);
    CGContextAddLineToPoint(con, 100, 90);
    CGContextAddLineToPoint(con, 110, 100);
    CGContextClosePath(con);
    CGContextAddRect(con, CGContextGetClipBoundingBox(con));
    CGContextEOClip(con);
    
    // draw the vertical line, add its shape to the clipping region
    CGContextMoveToPoint(con, 100, 100);
    CGContextAddLineToPoint(con, 100, 19);
    CGContextSetLineWidth(con, 20);
    CGContextReplacePathWithStrokedPath(con); // 相当于取得前面定义的路径的外轮廓。
    CGContextClip(con);
    
    // draw the gradient
    CGFloat locs[3] = {0., .5, 1.};
    CGFloat colors[12] = {
        .3, .3, .3, .8, // starting color
        .0,.0,.0,1.0,   // intermediate color
        .3, .3, .3, .8  // ending color
    };
    CGColorSpaceRef sp = CGColorSpaceCreateDeviceGray();
    CGGradientRef grad = CGGradientCreateWithColorComponents(sp, colors, locs, 3);
    CGContextDrawLinearGradient(con, grad, CGPointMake(89, 0), CGPointMake(111, 0), 0);
    CGColorSpaceRelease(sp);
    CGGradientRelease(grad);
    
    CGContextRestoreGState(con);
    
    // draw the red triangle, the point of the arrow
    CGContextSetFillColorWithColor(con, [[UIColor redColor] CGColor]);
    CGContextMoveToPoint(con, 80, 25);
    CGContextAddLineToPoint(con, 100, 0);
    CGContextAddLineToPoint(con, 120, 25);
    CGContextFillPath(con);
}