CGColor y CGColorSpace: qué es, modelos de color y cómo gestionarlos

¿Qué son CGColor y CGColorSpace?

CGColor es un objeto fundamental de Core Graphics que representa un color. La estructura CGColor almacena valores numéricos de componentes de color y una referencia a CGColorSpace — el espacio de color en el que se interpretan estos componentes. Sin estar vinculados a un espacio de color, los valores numéricos de los componentes no tienen significado: el valor (1.0, 0.0, 0.0) en RGB es rojo, pero en CMYK es cian.

CGColorSpace es un objeto que define un modelo de color y el rango de valores representables (gamut). El espacio de color establece las reglas mediante las cuales los componentes numéricos se convierten en un color visible en un dispositivo de salida específico. Core Graphics admite tanto espacios ICC estandarizados como espacios personalizados creados a través de CGColorSpace con tablas de transformación personalizadas.

La arquitectura que separa el color del espacio de color es una característica clave de Core Graphics que la distingue de las API donde el color se almacena como un simple conjunto de números. Este enfoque permite a Core Graphics realizar una gestión de color independiente del dispositivo: el mismo objeto CGColor puede mostrarse correctamente en diferentes pantallas gracias a la conversión automática de componentes a través del perfil CGColorSpace.

Cómo funcionan los colores en Core Graphics

Core Graphics implementa el color a través de un modelo basado en perfiles ICC (International Color Consortium). Cada CGColorSpace contiene una referencia a un perfil ICC — una descripción estandarizada de cómo los componentes de color se convierten a CIE XYZ — un espacio de color independiente del dispositivo. Esto permite a Core Graphics realizar una compensación colorimétrica automática entre diferentes pantallas.

Ciclo de vida de un objeto CGColor

Al crear un CGColor mediante la función CGColorCreate, los componentes se capturan del array pasado y se vinculan al CGColorSpace especificado. Core Graphics copia los componentes en una representación interna y crea una asociación con el espacio de color. Después de eso, el color está listo para usarse en cualquier operación gráfica — relleno, trazo, degradado, sombra.

Gestión del color a través de ColorSync

En macOS, la gestión del color se maneja a través del framework ColorSync, integrado en Core Graphics. ColorSync realiza un seguimiento de la calibración de la pantalla y convierte automáticamente los componentes del espacio de color de origen al espacio del dispositivo de destino. En iOS, la gestión del color se implementa a través de Quartz Core con soporte para una amplia gama de colores (Display P3), a partir del iPhone 7.

Modelos de color básicos en CGColorSpace

CGColorSpace admite cuatro modelos de color básicos: RGB (DeviceRGB, sRGB, Display P3), Gray (DeviceGray), CMYK (DeviceCMYK) y Lab. Cada modelo define el número y el significado de los componentes de color. RGB utiliza tres canales — rojo, verde, azul; Gray utiliza un canal de luminancia; CMYK utiliza cuatro canales para impresión; Lab utiliza tres canales: luminancia y dos componentes de diferencia de color.

DeviceRGB y sRGB

DeviceRGB es el espacio de color predeterminado más común de Core Graphics. Utiliza la gama de colores de una pantalla LCD estándar sin perfilado ICC. Al crear un contexto gráfico de UIView o NSView, Core Graphics asigna automáticamente DeviceRGB como espacio de color predeterminado. sRGB es una versión con perfil ICC con una gama y gamma fijas, recomendada para contenido web.

Display P3 — Amplia gama de colores

Display P3 es un espacio de color basado en el estándar DCI-P3, utilizado en dispositivos iOS modernos con pantallas de amplia gama cromática. Cubre aproximadamente un 25% más de colores visibles que sRGB, especialmente en las áreas verde y roja del espectro. Para trabajar con Display P3 en iOS, use la constante kCGColorSpaceDisplayP3, disponible desde iOS 9.3.

Creación y gestión de CGColor

CGColor se crea mediante la función CGColorCreate, que toma un CGColorSpace y un array de componentes CGFloat. El número de componentes depende del modelo de color: 1 para Gray, 3 para RGB, 4 para CMYK. Una vez creado, CGColor es un objeto inmutable — no se pueden cambiar sus componentes, solo crear un nuevo color.

Core Graphics también proporciona las funciones CGColorCreateGenericRGB, CGColorCreateGenericGray y CGColorCreateGenericCMYK para crear colores en espacios de color estándar (genéricos). Estas funciones simplifican el código eliminando la necesidad de crear explícitamente un CGColorSpace. Además, Quartz 2D define constantes para colores básicos: kCGColorWhite, kCGColorBlack, kCGColorClear.

Al crear un color, el orden de especificación de los componentes es importante — debe coincidir estrictamente con el orden de canales definido por el modelo de espacio de color. RGB: rojo (0.0–1.0), verde, azul, alfa (0.0–1.0). Gray: luminancia, alfa. CMYK: cian, magenta, amarillo, negro, alfa. Violar el orden de los componentes provoca una visualización incorrecta del color sin error de compilación.

Canal alfa y transparencia

El canal alfa es el cuarto componente (o segundo para Gray) que controla la transparencia del color. Un valor de 1.0 corresponde a opacidad total, 0.0 a transparencia total. El canal alfa en CGColor es opcional: la función CGColorGetAlpha devuelve el valor alfa actual, que por defecto es 1.0 al crearse mediante funciones básicas. Al mezclar colores, Core Graphics utiliza composición alfa según la regla Porter-Duff Source Over.

