Androideur.com

Nous allons voir dans ce tutoriel comment manipuler facilement la mise en forme du texte que nous avons affiché dans le tutoriel « Hello World », notre première application Android. Nous avons déjà créé un premier XML Layout que nous allons enrichir avec quelques propriétés afin de :

• Centrer le texte
• Changer la couleur de l’arrière plan
• Changer la couleur du texte

Comme nous avons vu, le système de construction des Interfaces Utilisateur des applications Android se base sur des fichiers XML. Ouvrons notre fichier XML layout : res/layout/main.xml qui doit ressembler à ce-ci :

<?xml version="1.0" encoding="utf-8"?>
	<TextView xmlns:android="http://schemas.android.com/apk/res/android"
	  android:id="@+id/textview"
	  android:layout_width="fill_parent"
	  android:layout_height="fill_parent"
	  android:text="@string/hello"/>

Centrer le texte

Afin de center le texte « Bonjour Android ! », nous allons ajouter un premier attribut : gravity et demander à notre application de center horizontalement le texte. gravity prendra donc comme valeur : center_horizontal

Voyons ce que ça donne :

<?xml version="1.0" encoding="utf-8"?>
	<TextView xmlns:android="http://schemas.android.com/apk/res/android"
	  android:id="@+id/textview"
	  android:layout_width="fill_parent"
	  android:layout_height="fill_parent"
	  android:gravity="center_horizontal"
	  android:text="@string/hello"/>

Et sur l’émulateur, ça va bien donner ça :

On voudra Aussi center verticalement notre texte. Très intuitif, oui ; gravity prendra aussi  la valeur center_vertical.

Faisons quand même attention ici à la syntaxe :

<?xml version="1.0" encoding="utf-8"?>
	<TextView xmlns:android="http://schemas.android.com/apk/res/android"
	  android:id="@+id/textview"
	  android:layout_width="fill_parent"
	  android:layout_height="fill_parent"
	  android:gravity="center_vertical|center_horizontal"
	  android:text="@string/hello"/>

Un petit run pour vérifier :

Changer la couleur de l’arrière plan

C’est très intuitif, oui. Ajoutons un attribut background avec comme valeur un code couleur plutôt clair : #E9EEF2 par exemple (pour rester dans le thème Androideur.com)

<?xml version="1.0" encoding="utf-8"?>
	<TextView xmlns:android="http://schemas.android.com/apk/res/android"
	  android:id="@+id/textview"
	  android:layout_width="fill_parent"
	  android:layout_height="fill_parent"
	  android:gravity="center_vertical|center_horizontal"
	  android:background="#E9EEF2"
	  android:text="@string/hello"/>

Pas de surprise :

Changer la couleur du texte

Nous aurons besoin de l’attribut textColor cette fois, avec comme valeur : #535A5F.

Profitons aussi pour mettre le texte en gras en ajoutant l’attribut textStyle= »bold »

<?xml version="1.0" encoding="utf-8"?>
	<TextView xmlns:android="http://schemas.android.com/apk/res/android"
	  android:id="@+id/textview"
	  android:layout_width="fill_parent"
	  android:layout_height="fill_parent"
	  android:gravity="center_vertical|center_horizontal"
	  android:textColor="#535A5F"
	  android:textStyle="bold"
	  android:background="#E9EEF2"
	  android:text="@string/hello"/>

Un dernier run :

Voilà tout ! Nous avons vu quelques manipulations basiques pour mettre en forme un texte dans une application Android. Nous sommes désormais prêt à voir les différents layout de plus près.

A la prochaine.