Image principale dans Xamarin.iOS

Core Image est une nouvelle infrastructure introduite avec iOS 5 pour fournir des fonctionnalités de traitement d’images et d’amélioration vidéo en direct. Cet article présente ces fonctionnalités avec des exemples Xamarin.iOS.

Core Image est une nouvelle infrastructure introduite dans iOS 5 qui fournit un certain nombre de filtres et d’effets intégrés à appliquer aux images et vidéos, y compris la détection des visages.

Ce document contient des exemples simples de :

  • Détection des visages.
  • Application de filtres à une image
  • Liste des filtres disponibles.

Ces exemples doivent vous aider à intégrer des fonctionnalités Core Image dans vos applications Xamarin.iOS.

Spécifications

Vous devez utiliser la dernière version de Xcode.

Détection de visage

La fonctionnalité de détection de visages Core Image fait ce qu’elle dit : elle tente d’identifier les visages dans une photo et retourne les coordonnées de tous les visages qu’il reconnaît. Ces informations peuvent être utilisées pour compter le nombre de personnes d’une image, dessiner des indicateurs sur l’image (par exemple, pour « marquer » les personnes dans une photo) ou tout autre élément auquel vous pouvez penser.

Ce code de CoreImage\SampleCode.cs montre comment créer et utiliser la détection des visages sur une image incorporée :

var image = new UIImage("photoFace.JPG");
var context = CIContext.FromOptions(null);
var detector = CIDetector.CreateFaceDetector (context, true);
var ciImage = CIImage.FromCGImage(image.CGImage);
CIFeature[] features = detector.FeaturesInImage(ciImage);

Le tableau de fonctionnalités est rempli avec CIFaceFeature des objets (si des visages ont été détectés). Il y a un CIFaceFeature visage pour chaque visage. CIFaceFeature contient les propriétés suivantes :

  • HasMouthPosition : si une bouche a été détectée pour ce visage.
  • HasLeftEyePosition : indique si l’œil gauche a été détecté pour ce visage.
  • HasRightEyePosition : indique si l’œil droit a été détecté pour ce visage.
  • MouthPosition : coordonnées de la bouche pour ce visage.
  • LeftEyePosition : coordonnées de l’œil gauche pour ce visage.
  • RightEyePosition : coordonnées de l’œil droit pour ce visage.

Les coordonnées de toutes ces propriétés ont leur origine en bas à gauche, contrairement à UIKit qui utilise le haut à gauche comme origine. Lorsque vous utilisez les coordonnées, CIFaceFeature veillez à les « retourner ». Cette vue d’image personnalisée très simple dans CoreImage\CoreImageViewController.cs montre comment dessiner des triangles « indicateur de visage » sur l’image (notez la FlipForBottomOrigin méthode) :

public class FaceDetectImageView : UIView
{
    public Xamarin.iOS.CoreImage.CIFeature[] Features;
    public UIImage Image;
    public FaceDetectImageView (RectangleF rect) : base(rect) {}
    CGPath path;
    public override void Draw (RectangleF rect) {
        base.Draw (rect);
        if (Image != null)
            Image.Draw(rect);

        using (var context = UIGraphics.GetCurrentContext()) {
            context.SetLineWidth(4);
            UIColor.Red.SetStroke ();
            UIColor.Clear.SetFill ();
            if (Features != null) {
                foreach (var feature in Features) { // for each face
                    var facefeature = (CIFaceFeature)feature;
                    path = new CGPath ();
                    path.AddLines(new PointF[]{ // assumes all 3 features found
                        FlipForBottomOrigin(facefeature.LeftEyePosition, 200),
                        FlipForBottomOrigin(facefeature.RightEyePosition, 200),
                        FlipForBottomOrigin(facefeature.MouthPosition, 200)
                    });
                    path.CloseSubpath();
                    context.AddPath(path);
                    context.DrawPath(CGPathDrawingMode.FillStroke);
                }
            }
        }
    }
    /// <summary>
    /// Face recognition coordinates have their origin in the bottom-left
    /// but we are drawing with the origin in the top-left, so "flip" the point
    /// </summary>
    PointF FlipForBottomOrigin (PointF point, int height)
    {
        return new PointF(point.X, height - point.Y);
    }
}

Ensuite, dans le fichier SampleCode.cs, l’image et les fonctionnalités sont attribuées avant que l’image ne soit redessinée :

faceView.Image = image;
faceView.Features = features;
faceView.SetNeedsDisplay();

La capture d’écran montre l’exemple de sortie : les emplacements des caractéristiques faciales détectées sont affichés dans un UITextView et dessinés sur l’image source à l’aide de CoreGraphics.

