Image

Le composant image vous permet d'afficher des images dans votre application.

Vue d'ensemble

Le composant Image vous permet d'afficher des images dans votre application et s'associe parfaitement avec les composants basés sur l'image comme l'appareil photo, la photothèque, l'outil de reconnaissance d'images et MediaDB.

• Paramétrer l'image

• Modifier la taille de l'image

• Style de l'image

• Ajouter un espace

• Evénements

• Propriétés

Paramétrer l'image

Il existe plusieurs façons d'afficher une image dans votre application :

1. Téléchargez une photo sur votre application
2. Fournir un lien vers l'image
3. Prenez une photo avec le composant Appareil photo

Les blocs ci-dessus ouvrent l'appareil photo de votre téléphone et permettent de régler le composant Image sur la photo que vous avez prise.

Modifier la taille de l'image

Vous pouvez définir la hauteur de l'image à l'aide de la propriété "height" et sa largeur à l'aide de la propriété "width".

Hauteur

• Fill Container - L'image remplit l'écran entier verticalement

• Fill contents- La hauteur de l'image change en fonction du contenu qu'elle contient

• Relative Size - L'image remplit le pourcentage spécifié de l'écran

• Absolute Size - Taille de l'image en fonction d'un nombre déterminé de pixels

Largeur

• Fill Container- L'image remplit tout l'écran horizontalement

• Fill Contents - La largeur de l'image change pour s'adapter au contenu qu'elle contient

• Relative Size- L'image remplit le pourcentage spécifié de l'écran

• Absolute Size - Taille de l'image à un nombre de pixels spécifié

Redimensionnement de l'image

Avec la propriété Resize Mode, vous pouvez faire ce qui suit :

• Cover: Redimensionne l'image à sa hauteur ou à sa largeur maximale sans modifier la qualité de l'image.

• Contain : Redimensionner l'image pour l'adapter à la zone sans en modifier la qualité

• Stretch: La hauteur de l'image change pour remplir la composante de l'image dans le sens de la longueur

• Repeat: Répétition de l'image à sa qualité d'origine dans la zone du composant de l'image

• Center : Positionne l'image au milieu de l'élément d'image

Style de l'image

Vous pouvez styliser l'image avec les propriétés suivantes :

• Border (Bordure)

  • Width: Indiquez la largeur que vous souhaitez pour le contour de l'image

  • Color : choisissez une couleur pour la bordure de l'image

  • Radius: Indiquez le rayon que vous souhaitez pour les bords de la bordure de l'image

Ajouter un espacement

Vous pouvez modifier l'espacement et le positionnement de l'image avec les propriétés Marge et Rembourrage.

Margin (Marge)

• Vous pouvez spécifier l'espace que vous souhaitez entre les bords de l'image et l'écran en utilisant des valeurs en pixels ou en pourcentage.

Padding (Remplissage)

• Vous pouvez spécifier l'espace que vous souhaitez entre la bordure et le contenu de l'image en utilisant une valeur en pixel ou en pourcentage.

Événements

Cliquez sur

Ce gestionnaire d'événements est déclenché lorsque l'utilisateur clique sur l'image.

Propriétés

Dimensions calculées

Les blocs Computed Height (Hauteur calculée) et Computed Width (Largeur calculée) renvoient les dimensions de l'image à l'écran, après qu'elle ait été rendue à l'écran. La valeur renvoyée est un nombre entier, représentant la taille de l'image en pixels.

Hauteur

Les blocs "set" et "get height" fonctionnent avec la propriété "Height" du composant de l'image. Les valeurs d'entrée acceptables sont .

• Number of Pixels (Nombre de pixels)

• Percentage Height (Pourcentage Hauteur)

• Fit Contents (Contenu Adapté)

• Fill container (Remplir le conteneur)

Photo

Les blocs "set" et "get" fonctionnent avec les propriétés de l'image de la composante image. Les images peuvent être téléchargées en tant qu'actifs locaux ou spécifiées en tant qu'URL

Mode de redimensionnement

Les blocs du mode "Définir et obtenir" fonctionnent avec la façon dont l'image est mise à l'échelle dans le composant de l'image. Les valeurs acceptables sont :

• Cover (Couverture)

• Contain (Contient)

• Stretch (Étendre)

• Repeat (Répéter)

• Center (Centre)

Visible

Les blocs "set" et "get visible" sont utilisés pour afficher ou masquer l'ensemble de la composante de l'image. Les valeurs acceptables sont :

• True (Vrai)

• False (Faux)

Largeur

Les blocs set et get width fonctionnent avec la propriété Width du composant de l'image. Les valeurs acceptables sont .

• Number of Pixels (Nombre de pixels)

• Percentage Width (Pourcentage Largeur)

• Fit Contents (Contenu Adapté)

• Fill Container (Remplir le conteneur)