Os widgets são um aspecto essencial da personalização da tela inicial. Você pode pensar nelas como visualizações resumidas dos dados e funcionalidades mais importantes de um app que podem ser acessadas diretamente na tela inicial do usuário. Os usuários podem mover widgets pelos painéis da tela inicial e, se houver suporte, redimensioná-los para personalizar a quantidade de informações no widget de acordo com as preferências deles.
Esta documentação apresenta os diferentes tipos de widgets que você pode criar e os princípios de design que precisam ser seguidos. Para criar um widget de app usando as APIs Remove View e os layouts XML, consulte Criar um widget simples. Para criar um widget usando as APIs de estilo Kotlin e Compose, consulte Jetpack Glance.
Tipos de widget
Ao planejar seu widget, pense no tipo que você quer criar. Os widgets geralmente se enquadram em uma das seguintes categorias:
Widgets de informação
Os widgets de informação normalmente exibem elementos de informação cruciais e monitoram como essas informações mudam ao longo do tempo. Exemplos de widgets de informações são widgets de clima, widgets de relógio ou widgets de monitoramento de placares esportivos. Normalmente, o toque nos widgets de informação inicia o app associado e abre uma visualização detalhada das informações do widget.
Widgets de coleção
Os widgets de coleção são especializados na exibição de vários elementos do mesmo tipo, como uma coleção de imagens de um app de galeria, uma coleção de artigos de um app de notícias ou uma coleção de e-mails ou mensagens de um app de comunicação. Os widgets de coleção podem rolar a tela verticalmente.
Os widgets de coleção geralmente se concentram nos seguintes casos de uso:
- Navegar pela coleção.
- Abrir um elemento da coleção para a visualização de detalhes no app associado.
- Interagir com elementos, como marcá-los como concluídos, com suporte para botões compostos no Android 12 (nível 31 da API).
Widgets de controle
O objetivo principal de um widget de controle é mostrar as funções usadas com frequência para que o usuário possa acioná-las na tela inicial sem precisar abrir o app. Pense neles como controles remotos para um app. Um exemplo de widget de controle é um widget de automação residencial que permite aos usuários ligar ou desligar as luzes da casa.
A interação com um widget de controle pode abrir uma visualização de detalhes associada no app. Isso depende se a função do widget de controle gera dados, como no caso de um widget de pesquisa.
Widgets híbridos
Embora alguns widgets representem um dos tipos nas seções anteriores (informação, coleta ou controle), muitos deles são híbridos que combinam elementos de tipos diferentes. Por exemplo, um widget de player de música é principalmente um widget de controle, mas também mostra ao usuário qual faixa está tocando no momento, como um widget de informações.
Ao planejar o widget, projete com base em um dos tipos base e adicione elementos de outros tipos conforme necessário.
Integrar widgets ao Google Assistente
O Google Assistente pode mostrar qualquer tipo de widget em resposta a comandos de voz do usuário. Você pode configurar seus widgets para realizar Ações no app, permitindo que os usuários recebam respostas rápidas e experiências interativas de apps em plataformas do Google Assistente, como o Android e o Android Auto. Para saber mais sobre o fulfillment de widgets do Google Assistente, consulte Integrar Ações no app com widgets do Android.
Limitações de widgets
Embora os widgets possam ser entendidos como "miniapps", existem determinadas limitações que é importante entender antes de projetar seu widget.
Gestos
Como os widgets ficam na tela inicial, eles precisam coexistir com a navegação estabelecida ali. Isso limita o suporte a gestos disponível em um widget em comparação com um app em tela cheia. Embora os apps possam permitir que os usuários naveguem entre telas na horizontal, esse gesto já é usado na tela inicial para navegar entre telas iniciais.
Os únicos gestos disponíveis para widgets são o toque e o deslizar vertical.
Elementos
Devido às limitações dos gestos disponíveis para widgets, alguns elementos básicos da interface que dependem de gestos restritos não estão disponíveis para widgets. Para conferir uma lista completa de elementos básicos com suporte e mais informações sobre restrições de layout, consulte Criar o layout de widget e Fornecer layouts de widget flexíveis.
Diretrizes de design
Conteúdo dos widgets
Os widgets são uma ótima maneira de atrair um usuário para seu app, "anunciando" conteúdo novo e interessante disponível nele.
Assim como os teasers na primeira página de um jornal, os widgets consolidam e concentraram as informações de um app e fornecem uma conexão a detalhes mais avançados dentro do app. Você pode dizer que o widget é o "lanche" das informações, enquanto o app é a "refeição". Verifique se o app mostra mais detalhes sobre um item de informação do que o que o widget mostra.
Navegação por widgets
Além do conteúdo informativo, considere fazer com que o widget forneça links de navegação para áreas usadas com frequência do app. Isso permite que os usuários concluam tarefas mais rapidamente e estenda o alcance funcional do app para a tela inicial.
Bons candidatos para links de navegação em widgets são:
Funções generativas:são funções que permitem ao usuário criar novos conteúdos para um app, como a criação de um documento ou uma nova mensagem.
Abra o app no nível superior:tocar em um elemento de informação geralmente leva o usuário a uma tela de detalhes de nível inferior. Fornecer acesso ao nível superior do app oferece mais flexibilidade de navegação e pode substituir um atalho de app dedicado que os usuários usam para navegar até o app pela tela inicial. O uso do ícone do aplicativo para essa funcionalidade também pode fornecer ao widget uma identidade clara se os dados mostrados forem ambíguos.
Redimensionamento de widgets
Tocar em um widget redimensionável, mantê-lo pressionado e soltá-lo coloca o widget no modo de redimensionamento. Os usuários podem arrastar as alças ou os cantos do widget para definir o tamanho preferido.
O redimensionamento permite que os usuários ajustem a altura e a largura de um widget dentro das restrições da grade de posicionamento da tela inicial. Você pode decidir se o widget pode ser redimensionado livremente ou se está restrito a mudanças de tamanho horizontal ou vertical. Não é necessário oferecer suporte ao redimensionamento se o widget for inerentemente de tamanho fixo.
Permitir que os usuários redimensionem widgets tem benefícios importantes:
- Eles podem ajustar a quantidade de informações que querem ver em cada widget.
- Eles podem influenciar melhor o layout de widgets e atalhos nos painéis inicial.
Planeje uma estratégia de redimensionamento para seu widget de acordo com o tipo que você está criando. Os widgets de coleção baseados em lista ou grade geralmente são simples, porque o redimensionamento aumenta ou diminui a área de rolagem vertical. Independentemente do tamanho do widget, o usuário ainda pode rolar todos os elementos de informação para visualização.
Os widgets de informações exigem mais planejamento prático, porque eles não são roláveis e todo o conteúdo precisa caber em um determinado tamanho. Você precisa ajustar dinamicamente o conteúdo e o layout do widget para o tamanho definido pelo usuário usando a operação de redimensionamento.
No exemplo a seguir, o usuário pode redimensionar um widget de clima em três etapas, expondo informações mais detalhadas sobre o clima no local atual conforme o widget aumenta.
Para cada tamanho de widget, determine quantas informações do app são exibidas. Para tamanhos menores, concentre-se nas informações essenciais e adicione informações contextuais à medida que o widget cresce horizontal e verticalmente.
Considerações sobre layout
É tentador dispor os widgets de acordo com as dimensões da grade de posicionamento de um dispositivo com que você desenvolve. Essa pode ser uma aproximação inicial útil, mas tenha em mente os seguintes pontos:
- Planejar sua estratégia de redimensionamento de widgets em "buckets de tamanho" em vez de dimensões de grade variáveis fornece resultados mais confiáveis.
- O número, o tamanho e o espaçamento das células podem variar muito de dispositivo para dispositivo. Portanto, é muito importante que o widget seja flexível e possa acomodar mais ou menos espaço do que o previsto.
- Quando o usuário redimensiona um widget, o sistema responde com um intervalo de tamanho de dp em que o widget pode ser redesenhado.
- A partir do Android 12, você pode fornecer atributos de tamanho mais refinados
e layouts mais flexíveis. Isso inclui:
- Como especificar restrições de tamanho de widget. Por exemplo, é possível especificar o tamanho de destino do widget, em células de grade, bem como o tamanho máximo possível.
- Fornecer layouts responsivos, que mudam dependendo do tamanho do widget.
- Fornecer layouts de tamanho exato, que permitem que a tela de início responda com opções de tamanho para os modos retrato e paisagem para smartphones ou com quatro tamanhos para dispositivos dobráveis.
- Usar orientações atualizadas e novas APIs para determinar o tamanho adequado do widget.
Configuração de widget pelos usuários
Às vezes, o usuário precisa configurar o widget antes que ele se torne útil. Pense em um widget de e-mail em que o usuário precisa selecionar a pasta de e-mails antes que a caixa de entrada seja exibida ou em um widget de fotos estáticas em que o usuário precisa atribuir uma imagem da galeria para ser exibida. Os widgets do Android exibem as opções de configuração logo depois que o usuário solta o widget em uma tela inicial.
Lista de verificação do design de widgets
- Concentre-se em pequenas porções de informações relevantes no seu widget. Expanda as informações no app.
- Escolha o tipo certo de widget para sua finalidade.
- Planeje como o conteúdo do widget se adapta a diferentes tamanhos.
- Torne o layout do widget independente da orientação e do dispositivo, garantindo que o layout possa se esticar e contrair.
- Considere se o widget precisa de mais configurações.