Cours N°3

Interfaces graphiques

Rami AMRI (rami.amri@gmail.com)

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