web-dev-qa-db-fra.com

la couche de dégradé blanc à transparent d'iOS est grise

J'ai un CAGradientLayer inséré au bas de cette petite vue de détail qui apparaît au bas de l'application. Comme vous pouvez le constater, j'ai réglé les couleurs de blanc à clair, mais cette étrange teinte grise apparaît. Des idées?

    // 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];

Voici la vue problématique:

 Here is the problematic view

66
Eric Gao

clearColor a un canal de couleur noir avec un alpha de 0, donc je devais utiliser 

[UIColor colorWithWhite:1 alpha:0]

et ça marche bien.

153
Eric Gao

Dans Swift Cela a fonctionné pour moi,

UIColor.white.withAlphaComponent(0).cgColor
40
Zaid Pathan

Il est intéressant de noter que toute autre couleur fonctionnera comme ceci ... en combinant les deux réponses ci-dessus ....

Objectif 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)
15
Magoo

Syntaxe rapide 3,

UIColor(white: 1, alpha: 0).cgColor
11
Stuart Casarotto

Comme beaucoup, j'ai toujours une couleur grise malgré l'utilisation d'un blanc clair.

J'ai donc changé d'approche et j'ai opté pour un masque plutôt que pour un dégradé. Le résultat final est le même, bon, meilleur, puisque celui-ci fonctionne dans toutes les situations, pas seulement si vous avez un fond approprié.

Je n'ai pas essayé ce code avec IB, mais j'espère que cela fonctionnera aussi . Il suffit de mettre backgroundColor et vous êtes prêt à partir.

@IBDesignable
class FadingView: UIView {

    @IBInspectable var startLocation: Double =   0.05 { didSet { updateLocations() }}
    @IBInspectable var endLocation:   Double =   0.95 { didSet { updateLocations() }}
    @IBInspectable var horizontalMode:  Bool =  false { didSet { updatePoints() }}
    @IBInspectable var diagonalMode:    Bool =  false { didSet { updatePoints() }}
    @IBInspectable var invertMode:      Bool =  false { didSet { updateColors() }}

    private let gradientLayerMask = CAGradientLayer()

    private func updatePoints() {
        if horizontalMode {
            gradientLayerMask.startPoint = diagonalMode ? CGPoint(x: 1, y: 0) : CGPoint(x: 0, y: 0.5)
            gradientLayerMask.endPoint   = diagonalMode ? CGPoint(x: 0, y: 1) : CGPoint(x: 1, y: 0.5)
        } else {
            gradientLayerMask.startPoint = diagonalMode ? CGPoint(x: 0, y: 0) : CGPoint(x: 0.5, y: 0)
            gradientLayerMask.endPoint   = diagonalMode ? CGPoint(x: 1, y: 1) : CGPoint(x: 0.5, y: 1)
        }
    }

    private func updateLocations() {
        gradientLayerMask.locations = [startLocation as NSNumber, endLocation as NSNumber]
    }

    private func updateSize() {
        gradientLayerMask.frame = bounds
    }

    private func updateColors() {
        gradientLayerMask.colors = invertMode ? [UIColor.white.cgColor, UIColor.clear.cgColor] : [UIColor.clear.cgColor, UIColor.white.cgColor]
    }

    private func commonInit() {
        layer.mask = gradientLayerMask
    }

    override init(frame: CGRect) {
        super.init(frame: frame)
        commonInit()
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        commonInit()
    }

    override func layoutSubviews() {
        super.layoutSubviews()
        updatePoints()
        updateLocations()
        updateSize()
        updateColors()
    }
}
0
AncAinu

Il est intéressant de noter que pour gérer les dégradés blanc/noir (ou toutes les couleurs d'apparence claire/sombre) basés sur le mode clair/sombre dans iOS 13, cette approche fonctionne également avec les nouvelles couleurs système:

gradientLayer.colors = [
    UIColor.systemBackground.cgColor,
    UIColor.systemBackground.withAlphaComponent(0).cgColor] 
0
Jake