Color ancho en Xamarin.iOS

  • Artículo
  • 8 minutos para leer

En este artículo se trata el color ancho y cómo se puede usar en una aplicación Xamarin.iOS o Xamarin.Mac.

iOS 10 y macOS Sierra mejora la compatibilidad con formatos de píxeles de intervalo extendido y espacios de color de gama amplia en todo el sistema, incluidos marcos como Core Graphics, Core Image, Metal y AVFoundation. La compatibilidad con dispositivos con pantallas de color ancho se facilita aún más al proporcionar este comportamiento en toda la pila de gráficos.

Catálogos de recursos

Compatibilidad con Wide Color con catálogos de recursos

En iOS 10 y macOS Sierra, Apple ha ampliado los catálogos de recursos que se usan para incluir y clasificar el contenido de imágenes estáticas en el paquete de la aplicación para admitir un color ancho.

El uso de catálogos de recursos proporciona las siguientes ventajas a una aplicación:

  • Proporcionan la mejor opción de implementación para los recursos de imagen estática.
  • Admiten la corrección automática del color.
  • Admiten la optimización automática del formato de píxeles.
  • Admiten lalicación de aplicaciones y la simplificación de aplicaciones, lo que garantiza que solo el contenido pertinente se entregue al dispositivo del usuario final.

Apple ha realizado las siguientes mejoras en los catálogos de recursos para una amplia compatibilidad con colores:

  • Admiten contenido de origen de 16 bits (por canal de color).
  • Admiten la catalogación de contenido mediante la gama de pantalla. El contenido se puede etiquetar para las gamas sRGB o Display P3.

El desarrollador tiene tres opciones para admitir contenido de color amplio en sus aplicaciones:

  1. No hacer nada: dado que el contenido de color ancho solo debe usarse en situaciones en las que la aplicación necesita mostrar colores de color (donde mejorará la experiencia del usuario), el contenido fuera de este requisito debe desmanterse tal cual. Se seguirá representando correctamente en todas las situaciones de hardware.
  2. Actualizar contenido existente para mostrar P3: esto requiere que el desarrollador reemplace el contenido de la imagen existente en su catálogo de recursos por un nuevo archivo actualizado en el formato P3 y lo etiquete como tal en el Editor de recursos. En tiempo de compilación, se generará una imagen derivada de sRGB a partir de estos recursos.
  3. Proporcionar contenido de recursos optimizado: en esta situación, el desarrollador proporcionará un sRGB de 8 bits y una visión P3 de visualización de 16 bits de cada imagen del catálogo de recursos (etiquetado correctamente en el editor de recursos).

Implementación del catálogo de recursos

Lo siguiente se producirá cuando el desarrollador envíe una aplicación al App Store con catálogos de recursos que incluyen contenido de imagen de color ancho:

  • Cuando la aplicación se implementa en el usuario final, lalicación de aplicaciones garantizará que solo se entregue la variante de contenido adecuada al dispositivo del usuario.
  • En el dispositivo que no admite color ancho, no hay ningún costo de carga para incluir contenido de color ancho, ya que nunca se envía al dispositivo.
  • NSImage en macOS Sierra (y versiones posteriores) seleccionará automáticamente la mejor representación de contenido para la presentación del hardware.
  • El contenido mostrado se actualizará automáticamente cuando cambien las características de presentación del hardware de los dispositivos.

Catálogo de recursos Storage

El almacenamiento del catálogo de recursos tiene las siguientes propiedades e implicaciones para una aplicación:

  • En tiempo de compilación, Apple intenta optimizar el almacenamiento del contenido de la imagen a través de conversiones de imágenes de alta calidad.
  • Se usan 16 bits por canal de color para el contenido de color ancho.
  • La compresión de imágenes dependientes del contenido se usa para reducir los tamaños de contenido entregables. Se han agregado nuevas compresiónes de "pérdida" para optimizar aún más los tamaños de contenido.

Representación Off-Screen imágenes en la aplicación

En función del tipo de aplicación que se crea, podría permitir al usuario incluir el contenido de la imagen que ha recopilado de Internet o crear contenido de imagen directamente dentro de la aplicación (por ejemplo, una aplicación de dibujo vectorial).

En ambos casos, la aplicación puede representar las imágenes necesarias fuera de la pantalla en color ancho mediante características mejoradas agregadas a iOS y macOS.

Dibujo de color ancho en iOS

Antes de analizar cómo dibujar correctamente una imagen de color ancho en iOS 10, consulte el siguiente código de dibujo común de iOS:

public UIImage DrawWideColorImage ()
{
    var size = new CGSize (250, 250);
    UIGraphics.BeginImageContext (size);

    ...

    UIGraphics.EndImageContext ();
    return image = UIGraphics.GetImageFromCurrentImageContext ();
    }

Hay problemas con el código estándar que deben solucionarse antes de poder usarse para dibujar una imagen de color ancho. El UIGraphics.BeginImageContext (size) método usado para iniciar el dibujo de imágenes de iOS tiene las siguientes limitaciones:

  • No puede crear contextos de imagen con más de 8 bits por canal de color.
  • No puede representar colores en el espacio de colores de sRGB de intervalo extendido.
  • No tiene la capacidad de proporcionar una interfaz para crear contextos en un espacio de colores que no sea sRGB debido a las rutinas de C de bajo nivel a las que se llama en segundo plano.

Para controlar estas limitaciones y dibujar una imagen de color ancho en iOS 10, use el código siguiente en su lugar:

