[TP2]
MASTER : INGÉNIERIE DES SYSTÉMES INFORMATIQUES
INITIATION À ANDROID
STUDIO
Date: [22/11/2019]
Encadré par: [[Link]]
Réalisé par : [ELGANA Yasser & DAYR Hamza ]
1
Table de figures
Figure 1 : Création de projet ................................................................................................... 2
Figure 2 : L’éditeur de mise en page ...................................................................................... 2
Figure 3: Changement de thème ............................................................................................ 2
Figure 4 : Changement de rotation ......................................................................................... 2
Figure 5 : Changement de version SDK ................................................................................ 2
Figure 6 : Activity_main.xml ..................................................................................................... 2
Figure 7: Application initial ...................................................................................................... 2
Figure 8 : Propriétés de Button_toast .................................................................................... 2
Figure 9 : Propriétés de TextView ........................................................................................... 2
Figure 10 : Application avant la modification........................................................................ 2
Figure 11: Création des ressources........................................................................................ 2
Figure 12: fichier : [Link] ............................................................................................... 2
Figure 13: Changement de design ......................................................................................... 2
Figure 14 : Fichier [Link] .................................................................................................. 2
Figure 15: Fichier [Link] ................................................................................................ 2
Figure 16 : Fichier Activity_main.xml ...................................................................................... 2
Figure 17: Application Login .................................................................................................... 2
Figure 18 : Code complet de tache 4 ..................................................................................... 2
Figure 19 : Application finale .................................................................................................. 2
Figure 20: Application de commande café ........................................................................... 2
2
Tâche 1 : Créer un nouveau projet “Hello Toast”
2.1 Explorer l'éditeur de mise en page (Editor Layout)
Création d’un nouveau projet “ Hello Toast”
avec les paramètres suivants:
➢ Application Name : Hello Toast
➢ Package name: [Link].tp2
➢ Phone SDK: API17
➢ Template: Empty Activity
Figure 1 : Création de projet
Tâche 2 : Ajouter des vues à "Hello Toast" dans l'éditeur de mise en
page :
L'éditeur de mise en page offre la possibilité
de créer la mise en page de l'interface
utilisateur et pour prévisualiser l’application
à l'aide de différents appareils, thèmes,
résolutions et orientations.
Figure 2 : L’éditeur de mise en page
3
Dans l'éditeur de mise en page on peut :
➢ Changer le thème
Cette figure illustre que on peut toujours modifier ou
changer le theme d’application .
Figure 3: Changement de thème
➢ Changer la rotation
Comme vous pouvez voir dans la figure (4) on peut
aussi changer la rotation .
Figure 4 : Changement de rotation
➢ Changer la version SDK :
comme on peut modifier la version de SDK de
notre application
Figure 5 : Changement de version SDK
4
2.2 Modifier le groupe de vues à un LinearLayout :
Dans le fichier Activity_main.xml on a
changer “view group” vers une disposition
linéaire verticale qui est l'une des
dispositions les plus courantes. C'est simple,
rapide et toujours un bon point de départ
Figure 6 : Activity_main.xml
2.3. Ajouter des vues à « Linear Layout » dans l'éditeur de mise en page (Layout Editor) :
➢ On ajoute deux “BUTTON” et
“TextView ”dans notre layout .
Figure 7: Application initial
➢ De cette étage on peut changer ID de
Button 1 et son texte
Figure 8 : Propriétés de Button_toast
5
➢ Toujours on a la possibilité de changer les ID de
TextView et son texte via cette interface intuitive .
Figure 9 : Propriétés de TextView
➢ Ainsi on change ID de Button 2 et son texte .
6
Tâche 3: Modifier la mise en page "Hello Toast" en XML :
Figure 10 : Application avant la modification
La figure (10) présente l’application avant d’appliqué les instructions de modification sur la
mise en page « Hello Toast »
Création des ressources de chaîne de caractères
Figure 11: Création des ressources
7
On constate qu’après l’extraction on trouve toute les ‘Strings’ dans le répertoire
src/res/values/[Link]
Figure 12: fichier : [Link]
Définir des couleurs et des arrière-plans. Afin d’obtenir le résultat afficher dans la figure
ci-dessous :
Figure 13: Changement de design
8
On a modifier les ressources couleurs, styles(ActionBar) et les chaines de caractères comme
le montrant les figures ci-dessous :
Figure 14 : Fichier [Link]
Figure 15: Fichier [Link]
Figure 16 : Fichier Activity_main.xml
9
Travail à faire
L’interface de login demande un identifiant ainsi qu'un mot de passe pour vérifier l'identité
de la personne qui se connecte à l’environnement. Donc on a réalisé ce projet avec 5
vues : imageView,deux editText et deux bouttons.
Figure 17: Application Login
10
Tache 4. Ajouter les handlers OnClick pour les boutons :
Figure 18 : Code complet de tache 4
➢ Exécution d’application :
Figure 19 : Application finale
11
Travail à faire 3 :
➢ On choisit la quantité (la quantité par défaut
est 1) d’article après il suffit de confirmer
l’opération avec un simple clic sur valider la
commande.
Figure 20: Application de commande café
12
