Lo strato sfumato da bianco a trasparente iOS è grigio

Ho un CAGradientLayer inserito nella parte inferiore di questa piccola visualizzazione dei dettagli che si apre nella parte inferiore dell'app. Come puoi vedere, ho impostato i colori da bianco a chiaro, ma c'è questa strana tinta di grigio che sta mostrando. Qualche idea?

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

Ecco la vista problematica:

clearColor ha un canale di colore nero con un alfa di 0, quindi ho dovuto usare

[UIColor colorWithWhite:1 alpha:0]

e funziona bene.

In Swift questo ha funzionato per me,

UIColor.white.withAlphaComponent(0).cgColor

Vale la pena sottolineare che qualsiasi altro colore funzionerà in questo modo ... utilizzando una combinazione delle due risposte sopra ...

Obiettivo 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)

Sintassi di Swift 3,

UIColor(white: 1, alpha: 0).cgColor

Le risposte di cui sopra come:

UIColor.white.withAlphaComponent(0).cgColor

e

UIColor(white: 1.0, alpha: 0.0).cgColor

dovrebbe funzionare in termini di rendere chiara una parte del gradiente (piuttosto che il grigio a cui si riferisce OP). Tuttavia, se stai ancora vedendo un bianco trasparente quando dovresti vedere un colore chiaro, assicurati che anche backgroundColorla vista a cui stai applicando il gradiente sia chiara.

Per impostazione predefinita, il colore di sfondo di quella vista sarà probabilmente bianco (o un colore scuro se il dispositivo è in modalità scura), quindi quando applichi il gradiente, la parte chiara sarà "bloccata" dalla vista backgroundColorstessa. Impostalo su chiaro e dovresti essere a posto.

Come molti, ho ancora ottenuto un colore grigio nonostante abbia usato un bianco trasparente.

Quindi ho cambiato il mio approccio e ho optato per una maschera piuttosto che un gradiente. Il risultato finale è lo stesso, beh, migliore, poiché questo funziona in tutte le situazioni, non solo se hai uno sfondo adatto.

Non ho provato questo codice con IB, ma spero che funzioni anche. Basta impostare backgroundColore sei a posto.

@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()
    }
}

Vale la pena notare che per gestire i gradienti bianco / nero (o davvero qualsiasi colore con aspetti chiari / scuri) basati sulla modalità chiaro / scuro in iOS 13, questo approccio funziona anche con i nuovi colori di sistema:

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