Partager via

Couleur large dans Xamarin.iOS

  • Article

Cet article décrit les couleurs larges et la façon dont elles peuvent être utilisées dans une application Xamarin.iOS ou Xamarin.Mac.

iOS 10 et macOS Sierra améliore la prise en charge des formats de pixels à plage étendue et des espaces de couleurs à large gamme dans tout le système, y compris les frameworks tels que Core Graphics, Core Image, Metal et AVFoundation. La prise en charge des appareils avec des affichages couleur larges est encore facilitée en fournissant ce comportement dans l’ensemble de la pile graphique.

Catalogues de ressources

Prise en charge des couleurs larges avec les catalogues de ressources

Dans iOS 10 et macOS Sierra, Apple a développé les catalogues de ressources utilisés pour inclure et catégoriser le contenu d’images statiques dans l’offre groupée de l’application afin de prendre en charge les couleurs larges.

L’utilisation de catalogues de ressources offre les avantages suivants à une application :

  • Ils fournissent la meilleure option de déploiement pour les ressources d’image statiques.
  • Ils prennent en charge la correction automatique des couleurs.
  • Ils prennent en charge l’optimisation automatique du format de pixels.
  • Ils prennent en charge le découpage d’application et l’amincissement des applications, ce qui garantit que seul le contenu pertinent est remis à l’appareil de l’utilisateur final.

Apple a apporté les améliorations suivantes aux catalogues d’actifs pour une prise en charge étendue des couleurs :

  • Ils prennent en charge le contenu source 16 bits (par canal couleur).
  • Ils prennent en charge le catalogage du contenu par gamut d’affichage. Le contenu peut être marqué pour les gamuts sRGB ou Display P3.

Le développeur dispose de trois options pour prendre en charge le contenu de couleur large dans ses applications :

  1. Ne rien faire : étant donné que le contenu en couleurs larges ne doit être utilisé que dans les situations où l’application doit afficher des couleurs vives (où elles amélioreront l’expérience de l’utilisateur), le contenu en dehors de cette exigence doit être laissé tel quel. Il continuera d’être rendu correctement dans toutes les situations matérielles.
  2. Mettre à niveau le contenu existant vers l’affichage P3 : pour cela, le développeur doit remplacer le contenu d’image existant dans son catalogue de ressources par un nouveau fichier mis à niveau au format P3 et l’étiqueter comme tel dans l’éditeur de ressources. Au moment de la génération, une image dérivée sRGB est générée à partir de ces ressources.
  3. Fournir un contenu de ressource optimisé : dans ce cas, le développeur fournit à la fois une vision SRGB 8 bits et une vision P3 d’affichage 16 bits de chaque image du catalogue de ressources (correctement étiquetée dans l’éditeur de ressources).

Déploiement du catalogue de ressources

Les éléments suivants se produisent lorsque le développeur envoie une application au App Store avec des catalogues de ressources qui incluent le contenu d’images en couleur large :

  • Lorsque l’application est déployée sur l’utilisateur final, app Slicing garantit que seule la variante de contenu appropriée est remise à l’appareil de l’utilisateur.
  • Sur un appareil qui ne prend pas en charge les couleurs larges, il n’y a aucun coût de charge utile pour l’inclusion de contenu de couleur large, car il n’est jamais expédié à l’appareil.
  • NSImage sur macOS Sierra (et versions ultérieures) sélectionne automatiquement la meilleure représentation du contenu pour l’affichage du matériel.
  • Le contenu affiché est automatiquement actualisé lorsque ou si les caractéristiques d’affichage matérielle des appareils changent.

Stockage du catalogue de ressources

Le stockage du catalogue de ressources a les propriétés et les implications suivantes pour une application :

  • Au moment de la génération, Apple tente d’optimiser le stockage du contenu de l’image via des conversions d’images de haute qualité.
  • Les 16 bits sont utilisés par canal de couleur pour un contenu de couleur large.
  • La compression d’image dépendante du contenu est utilisée pour réduire les tailles de contenu livrables. De nouvelles compressions « avec perte » ont été ajoutées pour optimiser davantage les tailles de contenu.

Rendu Off-Screen images dans l’application

En fonction du type d’application en cours de création, cela peut permettre à l’utilisateur d’inclure le contenu d’image qu’il a collecté à partir d’Internet ou de créer du contenu d’image directement à l’intérieur de l’application (comme une application de dessin vectoriel par exemple).

Dans ces deux cas, l’application peut afficher les images requises hors écran en couleur large à l’aide de fonctionnalités améliorées ajoutées à iOS et macOS.

Dessin d’une couleur large dans iOS

Avant de discuter de la façon de dessiner correctement une image en couleur large dans iOS 10, consultez le code de dessin iOS courant suivant :

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

    ...

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

