Passen Sie die Safety Center-Benutzeroberfläche an

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: