samedi 15 mars 2025

App Inventor : Zone de texte, comment introduire du texte

 Dans App Inventor, comment introduire un texte dans un élément zone de texte

Pour introduire un texte dans un élément zone de texte dans App Inventor, vous pouvez suivre ces étapes :

  1. Dans la fenêtre "Designer", ajoutez un composant "Zone de texte" (TextBox) à votre interface en le faisant glisser depuis la palette vers le visualiseur[1].

  2. Sélectionnez la zone de texte dans la liste des composants ou directement dans le visualiseur[2].

  3. Dans le panneau des propriétés à droite, vous pouvez définir les caractéristiques de la zone de texte[2][1] :

    • Modifiez la propriété "Text" pour définir un texte par défaut qui apparaîtra dans la zone de texte[3].

    • Ajustez d'autres propriétés comme la taille de la police, la couleur de fond, ou la largeur selon vos besoins[1].

  4. Pour récupérer le texte saisi par l'utilisateur dans la zone de texte, utilisez le bloc "TextBox1.Text" dans la fenêtre "Blocks"[4].

  5. Vous pouvez ensuite utiliser ce texte dans votre logique d'application, par exemple pour l'afficher dans un label ou le traiter d'une autre manière[5][4].


avec un exemple

Bien sûr, je vais vous donner un exemple concret pour illustrer comment introduire et utiliser un texte dans une zone de texte dans App Inventor.

Exemple : Créer une application de salutation personnalisée

Dans cet exemple, nous allons créer une application simple qui demande le nom de l'utilisateur dans une zone de texte, puis affiche un message de salutation personnalisé lorsqu'un bouton est pressé.

Étape 1 : Configuration de l'interface utilisateur

Dans la vue "Designer" :
  1. Ajoutez une Zone de texte (TextBox)

    • Renommez-la en "txtNom"

    • Dans les propriétés, définissez Hint à "Entrez votre nom"

  2. Ajoutez un Bouton (Button)

    • Renommez-le en "btnSaluer"

    • Dans les propriétés, définissez Text à "Saluer"

  3. Ajoutez un Label

    • Renommez-le en "lblSalutation"

    • Laissez le texte vide pour l'instant

Étape 2 : Programmation des blocs

Dans la vue "Blocks" :

  1. Ajoutez un bloc "when btnSaluer.Click do"

  2. À l'intérieur de ce bloc, ajoutez :

    1. Un bloc "set lblSalutation.Text to"

    2. Connectez-y un bloc de texte (join)

    3. Dans le bloc join, mettez "Bonjour, " comme premier élément

    4. Comme deuxième élément du join, ajoutez un bloc "txtNom.Text"

Voici à quoi devraient ressembler vos blocs :

when btnSaluer.Click
set lblSalutation.Text to
join("Bonjour, ", txtNom.Text)


Fonctionnement de l'application

  1. L'utilisateur entre son nom dans la zone de texte "txtNom".

  2. L'utilisateur appuie sur le bouton "Saluer".

  3. Le texte du label "lblSalutation" est mis à jour avec un message personnalisé, par exemple "Bonjour, Alice" si l'utilisateur a entré "Alice".

Cet exemple simple montre comment :

  • Introduire du texte dans une zone de texte (via l'interface utilisateur)

  • Récupérer le texte de la zone de texte (avec txtNom.Text)

  • Utiliser ce texte pour créer un message personnalisé

Vous pouvez bien sûr élaborer davantage cette application en ajoutant des fonctionnalités supplémentaires ou en personnalisant l'interface utilisateur selon vos besoins.

Aucun commentaire: