Skip to content

Temas do Modo escuro

O Modo escuro oferece aos usuários a oportunidade de definir uma preferência de cor em todo o sistema (introduzido no Android 10 e no iOS 13). Os temas “escuros” destinam-se a conservar a vida útil da bateria e a reduzir a pressão sobre os olhos dos usuários, além de oferecer aos desenvolvedores de aplicativos uma maneira mais fácil de implementar os temas de cores escuras preferidos pelos usuários.

As mensagens in-app do Braze suportam a adição de um tema escuro alternativo para ajudar a fornecer a mensagem com a cor certa aos seus usuários com base na preferência deles, além de ajudar a manter a consistência com o design do seu aplicativo.

Como funciona o Modo escuro

Os usuários com versões de pelo menos Android 10 ou iOS 13 e posteriores podem ativar ou desativar o Modo escuro nas configurações do dispositivo.

Quando o Modo escuro estiver ativado, os menus e as telas nativas do dispositivo (notificações por push, configurações do dispositivo etc.) mudarão para um cinza escuro. Os aplicativos também podem optar por oferecer suporte ao modo escuro, especificando os temas alternativos no código do aplicativo.

Configuração de um tema do Modo escuro

A nova opção Dark Mode (Modo escuro), localizada na guia Style (Estilo) ao criar uma mensagem no aplicativo, permite adicionar facilmente um tema de cor alternativo para usuários que estão no Modo escuro em seus dispositivos.

O usuário alternava entre os estilos Modo claro e Modo escuro na guia Estilo ao criar uma mensagem no aplicativo.](/docs/pt-br/assets/img_archive/iam-dark-mode.gif?7df25a3fbd472db44f04952101a0e318)

Quando essa opção está ativada, você pode escolher cores de tema escuro para sua mensagem no aplicativo usando o seletor de cores ou selecionando Perfis de cores existentes para reutilizar os temas Escuro ou Claro existentes.

Uso consistente do modo escuro

Para usar o Modo escuro em todas as mensagens no aplicativo, vá para Modelos > Modelos de mensagens no aplicativo.

A partir daí, selecione Create Color Profile (Criar perfil de cores ) no menu suspenso. Crie um perfil de cores que se alinhe ao tema do Modo escuro. Então, sempre que você criar uma versão Dark Mode de uma mensagem in-app, poderá selecionar esse Color Profile e manter a aparência de suas mensagens in-app consistente.

Compatibilidade

  • Seus usuários devem estar em dispositivos iOS versão 13 ou superior, ou em dispositivos Android versão 10 ou superior.
  • Braze iOS SDK v3.21.0+ Braze Android SDK v3.8.0+ é necessário.

Uso de mensagens HTML no aplicativo

Para criar um tema escuro e claro para mensagens HTML no aplicativo, você pode usar o recurso de mídia prefers-color-scheme recurso de mídia CSS para detectar a preferência do usuário.

Por exemplo:

1
2
3
4
5
6
7
8
9
10
11
12
13
@media (prefers-color-scheme: dark) {
  body {
    background: #333;
    color: white;
  }
}

@media (prefers-color-scheme: light) {
  body {
    background: white;
    color: #555;
  }
}
New Stuff!