En raison de la façon dont la reconnaissance faciale fonctionne, il détectera occasionnellement des choses en plus des visages humains (comme ces singes toy !).

Filtres

Il existe plus de 50 filtres intégrés différents, et l’infrastructure est extensible afin que de nouveaux filtres puissent être implémentés.

Utilisation de filtres

L’application d’un filtre à une image comporte quatre étapes distinctes : chargement de l’image, création du filtre, application du filtre et enregistrement (ou affichage) du résultat.

Tout d’abord, chargez une image dans un CIImage objet.

var uiimage = UIImage.FromFile ("photo.JPG");
var ciimage = new CIImage (uiimage);

Ensuite, créez la classe de filtre et définissez ses propriétés.

var sepia = new CISepiaTone();
sepia.Image = ciimage;
sepia.Intensity = 0.8f;

Troisièmement, accédez à la OutputImage propriété et appelez la CreateCGImage méthode pour afficher le résultat final.

CIImage output = sepia.OutputImage;
var context = CIContext.FromOptions(null);
var cgimage = context.CreateCGImage (output, output.Extent);

Enfin, affectez l’image à une vue pour afficher le résultat. Dans une application réelle, l’image résultante peut être enregistrée dans le système de fichiers, l’album photo, un tweet ou un e-mail.

var ui = UIImage.FromImage (cgimage);
imgview.Image = ui;

Ces captures d’écran montrent le résultat des CISepia filtres et CIHueAdjust des filtres présentés dans l’exemple de code CoreImage.zip.

Consultez le contrat d’ajustement et la luminosité d’une recette d’image pour obtenir un exemple de CIColorControls filtre.

var uiimage = UIImage.FromFile("photo.JPG");
var ciimage = new CIImage(uiimage);
var hueAdjust = new CIHueAdjust();   // first filter
hueAdjust.Image = ciimage;
hueAdjust.Angle = 2.094f;
var sepia = new CISepiaTone();       // second filter
sepia.Image = hueAdjust.OutputImage; // output from last filter, input to this one
sepia.Intensity = 0.3f;
CIFilter color = new CIColorControls() { // third filter
    Saturation = 2,
    Brightness = 1,
    Contrast = 3,
    Image = sepia.OutputImage    // output from last filter, input to this one
};
var output = color.OutputImage;
var context = CIContext.FromOptions(null);
// ONLY when CreateCGImage is called do all the effects get rendered
var cgimage = context.CreateCGImage (output, output.Extent);
var ui = UIImage.FromImage (cgimage);
imgview.Image = ui;
var context = CIContext.FromOptions (null);
var context = CIContext.FromOptions(new CIContextOptions() {
    UseSoftwareRenderer = true  // CPU
});
var cgimage = context.CreateCGImage (output, output.Extent);
var ui = UIImage.FromImage (cgimage);
imgview.Image = ui;

Lister les filtres et leurs propriétés

Ce code de CoreImage\SampleCode.cs génère la liste complète des filtres intégrés et de leurs paramètres.

var filters = CIFilter.FilterNamesInCategories(new string[0]);
foreach (var filter in filters){
   display.Text += filter +"\n";
   var f = CIFilter.FromName (filter);
   foreach (var key in f.InputKeys){
     var attributes = (NSDictionary)f.Attributes[new NSString(key)];
     var attributeClass = attributes[new NSString("CIAttributeClass")];
     display.Text += "   " + key;
     display.Text += "   " + attributeClass + "\n";
   }
}

La référence de classe CIFilter décrit les 50 filtres intégrés et leurs propriétés. Le code ci-dessus vous permet d’interroger les classes de filtre, y compris les valeurs par défaut pour les paramètres et les valeurs maximales et minimales autorisées (qui peuvent être utilisées pour valider les entrées avant d’appliquer un filtre).

La sortie Catégories de liste ressemble à ceci sur le simulateur : vous pouvez parcourir la liste pour afficher tous les filtres et leurs paramètres.

La sortie Catégories de liste ressemble à ceci sur le simulateur

Chaque filtre répertorié a été exposé en tant que classe dans Xamarin.iOS. Vous pouvez donc également explorer l’API Xamarin.iOS.CoreImage dans l’Explorateur d’assemblys ou utiliser la saisie semi-automatique dans Visual Studio pour Mac ou Visual Studio.

Résumé

Cet article a montré comment utiliser certaines des nouvelles fonctionnalités de l’infrastructure d’images iOS 5 Core, telles que la détection des visages et l’application de filtres à une image. Il existe des dizaines de filtres d’images différents disponibles dans l’infrastructure pour vous permettre d’utiliser.