Swift 2.1: location y distribución de color CAGradientLayer

Mi necesidad es mostrar la distribución de 3 colors en una vista. Entonces estoy usando el siguiente código.

func drawWithGradientLayer() { // total contains sum of all values contained in segmentValues variable. // I'm using green -> Orange -> Red colors as colors if total == 0 { return } if gradientLayer.superlayer != nil { gradientLayer.removeFromSuperlayer() } var previous: CGFloat = (CGFloat(segmentValues[0])/CGFloat(total)) var locations: [NSNumber] = [previous] for var i=1; i<segmentValues.count; i++ { previous = previous + (CGFloat(segmentValues[i])/CGFloat(total)) locations.append(previous) } locations.append(1.0) // Line may need to be commented gradientLayer = CAGradientLayer() gradientLayer.frame = CGRectMake(0, 0, self.bounds.size.width, self.bounds.size.height) gradientLayer.startPoint = CGPointMake(0.0, 0.5); gradientLayer.endPoint = CGPointMake(1.0, 0.5); gradientLayer.colors = colors gradientLayer.locations = locations self.layer.insertSublayer(gradientLayer, atIndex: 0) } 

Pero el problema es que los colors degradados no se distribuyen de acuerdo con mis requisitos. Por ejemplo, si tengo valores de [1,0,1], la barra debería mostrar 50% rojo y 0% naranja y 50% rojo. Si los valores son [0,0,1], entonces solo se debe dibujar el color rojo. ¿Cómo puedo lograr esto sin líneas de cuadrícula? introduzca la descripción de la imagen aquí

cualquier otra mejor solución siempre será apreciada 🙂

La key aquí es entender cómo funcionan las locations en CAGradientLayer:

Las paradas de gradiente se especifican como valores entre 0 y 1. Los valores deben estar aumentando monótonamente.

Por lo tanto, no puede especificar ubicaciones como [1, 0, 1] , sino que debe usar algo como [0.0, 0.33, 0.67, 1.0] , y el número de valores de location debe ser el mismo que el de sus colors .

Para hacer un degradado con transiciones de color cortas como en las imágenes, debe repetir cada color dos veces y especificar las ubicaciones apropiadas: gradientes

Entonces su código debería ser algo así como:

  gradientLayer.colors = [ UIColor.greenColor().CGColor, UIColor.greenColor().CGColor, UIColor.orangeColor().CGColor, UIColor.orangeColor().CGColor, UIColor.networkingColor().CGColor, UIColor.networkingColor().CGColor ] gradientLayer.startPoint = CGPoint(x: 0.0, y: 0.5) gradientLayer.endPoint = CGPoint(x: 1.0, y: 0.5) gradientLayer.locations = [0.0, 0.2, 0.3, 0.7, 0.8, 1.0] 

Si desea get un degradado de 2 colors mientras no cambia sus colors, puede establecer un valor menor que 0 para startPoint.x o superior a 1 para endPoint.x , y establecer múltiples ubicaciones a cero, por ejemplo:

  gradientLayer.startPoint = CGPoint(x: -0.01, y: 0.5) gradientLayer.endPoint = CGPoint(x: 1.0, y: 0.5) gradientLayer.locations = [0.0, 0.0, 0.0, 0.0, 0.1, 1.0] 

que daría un resultado similar a esto:

Gradiente de 2 colores