Il existe des problèmes liés au code standard qui devront être résolus avant qu’il puisse être utilisé pour dessiner une image en couleur large. La UIGraphics.BeginImageContext (size) méthode utilisée pour démarrer le dessin d’image iOS présente les limitations suivantes :

  • Il ne peut pas créer de contextes d’image avec plus de 8 bits par canal de couleur.
  • Il ne peut pas représenter les couleurs dans l’espace de couleurs sRGB de plage étendue.
  • Il n’a pas la possibilité de fournir une interface pour créer des contextes dans un espace de couleur non-sRGB en raison des routines C de bas niveau appelées en arrière-plan.

Pour gérer ces limitations et dessiner une image en couleur large dans iOS 10, utilisez plutôt le code suivant :

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 nouvelle UIGraphicsImageRenderer classe crée un contexte d’image capable de gérer l’espace coloriaire sRGB de plage étendue et elle dispose des fonctionnalités suivantes :

  • Il est entièrement géré par les couleurs par défaut.
  • Il prend en charge l’espace de couleur sRGB de plage étendue par défaut.
  • Il décide intelligemment s’il doit s’afficher dans l’espace de couleur sRGB ou étendue sRGB en fonction des fonctionnalités de l’appareil iOS sur lequel l’application s’exécute.
  • Il gère entièrement et automatiquement la durée de vie du contexte de l’image (CGContext) afin que le développeur n’ait pas à se soucier de l’appel des commandes de contexte de début et de fin.
  • Elle est compatible avec la UIGraphics.GetCurrentContext() méthode .

La CreateImage méthode de la UIGraphicsImageRenderer classe est appelée pour créer une image couleur large et a passé un gestionnaire d’achèvement avec le contexte d’image dans lequel dessiner. Tout le dessin est effectué à l’intérieur de ce gestionnaire de saisie semi-automatique comme suit :

  • La UIColor.FromDisplayP3 méthode crée une nouvelle couleur rouge entièrement saturée dans l’espace de couleur de l’affichage P3 à large gamut et elle est utilisée pour dessiner la première moitié du rectangle.
  • La deuxième moitié du rectangle est dessinée dans la couleur rouge saturée sRGB normale à des fins de comparaison.

Dessin d’une couleur large dans macOS

La NSImage classe a été développée dans macOS Sierra pour prendre en charge le dessin d’images Wide Color. Par exemple :

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;
});

Rendu d’images à l’écran dans l’application

Pour afficher des images en couleurs larges à l’écran, le processus fonctionne de la même façon que le dessin d’une image couleur large hors écran pour macOS et iOS présentée ci-dessus.

Rendu à l’écran dans iOS

Lorsque l’application doit restituer une image en couleur large à l’écran dans iOS, remplacez la Draw méthode du en question comme d’habitude UIView . Par exemple :

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
        ...
        }
    }
}

Comme iOS 10 le fait avec la UIGraphicsImageRenderer classe ci-dessus, il décide intelligemment s’il doit s’afficher dans l’espace de couleur sRGB ou plage étendue sRGB en fonction des fonctionnalités de l’appareil iOS sur lequel l’application s’exécute lorsque la Draw méthode est appelée. En outre, la UIImageView couleur est également gérée depuis iOS 9.3.

Si l’application doit savoir comment le rendu est effectué sur un UIView ou UIViewController, elle peut case activée la nouvelle DisplayGamut propriété de la UITraitCollection classe . Cette valeur est une UIDisplayGamut énumération des éléments suivants :

  • P3
  • Srgb
  • Non spécifié

Si l’application souhaite contrôler l’espace de couleur utilisé pour dessiner une image, elle peut utiliser une nouvelle ContentsFormat propriété de pour CALayer spécifier l’espace de couleur souhaité. Cette valeur peut être une CAContentsFormat énumération des éléments suivants :

  • Gray8Uint
  • Rgba16Float
  • Rgba8Uint

Rendu à l’écran dans macOS

Lorsque l’application doit restituer une image en couleur large à l’écran dans macOS, remplacez la DrawRect méthode du NSView en question comme d’habitude. Par exemple :

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
            ...
        }
    }
}

Là encore, il décide intelligemment s’il doit s’afficher dans l’espace coloriaire sRGB ou plage étendue sRGB en fonction des fonctionnalités du matériel Mac sur lequel l’application s’exécute lorsque la DrawRect méthode est appelée.

Si l’application souhaite contrôler l’espace de couleur utilisé pour dessiner une image, elle peut utiliser une nouvelle DepthLimit propriété de la NSWindow classe pour spécifier l’espace coloriaire souhaité. Cette valeur peut être une NSWindowDepth énumération des éléments suivants :

  • OneHundredTwentyEightBitRgb
  • SixtyfourBitRgb
  • TwentyfourBitRgb