Un bouton se compose de texte et/ou d'une icône qui communique l'action qui se produit lorsque l'utilisateur appuie dessus.
Vous pouvez créer un bouton dans votre mise en page de trois manières différentes, selon que vous souhaitez créer un bouton avec du texte, une icône ou les deux:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingLeft="16dp" android:paddingRight="16dp" android:orientation="vertical" > <Button android:id="@+id/supabutton" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="I'm a button" /> <ImageButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:contentDescription="A tiny Android icon" android:src="@drawable/baseline_android_24" app:tint="#ff0000" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:drawableStart="@drawable/baseline_android_24" android:drawablePadding="4dp" android:drawableTint="#ff0000" android:text="I'm a button with an icon" /> </LinearLayout>
Le code précédent génère quelque chose comme ceci:
Répondre aux événements de clic
Lorsque l'utilisateur appuie sur un bouton, l'objet Button
reçoit un événement de clic.
Pour déclarer le gestionnaire d'événements de manière programmatique, créez un objet View.OnClickListener
et attribuez-le au bouton en appelant setOnClickListener(View.OnClickListener)
, comme dans l'exemple suivant:
Kotlin
findViewById<Button>(R.id.supabutton) .setOnClickListener { Log.d("BUTTONS", "User tapped the Supabutton") }
Java
Button button = (Button) findViewById(R.id.supabutton); button.setOnClickListener(new View.OnClickListener() { public void onClick(View v) { Log.d("BUTTONS", "User tapped the Supabutton"); } });
Appliquer un style à votre bouton
L'apparence de votre bouton (image de fond et police) varie d'un appareil à l'autre, car les appareils de différents fabricants ont souvent des styles par défaut différents pour les commandes d'entrée.
Pour personnaliser des boutons individuels avec un arrière-plan différent, spécifiez l'attribut android:background
avec une ressource drawable ou de couleur. Vous pouvez également appliquer un style au bouton, qui fonctionne de la même manière que les styles HTML pour définir plusieurs propriétés de style telles que l'arrière-plan, la police et la taille. Pour en savoir plus sur l'application de styles, consultez la section Styles et thèmes.
Bouton sans bordure
Une conception qui peut être utile est un bouton "sans bordure". Les boutons sans bordure ressemblent aux boutons de base, à la différence qu'ils n'ont pas de bordure ni d'arrière-plan, mais qu'ils changent toujours d'apparence selon les différents états, par exemple lorsqu'ils sont enfoncés.
Pour créer un bouton sans bordure, appliquez le style borderlessButtonStyle
au bouton, comme dans l'exemple suivant:
<Button android:id="@+id/supabutton" style="?android:attr/borderlessButtonStyle" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="I'm a button" />
Arrière-plan personnalisé
Si vous souhaitez vraiment redéfinir l'apparence de votre bouton, vous pouvez spécifier un arrière-plan personnalisé. Toutefois, au lieu de fournir un bitmap ou une couleur simple, votre arrière-plan doit être une ressource de liste d'états qui change d'apparence en fonction de l'état actuel du bouton.
Vous pouvez définir la liste des états dans un fichier XML qui définit trois images ou couleurs à utiliser pour les différents états du bouton.
Pour créer un drawable de liste d'état pour l'arrière-plan de votre bouton, procédez comme suit:
- Créez trois bitmaps pour l'arrière-plan du bouton, qui représentent les états du bouton par défaut, sélectionné et sélectionné. Pour vous assurer que vos images peuvent accueillir des boutons de différentes tailles, créez les bitmaps en tant que bitmaps nine-patch.
- Placez les bitmaps dans le répertoire
res/drawable/
de votre projet. Nommez chaque bitmap pour refléter l'état du bouton qu'il représente, par exemplebutton_default.9.png
,button_pressed.9.png
etbutton_focused.9.png
. - Créez un fichier XML dans le répertoire
res/drawable/
. Nommez-labutton_custom.xml
. Insérez du code XML comme suit:<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/button_pressed" android:state_pressed="true" /> <item android:drawable="@drawable/button_focused" android:state_focused="true" /> <item android:drawable="@drawable/button_default" /> </selector>
Cela définit une seule ressource drawable qui modifie son image en fonction de l'état actuel du bouton.
- Le premier
<item>
définit la bitmap à utiliser lorsque le bouton est enfoncé (activé). - Le deuxième
<item>
définit le bitmap à utiliser lorsque le bouton est sélectionné, par exemple lorsqu'il est mis en surbrillance à l'aide du trackball ou du pavé directionnel. - Le troisième
<item>
définit le bitmap à utiliser lorsque le bouton est dans l'état par défaut, qu'il n'a ni appuyé, ni sélectionné.
Ce fichier XML représente une seule ressource drawable. Lorsqu'il est référencé par un
Button
pour son arrière-plan, l'image affichée change en fonction de l'état du bouton. - Le premier
- Appliquez le fichier XML drawable comme arrière-plan du bouton:
<Button android:id="@+id/button_send" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/button_send" android:onClick="sendMessage" android:background="@drawable/button_custom" />
Pour en savoir plus sur cette syntaxe XML, y compris sur la définition d'un bouton désactivé, en survol ou dans un autre état, consultez la page StateListDrawable
.