Der Code für die Safety Center-Benutzeroberfläche befindet sich im safetycenter
Verzeichnis packages/modules/Permission/PermissionController/src/com/android/permissioncontroller/safetycenter/
. Passen Sie die Safety Center-Benutzeroberfläche mithilfe der Runtime Resource Overlays (RROs) im OEM-Overlay-Ordner an. Informationen zu RROs finden Sie unter Ändern des Werts der Ressourcen einer App zur Laufzeit .
Themen und Farben des Safety Centers
Safety Center verfügt über vier Hauptthemen, die dieselben UI-Attribute haben:
- Licht im Sicherheitszentrum
- Sicherheitszentrum dunkel
- Die LED „Schnelleinstellungen“ im Safety Center leuchtet auf
- Safety Center-Schnelleinstellungen dunkel
Safety Center-Designs enthalten Standardfarben. Die Hauptfarben der Benutzeroberfläche werden aus Android-Systemfarben abgeleitet und können automatisch an die allgemeine Anpassung der Android-Farben durch den OEM angepasst werden. Standardmäßig werden diese Farben als Teil des Material You-Stils in Android angepasst.
Sie können die Farben des Safety Centers ändern, indem Sie deren Werte überschreiben.
Farbe der Safety Center-Benutzeroberfläche | Attributname | Ressource |
---|---|---|
Hintergrund | android:colorBackground | @android:color/background_device_default_light @android:color/primary_dark_device_default_settings |
Oberfläche | colorSurface | @color/sc_surface_light @color/sc_surface_dark |
Oberflächenvariante | colorSurfaceVariant | @color/sc_surface_variant_light @color/sc_surface_variant_dark |
Primärtext | android:textColorPrimary | @android:color/text_color_primary |
Sekundärtext | android:textColorSecondary | @android:color/text_color_secondary |
Symbole | android:textColorSecondary | @android:color/text_color_secondary |
Ressource | Standardwert |
---|---|
@color/sc_surface_light | @android:color/system_neutral1_500 mit einem L-Stern-Wert von 98 (Wahrnehmungsluminanz) |
@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 |
Farben für den Schweregrad des Problems
Safety Center kommuniziert den Schweregrad des Problems mit einem Ampel-Farbsystem:
- Grün für Informationsprobleme und OK-Status
- Gelb für Empfehlungen
- Rot für schwerwiegende Probleme
- Grau wegen fehlender Informationen
Standardmäßig werden diese Farben aus der Farbpalette von Google Material übernommen. Wir empfehlen Ihnen, diese Grundfarben beizubehalten, Sie können jedoch auch andere Farbtöne der Grün-, Gelb- und Rotpalette verwenden.
Diese Farbattribute werden zum Zuordnen von Schweregrad-farbigen Elementen in der Safety Center-Benutzeroberfläche verwendet, einschließlich Symbolen, Schaltflächen sowie Scan- und Statusänderungsanimationen. Durch Ändern dieser Farben werden alle Elemente neu eingefärbt. Wenn Sie beispielsweise @color/sc_status_info_{light,dark}
ändern, ändert sich die Hintergrundfarbe sowohl im statischen Statusbild als auch in der Animation des Hintergrunds während eines Scans.
Das Thema „Safety Center Quick Settings“ verwendet dunkle Modusfarben, unabhängig davon, ob das Gerät auf den dunklen Modus eingestellt ist oder nicht.
Schwere | UI-Element | Attribut- oder Ressourcenname | Standardfarbe |
---|---|---|---|
Info (Grün) | Statusschild | ?attr/colorScStatusInfo | Licht: Grün 600 (#1e8e3e) Dunkel: Grün 500 (#34a853) |
Statusschild-Container | ?attr/colorScStatusBackgroundInfo | Licht: Grün 100 (#ceead6)colorSurfaceVariant | |
Symbol | ?attr/colorScIconInfo | Grün 500 (#34a853) | |
Primäre Aktionsschaltfläche | @color/safety_center_button_info | Grün 400 (#5bb974) | |
Sekundäre Aktionsschaltfläche | @color/safety_center_outline_button_info | Grün 300 (#81c995) | |
Empfehlung (Gelb) | Statusschild | ?attr/colorScStatusRecommend | Licht: Gelb 600 (#f9ab00) Dunkel: Gelb 500 (#fbbc04) |
Statusschild-Container | ?attr/colorScStatusBackgroundRecommend | Licht: Gelb 100 (#feefc3) Dunkel: colorSurfaceVariant | |
Symbol | ?attr/colorScIconRecommend | Gelb 500 (#fbbc04) | |
Primäre Aktionsschaltfläche | @color/safety_center_button_recommend | Gelb 400 (#fcc934) | |
Sekundäre Aktionsschaltfläche | @color/safety_center_outline_button_recommend | Gelb 300 (#fdd663) | |
Warnung (Rot) | Statusschild | ?attr/colorScStatusWarn | Licht: Rot 600 (#d93025) Dunkel: Rot 500 (#ea4335) |
Statusschild-Container | ?attr/colorScStatusBackgroundWarn | Licht: Rot 100 (#fad2cf) Dunkel: colorSurfaceVariant | |
Symbol | ?attr/colorScIconWarn | Rot 500 (#ea4335) | |
Primäre Aktionsschaltfläche | @color/safety_center_button_warn | Rot 400 (#ee675c) | |
Sekundäre Aktionsschaltfläche | @color/safety_center_outline_button_warn | Rot 300 (#f28b82) | |
Keine Empfehlung (Grau) | Symbol | ?attr/colorScIconNull | Grau 600 (#80868b) |
In Android 14 wurden überlagerbare Farbressourcen für jede Designfarbeigenschaft hinzugefügt und einige Standardfarben wurden geändert:
Ressourcenname | Hintergrundfarbe für Android 13 | Hintergrundfarbe für Android 14 | Hex-Code für Android 14 |
---|---|---|---|
@color/sc_status_info_light | Grün 600 | Semantisches Grün | #0E8435 |
@color/sc_status_recommend_light | Gelb 600 | Unverändert | |
@color/sc_status_warn_light | Rot 600 | Unverändert | |
@color/sc_status_info_dark | Grün 500 | Grün 400 | #5BB974 |
@color/sc_status_recommend_dark | Gelb 500 | Gelb 400 | #FCC934 |
@color/sc_status_warn_dark | Rot 500 | Rot 400 | #EE675C |
@color/sc_status_background_info_light | Grün 100 | Unverändert | |
@color/sc_status_background_recommend_light | Gelb 100 | Unverändert | |
@color/sc_status_background_warn_light | Rot 100 | Unverändert | |
@color/sc_status_background_info_dark | sc_surface_variant_dark | Unverändert | |
@color/sc_status_background_recommend_dark | sc_surface_variant_dark | Unverändert | |
@color/sc_status_background_warn_dark | sc_surface_variant_dark | Unverändert | |
@color/sc_icon_info_light | Grün 500 | Unverändert | |
@color/sc_icon_recommend_light | Gelb 500 | Unverändert | |
@color/sc_icon_warn_light | Rot 500 | Unverändert | |
@color/sc_icon_null_light | Grau 600 | Unverändert | |
@color/sc_icon_info_dark | Grün 500 | Grün 400 | |
@color/sc_icon_recommend_dark | Gelb 500 | Gelb 400 | |
@color/sc_icon_warn_dark | Rot 500 | Rot 400 | |
@color/sc_icon_null_dark | Grau 600 | Grau 400 | #BDC1C6 |
@color/sc_shield_accent_dark | Nicht verfügbar | Grau 900 | #202124 |
UI-Farben
Grüner Staat
Grüner Schild | |
---|---|
#1E8E3E (grün/600) | |
Dunkles Thema #34A853 (grün/500) |
Grüner Behälter | |
---|---|
#CEEAD6 (grün/100) | |
Dunkles Thema #474741 |
Grünes Einstellungssymbol | |
---|---|
#34A853 (grün/500) | |
Dunkles Thema #34A853 (grün/500) |
Schaltfläche „Scannen“. | |
---|---|
Grüner Knopf | |
#5BB974 (grün/400) |
Titel | Untertitel |
---|---|
#1B1C17 (TextColorPrimary) | #46483B (TextColorSecondary) |
Gelber Staat
Gelber Schild | |
---|---|
#F9AB00 (Gelb/600) | |
Dunkles Thema #FBBC04 (gelb/500) |
Gelber Behälter | |
---|---|
#FEEFC3 (gelb/100) | |
Dunkles Thema #474741 (gelb/500) |
Gelbes Einstellungssymbol | |
---|---|
#FBBC04 (gelb/500) | |
Dunkles Thema #FBBC04 (gelb/500) |
Schaltfläche „Scannen“. | |
---|---|
Gelber Knopf | |
#5BB974 (Gelb/400) |
Titel | Untertitel |
---|---|
#1B1C17 (TextColorPrimary) | #46483B (TextColorSecondary) |
roter Staat
Rotes Schild | |
---|---|
#D93025 (Rot/600) | |
Dunkles Thema #EA4335 (rot/500) |
Roter Behälter | |
---|---|
#FAD2CF (rot/100) | |
Dunkles Thema #474741 |
Rotes Einstellungssymbol | |
---|---|
#EA4335 (rot/500) | |
Dunkles Thema #EA4335 (rot/500) |
Schaltfläche „Deinstallieren“. | |
---|---|
roter Knopf | |
#EE675C (rot/400) |
Titel | Untertitel |
---|---|
#1B1C17 (TextColorPrimary) | #46483B (TextColorSecondary) |
Schriftarten und Textdarstellung
Die Schriftarten und die Textdarstellung von Safety Center basieren auf der Standardtextdarstellung von Android und sollten alle Änderungen an einer Schriftfamilie, Schriftstärke und anderen Eigenschaften übernehmen, die bereits von OEMs für ihre geräteweiten Stile konfiguriert wurden. Das Erscheinungsbild des Safety Center-Textes kann direkt mithilfe von RROs überschrieben werden.
Darstellung des Safety Center-Textes | DeviceDefault-Basis | Farbe | Größe | Gewicht |
---|---|---|---|---|
TextAppearance.SafetyCenter.Headline | TextAppearance.DeviceDefault.Headline | android:textColorPrimary | Variiert | Regulär |
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 | Variiert | 14 sp/20 sp oder 16 sp/24 sp | Mittel |
TextAppearance.SafetyCenter.Body | TextAppearance.DeviceDefault.Small | android:textColorSecondary | 14 Sp./20 Sp | Regulär |
Abstände und Stile
Safety Center verwendet allgemein eine Reihe von Standard-Abstandswerten für Abstand und Ränder. Ändern Sie die Informationsdichte des Safety Centers, indem Sie die Abstandswerte überschreiben.
Ressourcenname | Standardwert |
---|---|
@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 |
Sie können die Eckradien der Safety Center-Karten anpassen. Für Schaltflächen wird ein Eckenradius und für Safety Center-Karten werden drei Eckengrößen verwendet:
Ressourcenname | Standardwert |
---|---|
@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 |
Kachel „Schnelleinstellungen“.
Der Zugriff auf das Safety Center erfolgt über eine Schnelleinstellungskachel, die im PermissionController-Modul implementiert ist. Die Kachel „Schnelleinstellungen“ verwendet einige der UI-Komponenten der Safety Center-Bildschirme wieder, sodass Overlayables funktionieren könnten:
- Kacheldienst für Schnelleinstellungen:
SafetyCenterQsTileService.kt
- Aktivität „Schnelleinstellungen“:
SafetyCenterQsActivity.java