Styles et Thèmes

 

Nous avons déjà vu qu'il était possible de définir la hauteur, la largeur, la couleur, le style de la police, ... sur les objets.

Les attributs les plus courants sont :

- android:layout_width et android:layout_height pour indiquer la place qu'occupera le label (voir chapitre Positionnement et occupation des surfaces des widgets)

- android:typeface Pour indiquer le type de la police qui sera utilisé pour afficher le texte du label
- android:textStyle Pour indiquer si le texte doit être en gras (bold), en italique (italic) ou les deux (bold_italic) ;
- android:textColor Pour indiquer la couleur du texte du label (format RGB hexadécimal #RRVVBB).

Le problème, la solution utilisée implique de positionner ces attributs sur tous les objets. Lorsque ces attributs sont communs à tous les objets, cela va vite devenir pénible de tout le temps dupliquer ces attributs !

 

Il existe cependant une solution que nous allons voir maintenant...

Regrouper les styles dans un fichier XML

Créez dans le répertoire res/values/ un fichier XML du nom que vous voulez, représentant les styles que vous voulez regrouper dans ce fichier.

Ce fichier doit commencer par la balise <resources>.

Vous ajoutez ensuite une balise <style name="Nom de votre style">

Dans cette balise, vous positionnerez les différents attributs android:layout_width, android:layout_height, android:textColor, ... à l'aide de la balise item comme suit:

<item name="android:layout_width">fill_parent</item>

<item name="android:layout_height">fill_parent</item>

...

Un exemple est plus parlant...

Voici un fichier que je nomme monStyle.xml (pour le créer, faîtes simplement depuis le menu File, new, option other et choisir "Android XML Values File". Choisir le nom de votre fichier et "ressources" comme noeud de départ de votre fichier XML, à l'écran suivant contrôler le répertoire qui doit être res/values puis finish.

Dedans création d'un style nommé "StylePourTexte", puis les attributs de styles sont positionnés.

 

Utiliser le fichier XML de styles

Bien, maintenant que vous avez créé un fichier de styles, il serait bien de pouvoir l'exploiter !

Vous voulez un style, et celui-ci est nommé (grace à la balise balise <style name="Nom de votre style">).

Il ne vous reste plus qu'à l'indiquer dans le ou les objets sur lesquels vous souhaitez voir s'appliquer le style.

Exemple avec le code HelloWorld, dans le fichier main.xml:

A l'aide du mot clé style, je vais indiquer le style à utiliser (ici "StylePourTexte").

 

Héritage de style

Il est possible d'indiquer un parent sur la définition d'un style. La balise style est dans ce cas complétée de:

<style name="Nom de votre style" parent="@android:style/le style>

Vous trouverez des styles Widget, Text, ... (n'oubliez pas ctrl+espace pour l'auto complétion sous eclipse...)

Dans mon exemple, si vous voulez utiliser une police large, remplacez:

<style name="StylePourTexte"> par

<style name="StylePourTexte" parent="@android:style/TextAppearance.Large">

et voyez le résultat !

Il est possible aussi d'hériter d'un style que vous auriez vous même créé. Dans ce cas, vous n'utiliserez pas parent, mais vous préciserez le nom du style à hériter dans le nom de votre nouveau style de la manière suivante:

Nom_du_style_a_herité.nouveau_style

Le point n'est pas facultatif, c'est lui qui permet de distinguer le style à hériter et le nouveau style que vous voulez créer !

Du multi héritage sera possible, Style1.Style2.nouveau_style.

Il suffit d'ajouter autant de styles que vous voulez, en utilisant le . comme séparateur.

 

Les thèmes

Il est possible d'appliquer des thèmes soit sur votre activité, soit carrément sur votre application !

Tout ce passe dans le manifest.xml de votre application

Sur l'activité, ajoutez dans la balise activité ceci:

<activity [...]

android:theme="nom du thème"

[...]>

 

Ou sur l'application

<application [...]

android:theme="nom du thème"

[...]>

 

Le nom du thème peut soit être un de ceux définis sous Android android:

"@android:style/Theme.le_thème" par exemple "@android:style/Theme..Light" pour avoir un fond blanc

((Là encore, ctrl+espace sur "@android:style/Theme. pour avoir la liste des thèmes sous eclipse...)

Ou il pourra être un style que vous avez défini (voire ayant un thème android comme parent), ...

 

Autres

Et bien, c'est tout ! Pour plus d'infos, ou d'exemples, voyez sur le site:

http://developer.android.com/guide/topics/ui/themes.html