Applicazione del gradiente per UIImage Smoothly

Question

Sto provando ad applicare il gradiente a UIImage usando CoreGraphic; tuttavia, il risultato che ho ottenuto non è molto bello. Voglio creare una sfumatura da nero a trasparente nella parte inferiore dell'immagine per creare un contrasto per me per posizionare del testo. Tuttavia, il gradiente che ero in grado non si sposa bene con l'immagine; è possibile vedere chiaramente la separazione al centro. Il risultato che sto cercando è come questa applicazione: http://capptivate.co/2014/02/17/yummly-3/ Come devo applicare il gradiente per raggiungere questo obiettivo? (Devo applicare questo a grandi quantità di immagini).

Il mio risultato:

Ecco il mio codice:

func imageWithGradient(img:UIImage!) -> UIImage{ 

    UIGraphicsBeginImageContext(img.size) 
    var context = UIGraphicsGetCurrentContext() 

    img.drawAtPoint(CGPointMake(0, 0)) 

    let colorSpace = CGColorSpaceCreateDeviceRGB() 
    let locations:[CGFloat] = [0.50, 1.0] 
    //1 = opaque 
    //0 = transparent 
    let bottom = UIColor(red: 0, green: 0, blue: 0, alpha: 0.5).CGColor 
    let top = UIColor(red: 0, green: 0, blue: 0, alpha: 0).CGColor 

    let gradient = CGGradientCreateWithColors(colorSpace, 
     [top, bottom], locations) 


    let startPoint = CGPointMake(img.size.width/2, 0) 
    let endPoint = CGPointMake(img.size.width/2, img.size.height) 

    CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0) 

    let image = UIGraphicsGetImageFromCurrentImageContext() 

    UIGraphicsEndImageContext() 

    return image 
} 

Answer 1

ho provato questo fuori in un parco giochi Swift, non ho potuto replicare il problema esatta che stai descrivendo, però ecco alcuni suggerimenti che potresti provare.

Si può cambiare il modo in cui si impostano le fermate nel gradiente, penso che avrebbe più senso invece di spostare il gradiente usando gli stop, spostare il punto di partenza, cioè invece di partire dal bordo superiore, iniziare dal centro verticale, qualcosa di simile

UIGraphicsBeginImageContext(image.size) 
var context = UIGraphicsGetCurrentContext() 

image.drawAtPoint(CGPointMake(0, 0)) 

let colorSpace = CGColorSpaceCreateDeviceRGB() 
let locations:[CGFloat] = [0.0, 1.0] 
let bottom = UIColor(red: 0, green: 0, blue: 0, alpha: 0.5).CGColor 
let top = UIColor(red: 0, green: 0, blue: 0, alpha: 0).CGColor 

let gradient = CGGradientCreateWithColors(colorSpace, 
       [top, bottom], locations) 

let startPoint = CGPointMake(image.size.width/2, image.size.height/2) 
let endPoint = CGPointMake(image.size.width/2, image.size.height) 
CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0) 

let finalImage = UIGraphicsGetImageFromCurrentImageContext() 
UIGraphicsEndImageContext() 

posizioni Privacy è ora 0 e 1, mentre il startPoint coordinata y si è spostata verso il basso.

In alternativa, guardare il passaggio kCGGradientDrawsBeforeStartLocation come un'opzione a CGContextDrawLinearGradient, in quanto ciò potrebbe anche fare la differenza.

Answer 2

SWIFT 3

func imageWithGradient(img:UIImage!) -> UIImage { 

    UIGraphicsBeginImageContext(img.size) 
    let context = UIGraphicsGetCurrentContext() 

    img.draw(at: CGPoint(x: 0, y: 0)) 

    let colorSpace = CGColorSpaceCreateDeviceRGB() 
    let locations:[CGFloat] = [0.0, 1.0] 

    let bottom = UIColor(red: 0, green: 0, blue: 0, alpha: 0.5).cgColor 
    let top = UIColor(red: 0, green: 0, blue: 0, alpha: 0).cgColor 

    let colors = [top, bottom] as CFArray 

    let gradient = CGGradient(colorsSpace: colorSpace, colors: colors, locations: locations) 

    let startPoint = CGPoint(x: img.size.width/2, y: 0) 
    let endPoint = CGPoint(x: img.size.width/2, y: img.size.height) 

    context!.drawLinearGradient(gradient!, start: startPoint, end: endPoint, options: CGGradientDrawingOptions(rawValue: UInt32(0))) 

    let image = UIGraphicsGetImageFromCurrentImageContext() 

    UIGraphicsEndImageContext() 

    return image! 
}