2017-03-27 1 views
6

J'essaie d'utiliser un dégradé de 3 couleurs pour colorier mon texte dans Xcode et il est apparemment impossible d'obtenir les résultats que je recherche. J'ai eu du succès avec ce qui suit mais cela ne me donne que deux couleurs à travers le dégradé.Dégradé de couleurs multiples avec masque d'étiquettes dans Swift (Xcode)

@IBOutlet weak var textSample: UILabel! 

override func viewDidLoad() { 
    super.viewDidLoad() 
    textSample.textColor = UIColor(patternImage: gradientImage(size: textSample.frame.size, color1: CIColor(color: UIColor(red: 1.0, green: 1.0, blue: 1.0, alpha: 1.0)), color2: CIColor(color: UIColor(red: 1.0, green: 1.0, blue: 1.0, alpha: 0.2)))) 
} 

func gradientImage(size: CGSize, color1: CIColor, color2: CIColor) -> UIImage { 

    let context = CIContext(options: nil) 
    let filter = CIFilter(name: "CILinearGradient") 
    var startVector: CIVector 
    var endVector: CIVector 

    filter!.setDefaults() 

    startVector = CIVector(x: size.width * 0.5, y: 0) 
    endVector = CIVector(x: size.width * 0.5, y: size.height * 0.8) 

    filter!.setValue(startVector, forKey: "inputPoint0") 
    filter!.setValue(endVector, forKey: "inputPoint1") 
    filter!.setValue(color1, forKey: "inputColor0") 
    filter!.setValue(color2, forKey: "inputColor1") 

    let image = UIImage(cgImage: context.createCGImage(filter!.outputImage!, from: CGRect(x: 0, y: 0, width: size.width, height: size.height))!) 
    return image 
} 

Ce que je voudrais faire est d'avoir 3 emplacements avec trois couleurs:

location1: y:0.0 
location2: y:0.8 
location3: y:1.0 

color1: UIColour(red: 1, green: 1, blue: 1, alpha: 0.2) 
color2: UIColour(red: 1, green: 1, blue: 1, alpha: 1.0) 
color3: UIColour(red: 1, green: 1, blue: 1, alpha: 0.45) 

J'ai essayé de le simplifier en ajoutant simplement que gradient avec les 3 emplacements à un UIView, mais il semble que peu importe ce que je fais pour masquer cette UIView avec l'UILabel, rien ne fonctionne. Toute suggestion serait extrêmement utile. J'ai joint une image avec ce que je reçois avec mon code ci-dessus, et un exemple de ce que je voudrais réaliser si possible.

enter image description here

+0

Je suppose qu'il n'est pas trivial de le faire pour trois couches, mais vous avez réussi à le faire pour deux. Alors pourquoi ne pas diviser l'IUImage en deux, implémenter le dégradé pour les deux moitiés et ensuite rattacher? –

Répondre

2

Peut-être mieux choisir sera CAGradientLayer (AppCoda), puis l'ajouter à l'étiquette as described here. Voici un exemple:

var labelBackground = UIView(frame: label.frame) 
label.backgroundColor = UIColor.clear 
label.frame = label.bounds 
var gradLayer = CAGradientLayer() 
gradLayer.frame = labelBackground.layer.bounds 
gradLayer.colors = [UIColor(red: 1.0, green: 1.0, blue: 1.0, alpha: 1.0).CGColor, UIColor(red: 1.0, green: 1.0, blue: 1.0, alpha: 0.2).CGColor, UIColor(red: 1, green: 1, blue: 1, alpha: 0.45).CGColor] 
gradientLayer.locations = [0.0, 0.8, 1.0]  
labelBackground.layer.addSublayer(gradLayer) 
labelBackground.addSubview(label) 
view.addSubview(labelBackground) 
+0

Ceci permet de créer un rectangle avec le dégradé, dans un emplacement différent de l'étiquette d'origine et de déplacer l'étiquette d'origine en haut à gauche de l'écran. – mediarts