Trabajo con CGColorSpace

CGColorSpace se crea mediante las funciones de fábrica de Core Graphics: CGColorSpaceCreateDeviceRGB, CGColorSpaceCreateDeviceGray, CGColorSpaceCreateDeviceCMYK o CGColorSpaceCreateWithName para espacios con nombre (sRGB, Display P3, Generic Gray). El objeto CGColorSpace es inmutable y seguro para subprocesos — el mismo objeto puede usarse en múltiples contextos gráficos.

Obtención de CGColorSpace básicos

Core Graphics proporciona varios espacios de color predefinidos a través de constantes con nombre: kCGColorSpaceSRGB, kCGColorSpaceDisplayP3, kCGColorSpaceGenericGrayGamma2_2. Estas constantes se pasan a CGColorSpaceCreateWithName. Para dispositivos iOS con amplia gama de colores, se recomienda Display P3, ya que sRGB puede no utilizar completamente las capacidades de la pantalla.

Perfiles ICC y CGColorSpace personalizados

Los perfiles ICC son archivos estandarizados que describen las características cromáticas de un dispositivo. Core Graphics permite crear un CGColorSpace basado en un perfil ICC arbitrario mediante CGColorSpaceCreateWithICCProfile. Esto se utiliza en aplicaciones profesionales para impresión fotográfica y preimpresión donde se requiere una coincidencia precisa con una impresora o monitor específicos.

Conversión entre espacios de color

Core Graphics realiza la conversión entre espacios de color automáticamente durante el renderizado mediante las funciones CGContextSetFillColorWithColor o CGContextSetStrokeColorWithColor. Si el espacio de color del contexto gráfico difiere del espacio de color del CGColor pasado, Quartz 2D realiza la conversión utilizando los perfiles ICC de ambos espacios.

Para la conversión explícita de color, use CGColorCreateCopyByMatchingToColorSpace — una función que crea un nuevo CGColor cuyos componentes se recalculan del espacio de origen al espacio de destino. Según Apple Technical Note TN2313 (2024), al convertir de Display P3 a sRGB, los colores fuera de la gama sRGB se recortan, lo que resulta en pérdida de saturación. Esto es especialmente notable en tonos verdes y rojos brillantes.

ColorSync en macOS proporciona gestión de color a nivel de sistema en la pila gráfica. Si una aplicación no especifica un espacio de color explícito, Core Graphics utiliza el espacio de pantalla obtenido de ColorSync. Esto garantiza que los colores se vean igual en diferentes monitores, incluso si usan diferentes perfiles de color.

Ejemplos de código en Swift

Veamos ejemplos prácticos de creación y uso de CGColor y CGColorSpace en una aplicación iOS. El código está escrito en Swift utilizando funciones de Core Graphics.

Creación de CGColor con diferentes espacios de color

Este ejemplo muestra la creación de un color rojo en tres espacios de color diferentes. A pesar de tener los mismos componentes RGB, el color se verá diferente dependiendo de la gama del CGColorSpace.

import CoreGraphics

// Creando color en DeviceRGB
let rgbSpace = CGColorSpaceCreateDeviceRGB()
let redColor = CGColorCreate(rgbSpace, [1.0, 0.0, 0.0, 1.0])

// Creando color en Display P3
let p3Space = CGColorSpaceCreateWithName(kCGColorSpaceDisplayP3)
let p3RedColor = CGColorCreate(p3Space, [1.0, 0.0, 0.0, 1.0])

// Creando color gris
let graySpace = CGColorSpaceCreateDeviceGray()
let grayColor = CGColorCreate(graySpace, [0.5, 1.0])

Conversión de color entre espacios de color

Este ejemplo convierte un color verde brillante de Display P3 a sRGB. Durante dicha conversión, los colores fuera de la gama sRGB se adaptarán, lo que puede cambiar el tono.

let p3Space = CGColorSpaceCreateWithName(kCGColorSpaceDisplayP3)
let sRGBSpace = CGColorSpaceCreateWithName(kCGColorSpaceSRGB)

// Verde brillante en Display P3 (fuera de la gama sRGB)
let p3Green = CGColorCreate(p3Space, [0.0, 1.0, 0.0, 1.0])

// Convirtiendo a sRGB
let srgbGreen = CGColorCreateCopyByMatchingToColorSpace(
    sRGBSpace, p3Green, kCGRenderingIntentDefault
)

Uso de CGColor en un contexto gráfico

Este ejemplo demuestra el dibujo de un círculo relleno usando CGColor en un UIView personalizado. El método draw obtiene el contexto gráfico actual UIGraphicsGetCurrentContext, en el que se establece el color de relleno.

class ColorView: UIView {
    override func draw(rect: CGRect) {
        guard let ctx = UIGraphicsGetCurrentContext()
        else { return }

        let rgbSpace = CGColorSpaceCreateDeviceRGB()
        let blueColor = CGColorCreate(
            rgbSpace,
            [0.2, 0.4, 1.0, 1.0]
        )

        ctx.setFillColor(blueColor)
        ctx.fillEllipse(in: CGRect(x: 50, y: 50,
                                  width: 200, height: 200))
    }
}