Améliorer votre widget

Essayez la méthode Compose

Jetpack Compose est le kit d'outils d'interface utilisateur recommandé pour Android. Découvrez comment créer des widgets à l'aide d'API de style Compose.

Jetpack Glance →

Cette page fournit des informations sur les améliorations de widgets facultatives disponibles à partir d'Android 12 (niveau d'API 31). Ces fonctionnalités sont facultatives, mais elles sont simples à implémenter et améliorent l'expérience utilisateur avec les widgets.

Pour découvrir d'autres façons d'améliorer votre widget, consultez le guide Compose Améliorer votre widget.

Utiliser des couleurs dynamiques

À partir d'Android 12, un widget peut utiliser les couleurs du thème de l'appareil pour les boutons, les arrière-plans et d'autres composants. Cela permet des transitions plus fluides et une cohérence entre les différents widgets.

Pour obtenir des couleurs dynamiques, deux méthodes sont possibles :

• Utilisez le thème par défaut du système (@android:style/Theme.DeviceDefault.DayNight) dans la mise en page racine.

• Utilisez le thème Material 3 (Theme.Material3.DynamicColors.DayNight) de la bibliothèque de composants Material pour Android, disponible à partir de la version Material Components for Android 1.6.0.

Une fois le thème défini dans la mise en page racine, vous pouvez utiliser des attributs de couleur courants dans la racine ou l'un de ses enfants pour récupérer les couleurs dynamiques.

Voici quelques exemples d'attributs de couleur que vous pouvez utiliser :

• ?attr/primary
• ?attr/primaryContainer
• ?attr/onPrimary
• ?attr/onPrimaryContainer

Dans l'exemple suivant utilisant le thème Material 3, la couleur du thème de l'appareil est "violet". La couleur d'accentuation et l'arrière-plan du widget s'adaptent aux modes clair et sombre, comme illustré dans les figures 1 et 2.

<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:background="?attr/colorPrimaryContainer"
    android:theme="@style/Theme.Material3.DynamicColors.DayNight">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:tint="?attr/colorPrimaryContainer"
        android:src="@drawable/ic_cloud" />

    <!-- Other widget content. -->

</LinearLayout>
dynamic_colors.xml

Figure 1. Widget dans un thème clair.

Figure 2. Widget dans un thème sombre.

Conseil : Nous vous recommandons d'utiliser le thème Material 3 pour suivre les consignes Material Design afin d'assurer la cohérence entre les appareils et la rétro compatibilité.

Rétrocompatibilité pour les couleurs dynamiques

Les couleurs dynamiques ne sont disponibles que sur les appareils équipés d'Android 12 ou version ultérieure. Pour fournir un thème personnalisé pour les versions antérieures, créez un thème par défaut avec vos couleurs personnalisées et un nouveau qualificatif (values-v31) à l'aide des attributs de thème par défaut.

Voici un exemple utilisant le thème Material 3 :

/values/styles.xml

<resources>
  <style name="MyWidgetTheme" parent="Theme.Material3.DynamicColors.DayNight">
    <!-- Override default colorBackground attribute with custom color. -->
    <item name="android:colorBackground">@color/my_background_color</item>

    <!-- Add other colors/attributes. -->

  </style>
</resources>
styles.xml

/values-v31/styles.xml

<resources>
  <!-- Do not override any color attribute. -->
  <style name="MyWidgetTheme" parent="Theme.Material3.DynamicColors.DayNight" />
</resources>
styles.xml

/layout/my_widget_layout.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="?android:attr/colorBackground"
    android:theme="@style/MyWidgetTheme" />
my_widget_layout.xml

Remarque : Consultez Styles et thèmes pour obtenir un guide détaillé sur la gestion des différents styles, couleurs, attributs et thèmes.

Activer la prise en charge vocale

Les actions dans les applications permettent à l'Assistant Google d'afficher des widgets en réponse aux commandes vocales pertinentes des utilisateurs. En configurant votre widget pour qu'il réponde aux intents intégrés, votre application peut afficher de manière proactive des widgets sur les surfaces de l'Assistant telles qu'Android et Android Auto. Les utilisateurs ont la possibilité d' épingler les widgets affichés par l'Assistant à leur lanceur, ce qui encourage l'engagement futur.

Par exemple, vous pouvez configurer le widget de résumé d'entraînement pour votre application d'exercice afin qu'il exécute les commandes vocales de l'utilisateur qui déclenchent l' GET_EXERCISE_OBSERVATION BII. L'Assistant affiche de manière proactive votre widget lorsque les utilisateurs déclenchent cet intent intégré en effectuant des requêtes telles que "Hey Google, combien de kilomètres ai-je parcourus cette semaine sur Exempled'Appli ?"

Il existe des dizaines d'intents intégrés couvrant plusieurs catégories d'interaction utilisateur, ce qui permet à presque toutes les applications Android d'améliorer leurs widgets pour la voix. Pour commencer, consultez Intégrer les actions dans les applications avec les widgets Android.

Activer des transitions plus fluides

À partir d'Android 12, les lanceurs offrent une transition plus fluide lorsqu'un utilisateur lance votre application à partir d'un widget.

Pour activer cette transition améliorée, utilisez @android:id/background ou android.R.id.background pour identifier votre élément d'arrière-plan :

<!-- Top-level layout of the widget. -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/background"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
</LinearLayout>
smooth_transitions.xml

Avertissement : Évitez d'utiliser des trampolines de diffusion. À partir d'Android 12, une application peut toujours lancer une activité à partir d'un broadcast receiver ou d'un service si elle est lancée à partir du clic sur un widget PendingIntent. Toutefois, la nouvelle animation d'application n'est pas utilisée pour les applications lancées à partir d'un broadcast receiver ou d'un service, ce qui entraîne une mauvaise expérience utilisateur.

Votre application peut utiliser @android:id/background sur les versions précédentes d'Android sans se bloquer, mais elle est ignorée.

Utiliser la modification au moment de l'exécution de RemoteViews

À partir d'Android 12, vous pouvez profiter de plusieurs méthodes RemoteViews qui permettent de modifier les attributs RemoteViews au moment de l'exécution. Consultez la documentation de référence de l'API RemoteViews pour obtenir la liste complète des méthodes ajoutées.

L'exemple de code suivant montre comment utiliser certaines de ces méthodes.

// Set the colors of a progress bar at runtime.
remoteView.setColorStateList(
    R.id.progress, "setProgressTintList", createProgressColorStateList()
)

// Specify exact sizes for margins.
remoteView.setViewLayoutMargin(
    R.id.text, RemoteViews.MARGIN_END, 8f, TypedValue.COMPLEX_UNIT_DIP
)
Enhance.kt