O código da UI do Safety Center está localizado no diretório safetycenter packages/modules/Permission/PermissionController/src/com/android/permissioncontroller/safetycenter/ . Personalize a UI do Safety Center usando Runtime Resource Overlays (RROs) na pasta de sobreposição OEM. Para obter informações sobre RROs, consulte Alterar o valor dos recursos de um aplicativo em tempo de execução .
Temas e cores da Central de Segurança
O Safety Center tem quatro temas principais que compartilham os mesmos atributos da IU:
- Luz da Central de Segurança
- Central de segurança escura
- Luz de configurações rápidas da Central de segurança
- Configurações rápidas da Central de segurança escuras
Os temas do Safety Center contêm cores padrão. As principais cores da IU são extraídas das cores do sistema Android e podem se adaptar automaticamente com a personalização geral das cores do Android pelo OEM. Por padrão, essas cores se adaptam como parte do estilo do Material You no Android.
Você pode alterar as cores do Safety Center substituindo seus valores.
| Cor da interface do usuário da Central de Segurança | Nome do Atributo | Recurso |
|---|---|---|
| Fundo | android:colorBackground | @android:color/background_device_default_light@android:color/primary_dark_device_default_settings |
| Superfície | colorSurface | @color/sc_surface_light @color/sc_surface_dark |
| Variante de superfície | colorSurfaceVariant | @color/sc_surface_variant_light@color/sc_surface_variant_dark |
| Texto principal | android:textColorPrimary | @android:color/text_color_primary |
| Texto secundário | android:textColorSecondary | @android:color/text_color_secondary |
| Ícones | android:textColorSecondary | @android:color/text_color_secondary |
| Recurso | Valor padrão |
|---|---|
@color/sc_surface_light | @android:color/system_neutral1_500 com um valor de estrela L de 98 (luminância perceptual) |
@color/sc_surface_dark | @android:color/system_neutral1_800 |
@color/sc_surface_variant_light | @android:color/system_neutral2_100 |
@color/sc_surface_variant_dark | @android:color/system_neutral1_700 |
Cores de gravidade do problema
O Safety Center comunica a gravidade do problema com um sistema de cores de semáforo:
- Verde para questões informativas e status OK
- Amarelo para recomendações
- Vermelho para problemas sérios
- Cinza por falta de informação
Por padrão, essas cores são extraídas da paleta de cores do Google Material. Recomendamos que você mantenha essas cores básicas, mas você pode usar diferentes tons da paleta verde, amarelo e vermelho.
Esses atributos de cores são usados para associar itens com cores de gravidade na interface do Safety Center, incluindo ícones, botões e animações de verificação e alteração de status. Modificar essas cores recolorirá todos os elementos. Por exemplo, modificar @color/sc_status_info_{light,dark} altera a cor de fundo na imagem de status estática e na animação do fundo durante uma varredura.
O tema Configurações rápidas do Safety Center usa cores do modo escuro, esteja o dispositivo configurado ou não no modo escuro.
| Gravidade | Elemento da IU | Atributo ou nome do recurso | Cor padrão |
|---|---|---|---|
| Informações (Verde) | Escudo de status | ?attr/colorScStatusInfo | Luz: Verde 600 (#1e8e3e) Escuro: Verde 500 (#34a853) |
| Contêiner de escudo de status | ?attr/colorScStatusBackgroundInfo | Luz: Verde 100 (# ceead6)colorSurfaceVariant | |
| Ícone | ?attr/colorScIconInfo | Verde 500 (#34a853) | |
| Botão de ação principal | @color/safety_center_button_info | Verde 400 (#5bb974) | |
| Botão de ação secundária | @color/safety_center_outline_button_info | Verde 300 (#81c995) | |
| Recomendação (Amarelo) | Escudo de status | ?attr/colorScStatusRecommend | Luz: Amarelo 600 (#f9ab00) Escuro: Amarelo 500 (#fbbc04) |
| Contêiner de escudo de status | ?attr/colorScStatusBackgroundRecommend | Claro: Amarelo 100 (#feefc3) Escuro: colorSurfaceVariant | |
| Ícone | ?attr/colorScIconRecommend | Amarelo 500 (#fbbc04) | |
| Botão de ação principal | @color/safety_center_button_recommend | Amarelo 400 (#fcc934) | |
| Botão de ação secundária | @color/safety_center_outline_button_recommend | Amarelo 300 (#fdd663) | |
| Aviso (vermelho) | Escudo de status | ?attr/colorScStatusWarn | Luz: Vermelho 600 (#d93025) Escuro: Vermelho 500 (#ea4335) |
| Contêiner de proteção de status | ?attr/colorScStatusBackgroundWarn | Luz: Vermelho 100 (#fad2cf) Escuro: colorSurfaceVariant | |
| Ícone | ?attr/colorScIconWarn | Vermelho 500 (#ea4335) | |
| Botão de ação principal | @color/safety_center_button_warn | Vermelho 400 (#ee675c) | |
| Botão de ação secundária | @color/safety_center_outline_button_warn | Vermelho 300 (#f28b82) | |
| Nenhuma recomendação (cinza) | Ícone | ?attr/colorScIconNull | Cinza 600 (#80868b) |
No Android 14, recursos de cores sobrepostos foram adicionados para cada propriedade de cor do tema, e algumas cores padrão foram modificadas:
| Nome do recurso | Cor de fundo do Android 13 | Cor de fundo do Android 14 | Código hexadecimal do Android 14 |
|---|---|---|---|
@color/sc_status_info_light | Verde 600 | Verde Semântico | #0E8435 |
@color/sc_status_recommend_light | Amarelo 600 | Inalterado | |
@color/sc_status_warn_light | Vermelho 600 | Inalterado | |
@color/sc_status_info_dark | Verde 500 | Verde 400 | #5BB974 |
@color/sc_status_recommend_dark | Amarelo 500 | Amarelo 400 | #FCC934 |
@color/sc_status_warn_dark | Vermelho 500 | Vermelho 400 | #EE675C |
@color/sc_status_background_info_light | Verde 100 | Inalterado | |
@color/sc_status_background_recommend_light | Amarelo 100 | Inalterado | |
@color/sc_status_background_warn_light | Vermelho 100 | Inalterado | |
@color/sc_status_background_info_dark | sc_surface_variant_dark | Inalterado | |
@color/sc_status_background_recommend_dark | sc_surface_variant_dark | Inalterado | |
@color/sc_status_background_warn_dark | sc_surface_variant_dark | Inalterado | |
@color/sc_icon_info_light | Verde 500 | Inalterado | |
@color/sc_icon_recommend_light | Amarelo 500 | Inalterado | |
@color/sc_icon_warn_light | Vermelho 500 | Inalterado | |
@color/sc_icon_null_light | Cinza 600 | Inalterado | |
@color/sc_icon_info_dark | Verde 500 | Verde 400 | |
@color/sc_icon_recommend_dark | Amarelo 500 | Amarelo 400 | |
@color/sc_icon_warn_dark | Vermelho 500 | Vermelho 400 | |
@color/sc_icon_null_dark | Cinza 600 | Cinza 400 | #BDC1C6 |
@color/sc_shield_accent_dark | Não disponível | Cinza 900 | #202124 |
Cores da IU
Estado verde
| Escudo Verde | |
|---|---|
| #1E8E3E (verde/600) |
| Tema escuro #34A853 (verde/500) | |
| Recipiente verde | |
|---|---|
| #CEEAD6 (verde/100) |
| Tema escuro #474741 | |
| Ícone verde de configurações | |
|---|---|
| #34A853 (verde/500) |
| Tema escuro #34A853 (verde/500) | |
| Botão de digitalização | |
|---|---|
| Botão verde |
| #5BB974 (verde/400) | |
| Título | Legenda |
|
|
|---|---|
| #1B1C17 (TextColorPrimary) | #46483B (TextColorSecondary) |
Estado amarelo
| Escudo Amarelo | |
|---|---|
| #F9AB00 (Amarelo/600) |
| Tema escuro #FBBC04 (amarelo/500) | |
| Recipiente amarelo | |
|---|---|
| #FEEFC3 (amarelo/100) |
| Tema escuro #474741 (amarelo/500) | |
| Ícone amarelo de configurações | |
|---|---|
| #FBBC04 (amarelo/500) |
| Tema escuro #FBBC04 (amarelo/500) | |
| Botão de digitalização | |
|---|---|
| Botão amarelo |
| #5BB974 (Amarelo/400) | |
| Título | Legenda |
|
|
|---|---|
| #1B1C17 (TextColorPrimary) | #46483B (TextColorSecondary) |
Estado vermelho
| Escudo Vermelho | |
|---|---|
| #D93025 (Vermelho/600) |
| Tema escuro #EA4335 (vermelho/500) | |
| Recipiente vermelho | |
|---|---|
| #FAD2CF (vermelho/100) |
| Tema escuro #474741 | |
| Ícone vermelho de configurações | |
|---|---|
| #EA4335 (vermelho/500) |
| Tema escuro #EA4335 (vermelho/500) | |
| Botão desinstalar | |
|---|---|
| botão vermelho |
| #EE675C (vermelho/400) | |
| Título | Legenda |
|
|
|---|---|
| #1B1C17 (TextColorPrimary) | #46483B (TextColorSecondary) |
Fontes e aparência do texto
As fontes e a aparência do texto do Safety Center são baseadas na aparência de texto padrão do Android e devem herdar quaisquer alterações em uma família de fontes, peso e outras propriedades já configuradas pelos OEMs para seus estilos em todo o dispositivo. A aparência do texto do Safety Center pode ser substituída diretamente usando RROs.
| Aparência do texto da Central de Segurança | Base DeviceDefault | Cor | Tamanho | Peso |
|---|---|---|---|---|
TextAppearance.SafetyCenter.Headline | TextAppearance.DeviceDefault.Headline | android:textColorPrimary | Varia | Regular |
TextAppearance.SafetyCenter.Headline.Status | TextAppearance.DeviceDefault.Headline | android:textColorPrimary | 22 vel/28 vel | " |
TextAppearance.SafetyCenter.Headline.Issue | TextAppearance.DeviceDefault.Headline | android:textColorPrimary | 18 vel/24 vel | " |
TextAppearance.SafetyCenter.Headline.Entry | TextAppearance.DeviceDefault.Headline | android:textColorPrimary | 20 vel/24 vel | " |
TextAppearance.SafetyCenter.Medium | TextAppearance.DeviceDefault.Medium | Varia | 14 vel/20 vel ou 16 vel/24 vel | Médio |
TextAppearance.SafetyCenter.Body | TextAppearance.DeviceDefault.Small | android:textColorSecondary | 14 vel/20 vel | Regular |
Espaçamento e estilos
O Safety Center usa um conjunto de valores de preenchimento padrão universalmente para preenchimento e margens. Altere a densidade das informações do Safety Center substituindo os valores de espaçamento.
| Nome do recurso | Valor padrão |
|---|---|
@dimen/sc_spacing_xxxsmall | 2 DP |
@dimen/sc_spacing_xxsmall | 4 DP |
@dimen/sc_spacing_xsmall | 8 DP |
@dimen/sc_spacing_small | 12 dp |
@dimen/sc_spacing_medium | 14 dp |
@dimen/sc_spacing_large | 16 DP |
@dimen/sc_spacing_xlarge | 18 dp |
@dimen/sc_spacing_xxlarge | 20 DP |
@dimen/sc_spacing_xxxlarge | 24 dp |
Você pode personalizar os raios dos cantos dos cartões do Safety Center. Um raio de tamanho de canto é usado para botões e três tamanhos de canto são usados para cartões do Safety Center:
| Nome do recurso | Valor padrão |
|---|---|
@dimen/sc_button_corner_radius | 12 dp |
@dimen/sc_card_corner_radius_large | 28 dp |
@dimen/sc_card_corner_radius_medium | 20 DP |
@dimen/sc_card_corner_radius_xsmall | 4 DP |
Bloco Configurações rápidas
O Safety Center pode ser acessado a partir de um bloco Configurações rápidas implementado no módulo PermissionController. O bloco Configurações rápidas reutiliza alguns dos componentes da IU das telas do Safety Center para que as sobreposições possam funcionar:
- Serviço de bloco de configurações rápidas:
SafetyCenterQsTileService.kt - Atividade de configurações rápidas:
SafetyCenterQsActivity.java