Transcript Développement Mobile : Android

Cours N°3
Interfaces graphiques
Rami AMRI ([email protected])
FST
2011/2012



Les élements graphiques héritent de la classe
View.
On peut regrouper des éléments graphiques
dans une ViewGroup.
Des ViewGroup particuliers sont prédéfinis:
ce sont des layouts (gabarits) qui proposent
une prédispositions des objets graphiques:




LinearLayout: dispose les éléments de gauche
à droite ou du haut vers le bas
RelativeLayout: les éléments enfants les uns
par rapport aux autres
TableLayout: disposition matricielle
FrameLayout: disposition en haut à gauche
en empilant les éléments
Les plus importants sont:
 android:layout_width et android:layout_height:
◦ ="fill_parent": l'élément remplit tout l'élément parent
◦ ="wrap_content": prend la place nécessaire à l'affichage


android:orientation: définit l'orientation
d'empilement
android:gravity: définit l'alignement des éléments


Une interface graphique définie en XML sera
aussi générée comme une ressource dans la
classe statiqueR.
Le nom du fichier xml, par example accueil.xml
permet de retrouver le layout dans le code java
au travers de R.layout.accueil.

Associer la première vue graphique à l'activité
principale de l'application :



Le layout reste modifiable au travers du code,
comme tous les autres objets graphiques.
Pour cela, il est important de spécifier un id
dans la définition XML du layout
(android:id="@+id/accueilid")
Ainsi, on peut accéder à cet élément par son
id et agir dessus au travers du code Java:
Un Layout peut contenir des éléments
graphiques, ou d'autres Layout.
 Les labels de texte
◦ En XML:
◦ Par la programmation

Les images
◦ Par Xml
◦ Par la programmation:

Les Zones textes
◦ Par XML
◦ Par la programmation

Les boutons :
◦ En XML:

La gestion des événements de click se font
par l'intermédiaire d'un listener:
Les listes:
 Au sein d'un Layout, on peut implanter une
liste que l'on pourra dérouler si le nombre
d'éléments est important.

pour afficher une liste d’items dans celle-ci, il
lui faut un adaptateur de données.


Dans notre activité principale, nous allons
récupérer notre ListView et lui affecter un
adaptateur grâce à la méthode setAdapter,
Ajoutons-y un objet de
type ArrayAdapter, contenant une liste de
String avec un layout générique d’item que
fournit la plateforme par défaut et enfin la
liste des données.
Remarque:
Syntaxe :
 ArrayAdapter<Type de données>(le contexte,le
style des items,les données);
Les onglets:
 La réalisation d'onglets permet de mieux
utiliser l'espace réduit de l'écran.


Pour réaliser les onglets, il faut suivre une
structure très particulière pour le layout .
Les différents onglets sont ensuite créé
dynamiquement par le code, en associant à
chaque onglet l'activité correspondante.

Main.xml :


TabWidget :
contiendra les
onglets
FrameLayout
contiendra le
contenu de
ses onglets


Ensuite on va crée trois fichiers XML qui
contiendra l'interface du contenu de chaque
onglet (ici un TextView)
Onglet1.xml

Onglet2.xml

Onglet3.xml
Partie JAVA :


On commence par créer notre activité
principale TabAndroidActivity.java
On place tout les imports nécessaires :

Puis on doit avoir :

Lier le premier onglet à l’activité principale:

Lier le deuxième onglet à l’activité principale:

Lier le Troisième onglet à l’activité principale:

On peut définir l’onglet par défaut avec :
tabHost.setCurrentTab(0);
Maintenant, nous créons nos classes pour les
onglets :

Ne pas oublier de déclarer les activités des
onglets dans l’android manifest