CGContextDrawLinearGradient confusion. Need clarification

| | August 4, 2015

I am have been experimenting with CGContextDrawLinearGradient and I terribly confused with what start point and end point mean? I thought they mean coordinates on the current CGContext so if I define start point to be 0,0 and end point to be 100,100, i would get a square with gradient. I get something else altogether that I just cannot connect to my co-ordinates.

This is the code that I have:

- (void)drawRect:(CGRect)rect {
// Drawing code 
CGContextRef current_context = UIGraphicsGetCurrentContext();
CGContextSaveGState(current_context);

// Gradient
CGFloat locations[3] = {0.0, 0.5, 1.0};
CGFloat components[12] = {1.0, 0.0, 0.0, 1.0, 1.0, 1.0, 0.0, 1.0, 0.0, 1.0, 0.0, 1.0};
CGColorSpaceRef colorspace = CGColorSpaceCreateDeviceRGB();
CGGradientRef gradient = CGGradientCreateWithColorComponents(colorspace, components, locations, 3);
CGPoint startPoint = CGPointMake(0, 0);
CGPoint endPoint = CGPointMake(40, 40);
CGContextDrawLinearGradient(current_context, gradient, startPoint, endPoint, 0);


// Shadow
CGContextSetShadow(current_context, CGSizeMake(4,7), 1.0);

// Image
UIImage *logoImage = [UIImage imageNamed:@"logo.png"];
[logoImage drawInRect:bounds];
CGContextRestoreGState(current_context);

}

Thanks for your help in advance..

One Response to “CGContextDrawLinearGradient confusion. Need clarification”

  1. code from raywanderlich tutorial

    override func drawRect(rect: CGRect) {
    
      //2 - get the current context
      let context = UIGraphicsGetCurrentContext()
      let colors = [startColor.CGColor, endColor.CGColor]
    
      //3 - set up the color space
      let colorSpace = CGColorSpaceCreateDeviceRGB()
    
      //4 - set up the color stops
      let colorLocations:[CGFloat] = [0.0, 1.0]
    
      //5 - create the gradient
      let gradient = CGGradientCreateWithColors(colorSpace, 
                                                colors, 
                                                colorLocations)
    
      //6 - draw the gradient
      var startPoint = CGPoint.zeroPoint
      var endPoint = CGPoint(x:0, y:self.bounds.height)
      CGContextDrawLinearGradient(context, 
                                  gradient, 
                                  startPoint, 
                                  endPoint, 
                                  0)
    }
    

Leave a Reply