How do I apply an opacity gradient on a UIView?

Question

I would like my UIView to fade from 100% opacity to 0% opacity. Any thoughts on how I can do this?

Is its background dynamically-rendered, or a static background image? — BoltClock, Jan 21 '11 at 13:55
Its on some text: https://skitch.com/sidwynkoh/rkxar/main.psd-66.7-other-results-layer-mask-8 — Sidwyn Koh, Jan 21 '11 at 14:01

score 3 · Answer 1 · answered Jan 21 '11 at 14:10

Ray Wenderlich has a great tutorial on setting gradients for objects. My suggestion is to modify the following code to suit your needs.

//Ray's code:
void drawLinearGradient(CGContextRef context, CGRect rect, CGColorRef startColor, 
    CGColorRef  endColor) {
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGFloat locations[] = { 0.0, 1.0 };

    NSArray *colors = [NSArray arrayWithObjects:(id)startColor, (id)endColor, nil];

    CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, 
        (CFArrayRef) 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);
}

score 1 · Accepted Answer · edited May 23 '17 at 09:58

1

If the view, together with its labels, is sitting on some static background image or color, a quick and dirty trick is to create gradient PNGs of that image or color and place them over the view.

Otherwise, see if you can adapt this CALayer gradient mask solution for your view.

edited May 23 '17 at 09:58

Community

1
1

answered Jan 21 '11 at 14:08

BoltClock

700,868
160
1,392
1,356

How do I apply an opacity gradient on a UIView?

2 Answers2