Le principe du RelativeLayout est de placer les éléments selon d’ autres éléments du conteneur.
Voici les différents moyens qui sont à votre disposition pour le placement des éléments dans le cas d’un RelativeLayout :

Positionnement relatif au conteneur

Dans cette relation, vous pouvez lier un élément à son conteneur :

  • android:layout_alignParentTop (true / false) : Cette option permet de préciser si le haut de l’élément doit être aligné avec celui de son conteneur.
  • Même principe pour : android:layout_alignParentBottom, android:layout_alignParentLeft et android:layout_alignParentRight.
  • android:layout_centerHorizontal : Indique si l’élément doit être centré horizontalement dans son conteneur.
  • Même principe pour : android:layout_centerVertical.
  • android:layout_centerInParent : Vous permet d’indiquer que l’élément doit être centré horizontalement et verticalement dans le conteneur.

Position relative aux autres éléments

Afin de pouvoir référencer le positionnement d’un élément par rapport à un autre, vous disposez d’un moyen simple et efficace, il s’agit des identificateurs (ID).

Donc voilà comment vous pouvez utiliser un ID :

  • A la déclaration d’un élément : android:id= “@+id/idElem”
  • A l’utilisation : @id/idElem

Maintenant que les bases sont posées, voici les différentes options disponibles :

  • android:layout_above : Indique que l’élément sera placé au-dessus de celui indiqué par son id.
  • android:layout_below : Indique que l’élément sera placé en dessous de celui indiqué par son id.
  • android:layout_toLeftOf : Indique que l’élément sera placé à gauche de celui indiqué par son id.
  • android:layout_toRightOf : Indique que l’élément sera placé à droite de celui indiqué par son id.
  • android:layout_alignTop : Indique que le haut de notre élément est aligné avec le haut de l’élément indiqué.
  • android:layout_alignBottom : Indique que le bas de notre élément est aligné avec le bas de l’élément indiqué.
  • android:layout_alignLeft : Indique que le côté gauche de notre élément est aligné avec le côté gauche de l’élément indiqué.
  • android:layout_alignRight : Indique que le côté droit de notre élément est aligné avec le côté droit de l’élément indiqué.
  • android:layout_alignBaseLine : Indique que les lignes de base des 2 éléments sont alignées.

On peut bien sur référencer un élément qui sera déclaré plus tard dans le fichier XML (Layout).

On va prendre un exemple pour tout expliquer :

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:orientation="vertical"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 >

<EditText android:id="@+id/nomEdit" android:hint="Entrez votre nom ici"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:layout_alignParentRight="true" android:layout_alignParentTop="true" />

<EditText android:id="@+id/prenomEdit" android:hint="Entrez votre prenom ici"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:layout_alignParentRight="true" android:layout_below="@id/nomEdit" />

<Button android:id="@+id/valider" android:text="valider"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_below="@id/prenomEdit" android:layout_alignRight="@id/prenomEdit" />

<Button android:id="@+id/annuler" android:text="annuler"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_toLeftOf="@id/valider" android:layout_alignTop="@id/valider" />

</RelativeLayout>

Et voici le résultat :

Conclusion

Voilà en espérant que ce tutoriel vous a aidé à comprendre le RelativeLayout et à savoir dans quel cas l’utiliser.

Categories: Tutoriels

13 Responses so far.


  1. [...] Voici un lien pour la liste des différents layout : http://developer.android.com/reference/android/view/ViewGroup.html. Un tutoriel sur le RelativeLayout est disponible à cette adresse : http://www.tutos-android.com/comprendre-relativelayout-android [...]

  2. kamel dit :

    Bonjour, merci pour le tuto mais j’ai une question kel’est la fonction qui permet le chargement du layout et qui permet a son niveau d’ajouter d’autre views, merci

  3. [...] Voici un lien pour la liste des différents layout : http://developer.android.com/reference/android/view/ViewGroup.html. Un tutoriel sur le RelativeLayout est disponible à cette adresse : http://www.tutos-android.com/comprendre-relativelayout-android [...]

  4. [...] Voici un lien pour la liste des différents layout : http://developer.android.com/reference/android/view/ViewGroup.html. Un tutoriel sur le RelativeLayout est disponible à cette adresse : http://www.tutos-android.com/comprendre-relativelayout-android [...]

  5. JayElco dit :

    Bonjour,

    J’ai une question sur le positionnement, comment peut-on mettre une image au premier plan par rapport à une autre.

    Dans mon code, j’ai deux images et la deuxième image doit s’afficher par dessus la première.

    Code :

    Cordialement,

Leave a Reply


Notifiez-moi des commentaires à venir via email. Vous pouvez aussi vous abonner sans commenter.