Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

iOS White to Transparent Gradient Layer is Gray

I have a CAGradientLayer inserted to the bottom of this small detail view that pops up at the bottom of the app. As you can see, I've set the colors from white to clear, but there's this strange gray tint that is showing up. Any ideas?

    // Set up detail view frame and gradient
    [self.detailView setFrame:CGRectMake(0, 568, 320, 55)];

    CAGradientLayer *layer = [CAGradientLayer layer];
    layer.frame = self.detailView.bounds;
    layer.colors = [NSArray arrayWithObjects:(id)[UIColor whiteColor].CGColor, (id)[UIColor clearColor].CGColor, nil];
    layer.startPoint = CGPointMake(1.0f, 0.7f);
    layer.endPoint = CGPointMake(1.0f, 0.0f);
    [self.detailView.layer insertSublayer:layer atIndex:0];

Here is the problematic view:

Here is the problematic view

like image 525
Eric Gao Avatar asked Jul 22 '14 08:07

Eric Gao


3 Answers

clearColor has a black color channel with an alpha of 0, so I had to use

[UIColor colorWithWhite:1 alpha:0]

and it works fine.

like image 178
Eric Gao Avatar answered Nov 06 '22 10:11

Eric Gao


In Swift This worked for me,

UIColor.white.withAlphaComponent(0).cgColor
like image 63
Mohammad Zaid Pathan Avatar answered Nov 06 '22 11:11

Mohammad Zaid Pathan


Worth pointing out that any other colour will work like this... using a combination of the two answers above....

Objective C

UIColor *colour = [UIColor redColor];
NSArray *colourArray = @[(id)[colour colorWithAlphaComponent:0.0f].CGColor,(id)colour.CGColor]
NSArray *locations = @[@0.2,@0.8];

CAGradientLayer *gradientLayer = [CAGradientLayer layer];
gradientLayer.colors = colourArray;
gradientLayer.locations = locations;
gradientLayer.frame = self.frame;

[self.layer addSublayer:gradientLayer];

Swift 3

let colour:UIColor = .red
let colours:[CGColor] = [colour.withAlphaComponent(0.0).cgColor,colour.cgColor]
let locations:[NSNumber] = [0.2,0.8]

let gradientLayer = CAGradientLayer()
gradientLayer.colors = colours
gradientLayer.locations = locations
gradientLayer.frame = frame

layer.addSublayer(gradientLayer)
like image 21
Magoo Avatar answered Nov 06 '22 11:11

Magoo