Os cards de notificação transmitem pequenas quantidades de informações oportunas do sistema ou de um app.
O objetivo desses cards para o Android Automotive OS é minimizar as distrações para os motoristas. Os cards vêm em três versões básicas:
- Card de notificação de alerta (HUN, na sigla em inglês):usado para uma notificação que aparece brevemente na tela atual.
- Card da Central de notificações:usado para notificações listadas na Central de notificações
- Card de notificação agrupada:combina vários cards da Central de notificações em um card.
Nessas versões, os designs também podem variar um pouco, dependendo da categoria da mensagem. Por exemplo, as notificações de chamada têm botões e ícones diferentes das notificações de navegação.
Anatomia
O card de notificação é um componente flexível que pode incluir vários elementos. Ele tem três versões principais:
- Cartão HUN: esta versão é mais larga que o card da Central de Notificações e aparece na parte superior da tela atual até ser dispensada.
- Card da Central de notificações:esta versão é mais restrita que o card da HUN e aparece com outros cards da Central de notificações em uma lista vertical.
- Card de notificação agrupada: esta versão do card da Central de Notificações combina várias notificações relacionadas em um card, com controles de expansão para mostrar cada notificação.
As variantes dessas versões por tipo de mensagem são mostradas em Estilos.
1. Cabeçalho
2. Conteúdo (com e sem visualização opcional de mensagens, que pode ser ocultada quando o carro está dirigindo)
3. Ações
4. Ícone grande
1. Cabeçalho
2. Conteúdo
3. Expandir/recolher ação
4. Expandir/recolher indicador
Especificações: cartão HUN
HUN padrão
HUN com avatar
HUN de mensagens com visualização
HUN de mensagens com várias mensagens
HUN de imagem grande
Especificações: cartão da Central de Notificações
Notificação padrão
Notificação de mensagem com visualização
Notificação com várias mensagens
Notificação de ação única
Especificações: cartão de notificação agrupado
Notificação agrupada: recolhida
Notificação agrupada: expandida
Como dimensionar layouts
Esses layouts de referência mostram como adaptar notificações para acomodar telas de várias larguras e alturas. As categorias de largura e altura são definidas na seção Layout. Todos os valores de pixel estão em pixels renderizados, antes de qualquer amostragem para baixo ou para cima.
Telas de largura padrão
Telas largas
Telas extragrandes e super amplas
Espaçamento vertical das notificações em telas de várias alturas
As especificações de espaçamento vertical nesta seção são apenas para cartões HUN. Para saber mais sobre o espaçamento vertical dos cards na Central de notificações, consulte as especificações da Central de notificações.
Telas curtas
Telas altas e padrão
Estilos
Tipografia
| Estilo de digitação | Fonte | Peso | Tamanho (dp) |
|---|---|---|---|
| Texto 1 | Roboto | Normal | 32 |
| Carroceria 3 M | Roboto | Médio | 24 |
| Corpo 3 | Roboto | Normal | 24 |
Cor
| Elemento | Cor(modo dia) | Cor (modo noturno) |
|---|---|---|
| Tipo / ícones principais | Branco | Branco 88% |
| Tipo secundário | Branco a 72% | Branco a 60% |
| Ícone secundário | Sotaque de terceiros | Sotaque de terceiros |
| Divisória de divisória | Branco 22% | Branco 12% |
| Plano de fundo do cartão | Cinza 868 | Cinza 900 |
| Scrim gradiente | Preto 100% - 0% | Preto de 100% a 20% |
Dimensionamento
| Elemento | Tamanho (dp) |
|---|---|
| Ícone principal | 44 |
| Ícone secundário | 36 |
| Avatar médio | 76 |
| Raio arredondado dos cantos (R2) | 8 |
Exemplos
Movimento
Os seguintes movimentos são uma parte importante da experiência de notificação:
- Movimento de chegada à HUN
- Movimento de deslizar para dispensar uma notificação
- Movimentos de expansão e recolhimento de notificações agrupadas
Chegada à HUN
Deslizar para dispensar
Expansão e recolhimento da notificação agrupada
