Le widget de base pour afficher une image est ImageView. On peut lui fournir une image en XML à l'aide de l'attribut android:src dont la valeur est une ressource de type drawable.
L'attribut android:scaleType permet de préciser comment vous souhaitez que l'image réagisse si elle doit être agrandie à un moment (si vous mettez android:layout_width="fill_parent" par exemple).
Le ratio d'une image est le rapport entre la hauteur et la largeur. Si le ratio d'une image est constant, alors en augmentant la hauteur, la largeur augmente dans une proportion identique et vice versa. Ainsi, avec un ratio constant, un carré reste
toujours un carré, puisque quand on augmente la hauteur de x la longueur augmente aussi de x. Si le ratio n'est pas constant, en augmentant une des dimensions l'autre ne bouge pas. Ainsi, un carré devient un rectangle, car, si on étire la hauteur par exemple, la largeur n'augmente pas.
Les différentes valeurs qu'on peut attribuer sont visibles à la figure suivante.
fitXY : la première image est redimensionnée avec un ratio variable et elle prendra le plus de place possible. Cependant, elle restera dans le cadre de l'ImageView.
fitStart : la deuxième image est redimensionnée avec un ratio constant et elle prendra le plus de place possible. Cependant, elle restera dans le cadre de l'ImageView, puis ira se placer sur le côté en haut à gauche de l'ImageView. fitCenter : la troisième image est redimensionnée avec un ratio constant et elle prendra le plus de place possible. Cependant, elle restera dans le cadre de l'ImageView, puis ira se placer au centre de l'ImageView.
fitEnd : la quatrième image est redimensionnée avec un ratio constant et elle prendra le plus de place possible. Cependant, elle restera dans le cadre de l'ImageView, puis ira se placer sur le côté bas à droite de l'ImageView. center : la cinquième image n'est pas redimensionnée. Elle ira se placer au centre de l'ImageView.
centerCrop : la sixième image est redimensionnée avec un ratio constant et elle prendra le plus de place possible. Cependant, elle pourra dépasser le cadre de l'ImageView.
centerInside : la dernière image est redimensionnée avec un ratio constant et elle prendra le plus de place possible. Cependant, elle restera dans le cadre de l'ImageView, puis ira se placer au centre de l'ImageView.
En Java, la méthode à employer dépend du typage de l'image. Par exemple, si l'image est décrite dans une ressource, on va passer par void setImageResource(int id). On peut aussi insérer un objet Drawable avec la méthode void
setImageDrawable(Drawable image) ou un fichier Bitmap avec void setImageBitmap(Bitmap bm). Enfin, il est possible de récupérer l'image avec la méthode Drawable getDrawable().
C'est quoi la différence entre un Drawable et un Bitmap ?
Un Bitmap est une image de manière générale, pour être précis une image matricielle comme je les avais déjà décrites précédemment, c'est-à-dire une matrice (un tableau à deux dimensions) pour laquelle chaque case correspond à une couleur ; toutes les cases mises les unes à côté des autres forment une image. Un Drawable est un objet qui représente tout ce qui peut être dessiné. C'est-à-dire autant une image qu'un ensemble d'images pour former une animation, qu'une forme (on peut définir un rectangle rouge dans un drawable), etc.
Notez enfin qu'il existe une classe appelée ImageButton, qui est un bouton normal, mais avec une image. ImageButton dérive de ImageView.
Pour des raisons d'accessibilité, il est conseillé de préciser le contenu d'un widget qui contient une image à l'aide de l'attribut XML android:contentDescription, afin que les malvoyants puissent avoir un aperçu sonore de ce que contient le widget. Cet attribut est disponible pour toutes les vues.
Autocomplétion
Quand on tape un mot, on risque toujours de faire une faute de frappe, ce qui est agaçant ! C'est pourquoi il existe une classe qui hérite de EditText et qui permet, en passant par un adaptateur, de suggérer à l'utilisateur le mot qu'il souhaite insérer.
Cette classe s'appelle AutoCompleteTextView et on va voir son utilisation dans un exemple dans lequel on va demander à l'utilisateur quelle est sa couleur préférée et l'aider à l'écrire plus facilement.
On peut modifier le nombre de lettres nécessaires avant de lancer l'autocomplétion à l'aide de l'attribut
android:completionThreshold en XML et avec la méthode void setThreshold(int threshold) en Java. Voici le fichier main.xml :
Code : XML <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <AutoCompleteTextView android:id="@+id/complete" android:layout_width="fill_parent" android:layout_height="wrap_content" /> </LinearLayout>
Ensuite, je déclare l'activité AutoCompletionActivity suivante : Code : Java
import android.app.Activity; import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.AutoCompleteTextView;
public class AutoCompletionActivity extends Activity { private AutoCompleteTextView complete = null;
// Notre liste de mots que connaîtra l'AutoCompleteTextView private static final String[] COULEUR = new String[] {
"Bleu", "Vert", "Jaune", "Jaune canari", "Rouge", "Orange" };
@Override
public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// On récupère l'AutoCompleteTextView déclaré dans notre layout complete = (AutoCompleteTextView) findViewById(R.id.complete); complete.setThreshold(2);
// On associe un adaptateur à notre liste de couleurs…
ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_dropdown_item_1line, COULEUR);
// … puis on indique que notre AutoCompleteTextView utilise cet adaptateur
complete.setAdapter(adapter); }
}
Et voilà, dès que notre utilisateur a tapé deux lettres du nom d'une couleur, une liste défilante nous permet de sélectionner celle qui correspond à notre choix, comme le montre la figure suivante.
Vous remarquerez que cette autocomplétion se fait sur la ligne entière, c'est-à-dire que si vous tapez « Jaune rouge », l'application pensera que vous cherchez une couleur qui s'appelle « Jaune rouge », alors que bien entendu vous vouliez le mot « jaune » puis le mot « rouge ». Pour faire en sorte qu'une autocomplétion soit répartie entre plusieurs constituants d'une même chaîne de caractères, il faut utiliser la classe MultiAutoCompleteTextView. Toutefois, il faut préciser quel caractère sera utilisé pour séparer deux éléments avec la méthode void setTokenizer(MultiAutoCompleteTextView.Tokenizer t). Par défaut, on peut par exemple utiliser un MultiAutoCompleteTextView.CommaTokenizer, qui différencie les éléments par des virgules (ce qui signifie qu'à chaque fois que vous écrirez une virgule, le MultiAutoCompleteTextView vous proposera une nouvelle suggestion).
L'affichage d'une liste s'organise de la manière suivante : on donne une liste de données à un adaptateur (Adapter) qui sera attaché à une liste (AdapterView). L'adaptateur se chargera alors de construire les différentes vues à afficher ainsi que de gérer leurs cycles de vie.
Les adaptateurs peuvent être attachés à plusieurs types d'AdapterView : ListView pour lister les vues les unes en dessous des autres. GridView pour afficher les vues dans une grille.
Spinner pour afficher une liste de vues défilante.
Lorsque vous désirez afficher des vues plus complexes, vous devez créer votre propre adaptateur qui étend la super classe BaseAdapter et redéfinir les méthodes en fonction de votre liste de données.
Les boîtes de dialogue peuvent être confectionnées de 2 manières différentes : par la classe Dialog ou par un builder pour construire une AlertDialog, ce qui est plus puissant.