public UIImage DrawWideColorImage ()
{
    var size = new CGSize (250, 250);
    var render = new UIGraphicsImageRenderer (size);

    var image = render.CreateImage ((UIGraphicsImageRendererContext context) => {
        var bounds = context.Format.Bounds;
        CGRect slice;
        CGRect remainder;
        bounds.Divide (bounds.Width / 2, CGRectEdge.MinXEdge, out slice, out remainder);

        var redP3 = UIColor.FromDisplayP3 (1.0F, 0.0F, 0.0F, 1.0F);
        redP3.SetColor ();
        context.FillRect (slice);

        var redRGB = UIColor.Red;
        redRGB.SetColor ();
        context.FillRect (remainder);
    });

    // Return results
    return image;
}

La nueva clase crea un nuevo contexto de imagen que es capaz de controlar el espacio de colores sRGB de intervalo extendido y UIGraphicsImageRenderer tiene las siguientes características:

  • Está totalmente administrado por colores de forma predeterminada.
  • Admite el espacio de colores sRGB de intervalo extendido de forma predeterminada.
  • Decide de forma inteligente si se debe representar en el espacio de colores sRGB o de intervalo extendido sRGB en función de las funcionalidades del dispositivo iOS en el que se ejecuta la aplicación.
  • Administra de forma completa y automática la duración del contexto de imagen ( ) para que el desarrollador no tenga que preocuparse de llamar a los comandos de contexto de inicio CGContext y fin.
  • Es compatible con el UIGraphics.GetCurrentContext() método .

Se llama al método de la clase para crear una imagen de color ancho y se pasa un controlador de finalización con el contexto de imagen en el CreateImageUIGraphicsImageRenderer que dibujar. Todo el dibujo se realiza dentro de este controlador de finalización como se muestra a continuación:

  • El método crea un nuevo color rojo totalmente saturado en la gama ancha Mostrar espacio de color P3 y se usa para dibujar la primera UIColor.FromDisplayP3 mitad del rectángulo.
  • La segunda mitad del rectángulo se dibuja en el color rojo sRGB totalmente saturado normal para la comparación.

Dibujo de color ancho en macOS

La NSImage clase se ha expandido en macOS Sierra para admitir el dibujo de imágenes de color ancho. Por ejemplo:

var size = CGSize(250,250);
var wideColorImage = new NSImage(size, false, (drawRect) =>{
    var rects = drawRect.Divide(drawRect.Size.Width/2,CGRect.MinXEdge);

    var color = new NSColor(1.0, 0.0, 0.0, 1.0).Set();
    var path = new NSBezierPath(rects.Slice).Fill();

    color = new NSColor(1.0, 0.0, 0.0, 1.0).Set();
    path = new NSBezierPath(rects.Remainder).Fill();

    // Return modified
    return true;
});

Representación de imágenes en pantalla en la aplicación

Para representar imágenes de color ancho en pantalla, el proceso funciona de forma similar a dibujar una imagen de color ancho fuera de la pantalla para macOS e iOS presentada anteriormente.

Representación en pantalla en iOS

Cuando la aplicación necesite representar una imagen en color ancho en la pantalla en iOS, invalide el método del objeto en DrawUIView cuestión como de costumbre. Por ejemplo:

using System;
using UIKit;
using CoreGraphics;

namespace MonkeyTalk
{
    public class MonkeyView : UIView
    {
        public MonkeyView ()
        {
        }

        public override void Draw (CGRect rect)
        {
            base.Draw (rect);

            // Draw the image to screen
        ...
        }
    }
}

Como hace iOS 10 con la clase mostrada anteriormente, decide de forma inteligente si se debe representar en el espacio de colores sRGB o de sRGB de intervalo extendido en función de las funciones del dispositivo iOS en el que se ejecuta la aplicación cuando se llama al UIGraphicsImageRendererDraw método. Además, también UIImageView se ha administrado el color desde iOS 9.3.

Si la aplicación necesita saber cómo se realiza la representación en o , puede comprobar UIView la nueva propiedad de la clase UIViewControllerDisplayGamutUITraitCollection . Este valor será una UIDisplayGamut enumeración de lo siguiente:

  • P3
  • Srgb
  • Sin especificar

Si la aplicación quiere controlar qué espacio de color se usa para dibujar una imagen, puede usar una nueva propiedad de para especificar ContentsFormat el espacio de colores CALayer deseado. Este valor puede ser una CAContentsFormat enumeración de lo siguiente:

  • Gray8Uint
  • Rgba16Float
  • Rgba8Uint

Representación en pantalla en macOS

Cuando la aplicación necesite representar una imagen en color ancho en pantalla en macOS, invalide el método del objeto en DrawRectNSView cuestión como de costumbre. Por ejemplo:

using System;
using AppKit;
using CoreGraphics;
using CoreAnimation;

namespace MonkeyTalkMac
{
    public class MonkeyView : NSView
    {
        public MonkeyView ()
        {
        }

        public override void DrawRect (CGRect dirtyRect)
        {
            base.DrawRect (dirtyRect);

            // Draw graphics into the view
            ...
        }
    }
}

Una vez más, decide de forma inteligente si debe representarse en el espacio de colores sRGB o de intervalo extendido sRGB en función de las funciones del hardware mac en el que se ejecuta la aplicación cuando se llama al DrawRect método.

Si la aplicación quiere controlar qué espacio de color se usa para dibujar una imagen, puede usar una nueva propiedad de la clase para especificar DepthLimit el espacio de colores NSWindow deseado. Este valor puede ser una NSWindowDepth enumeración de lo siguiente:

  • OneHuhibedTbtyEightBitRgb
  • DesconciertefourBitRgb
  • TwentyfourBitRgb