Drawing a simple linear gradient inside a rect that is inside a view

Question

I'm reading the documentation about gradients and I'm a little bit lost. I have a view, and inside that view, I just want to draw a simple black to gray linear gradient inside a rect (smaller than the view), from bottom to top. How may I do that without subclassing anything (I've read many things that need to subclass the view)?

I'm searching a way to do this as simple as I've ever done on various platforms. Something like (language free :-) ) :

blackcolor = MakeBlack();
whiteColor = MakeWhite();

startPoint = MakeStartPoint();
endPoint = MakeEndPoint();

onthisgraphicport = SetGraphicPort(self.view);
clippingRect = MakeClipRect();

DrawGradient(from:whiteColor, to:blackcolor, from:startPoint, to:endPoint, onthisgraphicport, intoThisRect:clippingRect);

Thank you for your help.

possible duplicate of [Gradients on UIView and UILabels On iPhone](http://stackoverflow.com/questions/422066/gradients-on-uiview-and-uilabels-on-iphone). See the answer by @Mirko with a lot of votes. If you want it to be smaller than the view, then set the frame of the gradient layer to be smaller (think of the gradient layer as a subview of your view). — Anurag, Feb 12 '11 at 02:45
@Anurag : no, the foirst solution inserts a subLayer, and I don't want to insert anything, just... draw... and the second giver solution acts into drawRect, and I'm not there... I have a rect into a view inside wich I want t draw a gradient. — Oliver, Feb 12 '11 at 18:16
I don't understand what you mean by not inserting anything, *and* not using `drawRect`. You will have to do *something* to get the gradient, it won't magically show up on it's own. — Anurag, Feb 12 '11 at 21:27
@Anurag : As far as I've seen, any langage allow you to draw things into a "drawing rect" or anything that can be called a view. You say "I want to draw THIS line (2 points) into THIS graphic port", and it's done. No need to subclass anything, no need to insert layers, or view, or anything like this. Even old Mac programming could do that. Is Cocoa programming such complicated that it does not allow to do so simple things ? I'm searching something like : onthisgraphicport = SetGraphicPort(self.view); DrawGradient(FromWhite, ToBlack, fromThere, toThere, onthisgraphicport); — Oliver, Feb 13 '11 at 00:05

score 5 · Accepted Answer · answered Feb 12 '11 at 21:17

This code snippet might help. I found the code some time ago on the web. Unfortunately, I forgot the site, so not sure whom to give credit.

The code as is draws a white to black gradient. Just change the rect and the colors to your needs.

@interface MyView : UIView {
    CGGradientRef _gradientRef;
}

@end

@implementation MyView

- (void) dealloc
{
    [super dealloc];
}

- (id) initWithFrame:(CGRect)frame {
    if ((self = [super initWithFrame:frame])) {
        CGColorSpaceRef rgb = CGColorSpaceCreateDeviceRGB();
        CGFloat colors[] =
        {
            1.0f, 1.0f, 1.0f, 1.0f,
            0.0f, 0.0f, 0.0f, 1.0f,
        };
        _gradientRef = CGGradientCreateWithColorComponents(rgb, colors, NULL, sizeof(colors) / (sizeof(colors[0]) * 4));
        CGColorSpaceRelease(rgb);
    }

    return self;
}

- (void) drawRect:(CGRect)rect {
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGPoint start = rect.origin;
    start.y = 0;
    CGPoint end = CGPointMake(rect.origin.x, rect.size.height);
    CGContextDrawLinearGradient(context, _gradientRef, start, end, kCGGradientDrawsBeforeStartLocation | kCGGradientDrawsAfterEndLocation);

    [super drawRect:rect];
}

@end

This does not draw anything. You are inside a drawRect method subclassing UIView. So it draws into the rect of the view. But how do you make this work outside the View. I saw many of these sample code and it's the reason why I asked for a way to do this without subclassing. — Oliver, Feb 13 '11 at 00:00
The code I posted certainly draws a gradient. The idea was that you create a gradient view with [MyView alloc] initWithFrame:...] and then add this view to your view as a subview. Which will work. What you are trying to achieve (I guess) is to get the graphics context of a view and draw into that. As far as I know this is not possible (please correct me if I'm wrong). — cutemachine, Feb 13 '11 at 20:31
as far as I know and as I've read, it seems not possible. An incredible thing ! If you have to create on the fly something to draw, that couldn't be though by advance, so how do you do ? Is it possible to create a subclass of UIView and override drawrect on the fly ??? — Oliver, Feb 13 '11 at 20:45

Drawing a simple linear gradient inside a rect that is inside a view

1 Answers1