O código da interface da Central de segurança está localizado no diretório safetycenter.
packages/modules/Permission/PermissionController/src/com/android/permissioncontroller/safetycenter/.
Personalize a interface da Central de segurança usando as sobreposições de recursos no ambiente de execução (RROs, na sigla em inglês) no
Pasta de sobreposição de OEM. Para informações sobre RROs, consulte Alterar o valor do atributo
recursos no ambiente de execução.
Temas e cores da Central de segurança
A Central de segurança tem quatro temas de princípios que compartilham os mesmos atributos de interface:
- Luz da Central de segurança
- Central de segurança em modo escuro
- Luz das Configurações rápidas da Central de segurança
- Configurações rápidas da Central de segurança em modo escuro
Os temas da Central de segurança contêm cores padrão. As principais cores da interface são desenhadas com base nas cores do sistema Android e pode se adaptar automaticamente às normas personalização de cores do Android. Por padrão, essas cores se adaptam como parte Estilização do Material You no Android.
Você pode mudar as cores da Central de segurança substituindo os valores delas.
| Cor da interface da Central de segurança | Nome do atributo | Recurso |
|---|---|---|
| Contexto | 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 da plataforma | 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 L estrela
de 98 (luminância perceptiva) |
@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
A Central de segurança informa a gravidade do problema com um sistema de cores de semáforos:
- Verde para problemas informativos e status OK
- Amarelo para recomendações
- Vermelho para problemas graves
- Cinza para a ausência de informações
Por padrão, essas cores são extraídas da paleta do Google Material Design. Qa recomendamos que você mantenha essas cores de base, mas pode usar diferentes tons de a paleta verde, amarela e vermelha.
Esses atributos de cor são usados para associar itens coloridos de gravidade nos
Interface da Central de segurança com ícones, botões e verificação e mudança de status
animações. A modificação dessas cores muda a cor de todos os elementos. Por exemplo, modificar
@color/sc_status_info_{light,dark} muda a cor do plano de fundo no
imagem estática de status e a animação do plano de fundo durante uma verificação.
O tema "Configurações rápidas" da Central de segurança usa cores do modo escuro, não importa se o está configurado no modo escuro.
| Gravidade | Elemento da IU | Nome do atributo ou recurso | Cor padrão |
|---|---|---|---|
| Informação (verde) | Escudo de status | ?attr/colorScStatusInfo |
Claro: verde 600 (#1e8e3e) Escuro: verde 500 (#34a853) |
| Contêiner do escudo de status | ?attr/colorScStatusBackgroundInfo |
Claro: 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ário | @color/safety_center_outline_button_info |
Verde 300 (#81c995) | |
| Recomendação (amarelo) | Escudo de status | ?attr/colorScStatusRecommend |
Leve: amarelo 600 (#f9ab00) Escuro: amarelo 500 (#fbbc04) |
| Contêiner do escudo de status | ?attr/colorScStatusBackgroundRecommend |
Leve: 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ário | @color/safety_center_outline_button_recommend |
Amarelo 300 (#fdd663) | |
| Alerta (vermelho) | Escudo de status | ?attr/colorScStatusWarn |
Luz: vermelho 600 (#d93025) Escuro: vermelho 500 (#ea4335) |
| Contêiner do escudo 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ário | @color/safety_center_outline_button_warn |
Vermelho 300 (#f28b82) | |
| Nenhuma recomendação (cinza) | Ícone | ?attr/colorScIconNull |
Cinza 600 (#80868b) |
No Android 14, recursos de cor sobreposições 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 |
Indisponível | Cinza 900 | #202124 |
Cores da interface
Estado verde
| Escudo verde | |
|---|---|
|
#1E8E3E (verde/600) |
| Tema escuro #34A853 (verde/500) |
|
| Contêiner verde | |
|---|---|
|
#CEEED6 (verde/100) |
| Tema escuro #474741 |
|
| Ícone de configurações verde | |
|---|---|
|
#34A853 (verde/500) |
| Tema escuro #34A853 (verde/500) |
|
| Botão "Digitalizar" | |
|---|---|
|
Botão verde |
| #5BB974 (verde/400) | |
| Título | Subtítulo |
|---|---|
|
|
| #1B1C17 (TextColorPrimary) | #46483B (TextColorSecundário) |
Estado amarelo
| Escudo amarelo | |
|---|---|
|
#F9AB00 (Amarelo/600) |
| Tema escuro #FBBC04 (amarelo/500) |
|
| Contêiner amarelo | |
|---|---|
|
#TAXFC3 (amarelo/100) |
| Tema escuro #474741 (amarelo/500) |
|
| Ícone amarelo de configurações | |
|---|---|
|
#FBBC04 (amarelo/500) |
| Tema escuro #FBBC04 (amarelo/500) |
|
| Botão "Digitalizar" | |
|---|---|
|
Botão amarelo |
| #5BB974 (Amarelo/400) | |
| Título | Subtítulo |
|---|---|
|
|
| #1B1C17 (TextColorPrimary) | #46483B (TextColorSecundário) |
Estado vermelho
| Escudo vermelho | |
|---|---|
|
#D93025 (Vermelho/600) |
| Tema escuro #EA4335 (vermelho/500) |
|
| Contêiner 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 | Subtítulo |
|---|---|
|
|
| #1B1C17 (TextColorPrimary) | #46483B (TextColorSecundário) |
Fontes e aparência do texto
As fontes e a aparência do texto da Central de segurança são baseadas no texto padrão do Android aparência e devem herdar quaisquer alterações em uma família de fontes, peso e outros já configuradas pelos OEMs para os estilos aplicáveis ao dispositivo. Central de segurança a aparência do texto 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 sp/28 sp | ". |
TextAppearance.SafetyCenter.Headline.Issue |
TextAppearance.DeviceDefault.Headline |
android:textColorPrimary |
18 sp/24 sp | ". |
TextAppearance.SafetyCenter.Headline.Entry |
TextAppearance.DeviceDefault.Headline |
android:textColorPrimary |
20 sp/24 sp | ". |
TextAppearance.SafetyCenter.Medium |
TextAppearance.DeviceDefault.Medium |
Varia | 14 sp/20 sp ou 16 sp/24 sp |
Médio |
TextAppearance.SafetyCenter.Body |
TextAppearance.DeviceDefault.Small |
android:textColorSecondary |
14 sp/20 sp | Regular |
Espaçamento e estilos
A Central de segurança usa um conjunto universal de valores de padding padrão para preenchimento e margens. Mudar a densidade das informações da Central de segurança substituindo o espaçamento e a distribuição dos valores dos dados.
| 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 cards da Central de segurança. Tamanho de um canto o raio é usado para botões, e três tamanhos de cantos são usados para a Central de segurança cards:
| 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"
A Central de segurança pode ser acessada no bloco "Configurações rápidas" implementado no Módulo PermissionController. O bloco "Configurações rápidas" reutiliza parte da interface das telas da Central de segurança para que as sobreposições possam funcionar:
- Serviço de bloco "Configurações rápidas":
SafetyCenterQsTileService.kt - Atividade das Configurações rápidas:
SafetyCenterQsActivity.java