Ignorer la navigation

II. Première application : du texte

Nous allons réaliser l'application suivante :

Sur l'écran s'affiche un bouton et une zone de Texte à remplir. Quand on appuie sur le bouton, un message apparaît sous le bouton (bonjour) et le nom rentré dans la zone de texte s'affiche sous "bonjour"

Étape 1 : création de l'application :

Allez dans le menu "Projets" puis choisir "Commencer nouveau projet ..."

Choisir un nom de projet puis cliquez sur OK :



Étape 2: placement des éléments sur l'écran:

Nous avons 4 éléments à placer sur notre écran (interface homme/machine):

  • une zone de texte à remplir ('zone de texte')
  • un bouton
  • 2 zones de texte où écrire ('Label')


Placez les éléments pour obtenir l'écran ci-dessous. Pour placer un élément, cliquez dessus dans le menu de gauche et le déplacer, en gardant le clic enfoncé, à l'endroit où vous voulez le poser (dans le "Screen1" qui est le nom de votre fenêtre d'application)

Vous remarquerez que les éléments apparaissent dans 2 fenêtres, dans votre "Screen1" bien évidemment mais aussi dans la fenêtre "composants".



Étape 3: paramétrage des éléments

Le paramétrage se passe dans la fenêtre de droite "propriétés"

Pour la zone de texte, on va lui mettre un texte par défaut" :
Pour le bouton, on va lui mettre un texte :

Pour le 1er texte (Label1), on va écrire 'bonjour' et le rendre invisible :

Pour le 2ème texte (Label2), on ne va rien écrire et le rendre invisible aussi:

Vous remarquerez que les 2 éléments de texte (label) ont disparu de votre Screen1 mais ils sont toujours présents dans la fenêtre "Composants"

Il faut penser à faire régulièrement des sauvegardes (menu "Projets" puis "enregistrer le projet")





Étape 4: écriture du programme

Comme annoncé en introduction, nous n'allons pas écrire de lignes de codes mais utiliser un mode de programmation graphique. Pour y accéder il faut cliquer sur "Blocs" (en haut à droite).

Les éléments de notre "Screen1" apparaissent bien (en bas à gauche).

Au dessus, ce sont les blocs disponibles classés en grandes fonctions :

Contrôle : les éléments de test, de boucles, ….
Logique : éléments liées à de la logique, "vrai", "faux", …
Math : des outils mathématiques (addition, …)
Text : pour gérer les textes
….

Avant de faire quoi que ce soit, il faut écrire le programme,  sous la forme que vous voulez (algorithmes, algorigrammes, …). Une fois le programme écrit ou pourra le traduire en blocs.



Ici l'algorithme est :

Quand le Bouton1 est cliqué, on fait :

  • on rend le label1 visible
  • on rend le label2 visible
  • on affiche dans le label2 le texte de la zone de texte1

 

Quand on clique sur le Bouton1, une fenêtre avec toutes les possibilités associées à cette élément apparaissent :

 

 

 

 

 

On va choisir :


Si on clique sur "Label1" :



Voilà donc le bloc qui signifie "quand le Bouton1 est cliqué on rend le label1 visible"




A vous de compléter la programmation de façon à obtenir :






Étape 5: essai du programme (de l'application)

Si l'on possède un téléphone ou une tablette sous Android on peut essayer l'application en réel (et ça fonctionne bien mieux que la simulation)


Sinon on utilise la simulation (là il faut être patient!).


Vérifier que votre application fonctionne (copie d'écran à fournir)



Si vous voulez enregistrer votre application sur votre ordinateur , allez sans l’onglet "Construire" puis choisissez “App (enregistrer .apk sur mon ordinateur)”
La compilation de votre application s’exécute et vous obtenez un fichier APK qui s'enregistre dans votre dossier téléchargement.

Créé avec eXeLearning (Nouvelle fenêtre)