Aprimorar seu widget

Experimente trabalhar com o Compose
O Jetpack Compose é o kit de ferramentas de IU recomendado para Android. Aprenda a criar widgets usando APIs no estilo do Compose.

Esta página inclui detalhes sobre melhorias opcionais de widgets disponíveis no Android 12 (nível 31 da API) e versões mais recentes. Esses recursos são opcionais, mas são fáceis de implementar e melhoram a experiência do usuário com o widget.

Para outras maneiras de melhorar seu widget, consulte o guia do Compose Melhorar seu widget.

Usar cores dinâmicas

No Android 12, um widget pode usar as cores do tema do dispositivo para botões, planos de fundo e outros componentes. Isso proporciona transições mais suaves e consistência entre diferentes widgets.

Há duas maneiras de usar cores dinâmicas:

  • Use o tema padrão do sistema (@android:style/Theme.DeviceDefault.DayNight) no layout raiz.

  • Use o tema do Material 3 (Theme.Material3.DynamicColors.DayNight) da biblioteca Componentes do Material Design para Android, disponível a partir da versão 1.6.0.

Depois que o tema é definido no layout raiz, você pode usar atributos de cor comuns na raiz ou em qualquer um dos filhos para escolher as cores dinâmicas.

Veja alguns exemplos de atributos de cor que você pode usar:

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

No exemplo a seguir, que usa o tema do Material 3, a cor do tema do dispositivo é "arroxeada". A cor de destaque e o plano de fundo do widget se adaptam aos modos claro e escuro, conforme mostrado nas figuras 1 e 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>

Widget no tema do modo claro
Figura 1. Widget no tema claro.
Widgets no tema do modo escuro
Figura 2. Widget no tema escuro.

Compatibilidade com versões anteriores para cores dinâmicas

As cores dinâmicas estão disponíveis apenas em dispositivos com o Android 12 ou versões mais recentes. Para fornecer um tema personalizado para versões anteriores, crie um tema padrão com suas cores personalizadas e um novo qualificador (values-v31) usando os atributos de tema padrão.

Confira um exemplo usando o tema do 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>

/values-v31/styles.xml

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

/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" />

Ativar o suporte por voz

As Ações no app permitem que o Google Assistente mostre widgets em resposta a comandos de voz relevantes do usuário. Ao configurar o widget para responder a intents integradas (BIIs), seu app pode exibir widgets de forma proativa em plataformas do Google Assistente, como o Android e o Android Auto. Os usuários têm a opção de fixar widgets mostrados pelo Google Assistente na tela de início, incentivando o engajamento futuro.

Por exemplo, é possível configurar o widget de resumo de treino do seu app de exercícios para atender aos comandos de voz do usuário que acionam a BII GET_EXERCISE_OBSERVATION. O Google Assistente mostra seu widget de forma proativa quando os usuários acionam essa BII fazendo solicitações como "Ok Google, quantos quilômetros eu corri esta semana no ExampleApp?".

Existem dezenas de BIIs que abrangem várias categorias de interação do usuário, permitindo que quase todos os apps Android melhorem os widgets para voz. Para começar, consulte Integrar as Ações no app com widgets do Android.

Ativar transições mais suaves

No Android 12, as telas de início oferecem uma transição mais suave quando um usuário inicia o app de um widget.

Para ativar essa transição melhorada, use @android:id/background ou android.R.id.background para identificar seu elemento de plano de fundo:

<!-- 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>

Seu app pode usar @android:id/background em versões anteriores do Android sem falhas, mas ele será ignorado.

Usar a modificação de RemoteViews durante a execução

A partir do Android 12, é possível aproveitar vários métodos RemoteViews que permitem a modificação de atributos RemoteViews no ambiente de execução. Consulte a referência da API RemoteViews para ver a lista completa de métodos adicionados.

O exemplo de código a seguir mostra como usar alguns desses métodos.

// 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
)