iOS Comment la propriété Mode affecte une image


Exemple

La propriété mode de contenu d'une vue indique comment son contenu doit être présenté. Dans Interface Builder, les différents modes peuvent être sélectionnés dans l'inspecteur d'attributs.

screenshot d'inspecteur d'attributs

Utilisons deux vues d'image pour voir comment fonctionnent les différents modes.

Capture d'écran du générateur d'interface

Echelle à remplir

Echelle à remplir

Les hauteurs et les largeurs d'image sont étirées pour correspondre à la taille de UIImageView .

Aspect Fit

Aspect Fit

Le côté le plus long (hauteur ou largeur) de l'image est étiré pour correspondre à la vue. Cela rend l'image aussi grande que possible tout en affichant l'image entière sans déformer la hauteur ou la largeur. (J'ai défini le fond UIImageView sur bleu pour que sa taille soit claire.)

Remplissage d'aspect

Remplissage d'aspect

Le côté le plus court (hauteur ou largeur) de l'image est étiré pour correspondre à la vue. Comme "Aspect Fit", les proportions de l'image ne sont pas déformées par rapport à leur format d'origine.

Redessiner

Redessiner

Redraw est uniquement pour les vues personnalisées qui doivent effectuer leur propre redimensionnement et redimensionnement. Nous n'utilisons pas de vue personnalisée, nous ne devrions donc pas utiliser Redraw. Notez qu'ici, UIImageView nous donne juste le même résultat que Scale to Fill, mais il fait plus de travail en coulisse.

À propos de Redraw, la documentation Apple indique:

Les modes de contenu permettent de recycler le contenu de votre vue, mais vous pouvez également définir le mode de contenu sur la valeur UIViewContentModeRedraw lorsque vous souhaitez que vos vues personnalisées se redessinent lors des opérations de redimensionnement et de redimensionnement. La définition du mode de contenu de votre vue sur cette valeur force le système à appeler la méthode drawRect: votre vue en réponse aux modifications de géométrie. En général, vous devriez éviter d'utiliser cette valeur autant que possible, et vous ne devriez certainement pas l'utiliser avec les vues système standard.

Centre

Centre

L'image est centrée dans la vue mais la longueur et la largeur de l'image ne sont pas étirées.

Haut

Haut

Le bord supérieur de l'image est centré horizontalement en haut de la vue et la longueur et la largeur de l'image ne sont pas étirées.

Bas

Bas

Le bord inférieur de l'image est centré horizontalement au bas de la vue et la longueur et la largeur de l'image ne sont pas étirées.

La gauche

La gauche

Le bord gauche de l'image est centré verticalement à gauche de la vue et la longueur et la largeur de l'image ne sont pas étirées.

Droite

Droite

Le bord droit de l'image est centré verticalement à droite de la vue et la longueur et la largeur de l'image ne sont pas étirées.

En haut à gauche

En haut à gauche

Le coin supérieur gauche de l'image est placé dans le coin supérieur gauche de la vue. La longueur et la largeur de l'image ne sont pas étirées.

En haut à droite

En haut à droite

Le coin supérieur droit de l'image est placé dans le coin supérieur droit de la vue. La longueur et la largeur de l'image ne sont pas étirées.

En bas à gauche

En bas à gauche

Le coin inférieur gauche de l'image est placé dans le coin inférieur gauche de la vue. La longueur et la largeur de l'image ne sont pas étirées.

En bas à droite

En bas à droite

Le coin inférieur droit de l'image est placé dans le coin inférieur droit de la vue. La longueur et la largeur de l'image ne sont pas étirées.

Remarques

  • Cet exemple vient d’ ici .

  • Si le contenu (dans notre cas, l'image) a la même taille que la vue (dans notre cas, la UIImageView ), alors changer le mode de contenu ne fera aucune différence notable.

  • Voir ceci et cette question pour une discussion sur les modes de contenu pour les vues autres que UIImageView .

  • Dans Swift, pour définir le mode de contenu par programmation, procédez comme suit:

      imageView.contentMode = UIViewContentMode.scaleToFill
      imageView.contentMode = UIViewContentMode.scaleAspectFit
      imageView.contentMode = UIViewContentMode.scaleAspectFill
      imageView.contentMode = UIViewContentMode.redraw
      imageView.contentMode = UIViewContentMode.center
      imageView.contentMode = UIViewContentMode.top
      imageView.contentMode = UIViewContentMode.bottom
      imageView.contentMode = UIViewContentMode.left
      imageView.contentMode = UIViewContentMode.right
      imageView.contentMode = UIViewContentMode.topLeft
      imageView.contentMode = UIViewContentMode.topRight
      imageView.contentMode = UIViewContentMode.bottomLeft
      imageView.contentMode = UIViewContentMode.bottomRight