הקוד של ממשק המשתמש של מרכז הבטיחות נמצא בספרייה safetycenterpackages/modules/Permission/PermissionController/src/com/android/permissioncontroller/safetycenter/.
התאמה אישית של ממשק המשתמש של מרכז הבטיחות באמצעות שכבות-על של משאבי זמן ריצה (RRO) בתיקיית שכבת-העל של יצרן הציוד המקורי. מידע על RRO זמין במאמר שינוי הערך של המשאבים של אפליקציה בזמן הריצה.
צבעים ועיצובים של מרכז הבטיחות
במרכז הבטיחות יש ארבעה נושאים עיקריים שיש להם את אותם מאפייני ממשק משתמש:
- התאורה של מרכז הבטיחות
- מרכז הבטיחות כהה
- נורית ההגדרות המהירות של מרכז הבטיחות
- הגדרות מהירות של מרכז הבטיחות כהות
העיצובים של מרכז הבטיחות מכילים צבעי ברירת מחדל. צבעי ממשק המשתמש העיקריים מבוססים על צבעי המערכת של Android, והם יכולים להתאים באופן אוטומטי להתאמה האישית הכללית של צבע Android על ידי יצרן הציוד המקורי. כברירת מחדל, הצבעים האלה משתנים כחלק מהסגנון של Material You ב-Android.
כדי לשנות את הצבעים של מרכז הבטיחות, אפשר לשנות את הערכים שלהם.
| הצבע של ממשק המשתמש של מרכז הבטיחות | שם המאפיין | משאב |
|---|---|---|
| רקע | android:colorBackground |
@android:color/background_device_default_light@android:color/primary_dark_device_default_settings |
| Surface | colorSurface |
@color/sc_surface_light
@color/sc_surface_dark |
| וריאנט של משטח | colorSurfaceVariant |
@color/sc_surface_variant_light@color/sc_surface_variant_dark |
| טקסט ראשי | android:textColorPrimary |
@android:color/text_color_primary |
| טקסט משני | android:textColorSecondary |
@android:color/text_color_secondary |
| סמלים | android:textColorSecondary |
@android:color/text_color_secondary |
| משאב | ערך ברירת המחדל |
|---|---|
@color/sc_surface_light |
@android:color/system_neutral1_500 עם ערך L star של 98 (בהירות תפיסתית) |
@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
|
צבעים של חומרת בעיות
רמת החומרה של הבעיה מוצגת במרכז הבטיחות באמצעות מערכת צבעים של רמזור:
- ירוק לבעיות מידע ולסטטוס תקין
- צהוב – להמלצות
- אדום לבעיות חמורות
- אפור – אם אין מידע
כברירת מחדל, הצבעים האלה נלקחים מלוח הצבעים של Google Material. מומלץ להשתמש בצבעים הבסיסיים האלה, אבל אפשר להשתמש גם בגוונים שונים של לוח הצבעים הירוק, הצהוב והאדום.
מאפייני הצבע האלה משמשים לשיוך פריטים לפי רמת חומרה בממשק המשתמש של מרכז הבטיחות, כולל סמלים, לחצנים ואנימציות של סריקות ושל שינויי סטטוס. שינוי הצבעים האלה ישנה את הצבעים של כל הרכיבים. לדוגמה, שינוי הערך של @color/sc_status_info_{light,dark} ישנה את צבע הרקע גם בתמונת הסטטוס הסטטית וגם באנימציה של הרקע במהלך הסריקה.
העיצוב של ההגדרות המהירות במרכז הבטיחות כולל צבעים של מצב כהה, גם אם המכשיר מוגדר למצב כהה וגם אם לא.
| רמת החומרה | רכיב בממשק המשתמש | שם המאפיין או המשאב | צבע ברירת המחדל |
|---|---|---|---|
| מידע (ירוק) | מגן הסטטוס | ?attr/colorScStatusInfo |
בהיר: ירוק 600 (#1e8e3e) כהה: ירוק 500 (#34a853) |
| מאגר של סטטוס מגן | ?attr/colorScStatusBackgroundInfo |
תאורה: ירוק 100 (#ceead6)colorSurfaceVariant |
|
| סמל | ?attr/colorScIconInfo |
ירוק 500 (#34a853) | |
| כפתור הפעולה הראשי | @color/safety_center_button_info |
ירוק 400 (#5bb974) | |
| לחצן פעולה משני | @color/safety_center_outline_button_info |
ירוק 300 (#81c995) | |
| המלצה (צהוב) | מגן הסטטוס | ?attr/colorScStatusRecommend |
בהיר: צהוב 600 (#f9ab00) כהה: צהוב 500 (#fbbc04) |
| מאגר של סטטוס מגן | ?attr/colorScStatusBackgroundRecommend |
בהיר: צהוב 100 (#feefc3) כהה: colorSurfaceVariant |
|
| סמל | ?attr/colorScIconRecommend |
צהוב 500 (#fbbc04) | |
| כפתור הפעולה הראשי | @color/safety_center_button_recommend |
צהוב 400 (#fcc934) | |
| לחצן פעולה משני | @color/safety_center_outline_button_recommend |
צהוב 300 (#fdd663) | |
| אזהרה (אדום) | מגן הסטטוס | ?attr/colorScStatusWarn |
בהיר: אדום 600 (#d93025) כהה: אדום 500 (#ea4335) |
| מאגר של סטטוס מגן | ?attr/colorScStatusBackgroundWarn |
בהיר: אדום 100 (#fad2cf) כהה: colorSurfaceVariant |
|
| סמל | ?attr/colorScIconWarn |
אדום 500 (#ea4335) | |
| כפתור הפעולה הראשי | @color/safety_center_button_warn |
אדום 400 (#ee675c) | |
| לחצן פעולה משני | @color/safety_center_outline_button_warn |
אדום 300 (#f28b82) | |
| אין המלצה (אפור) | סמל | ?attr/colorScIconNull |
אפור 600 (#80868b) |
ב-Android 14 נוספו משאבי צבעים שאפשר להציב שכבה-על לכל מאפיין של צבע העיצוב, וחלק מהצבעים שמוגדרים כברירת מחדל שונו:
| שם המשאב | צבע התמיכה של Android 13 | צבע התמיכה של Android 14 | קוד הקסדצימלי של Android 14 |
|---|---|---|---|
@color/sc_status_info_light |
Green 600 | Semantic Green | #0E8435 |
@color/sc_status_recommend_light |
צהוב 600 | ללא שינוי | |
@color/sc_status_warn_light |
Red 600 | ללא שינוי | |
@color/sc_status_info_dark |
Green 500 | ירוק 400 | #5BB974 |
@color/sc_status_recommend_dark |
צהוב 500 | צהוב 400 | #FCC934 |
@color/sc_status_warn_dark |
Red 500 | Red 400 | #EE675C |
@color/sc_status_background_info_light |
Green 100 | ללא שינוי | |
@color/sc_status_background_recommend_light |
צהוב 100 | ללא שינוי | |
@color/sc_status_background_warn_light |
Red 100 | ללא שינוי | |
@color/sc_status_background_info_dark |
sc_surface_variant_dark | ללא שינוי | |
@color/sc_status_background_recommend_dark |
sc_surface_variant_dark | ללא שינוי | |
@color/sc_status_background_warn_dark |
sc_surface_variant_dark | ללא שינוי | |
@color/sc_icon_info_light |
Green 500 | ללא שינוי | |
@color/sc_icon_recommend_light |
צהוב 500 | ללא שינוי | |
@color/sc_icon_warn_light |
Red 500 | ללא שינוי | |
@color/sc_icon_null_light |
אפור 600 | ללא שינוי | |
@color/sc_icon_info_dark |
Green 500 | ירוק 400 | |
@color/sc_icon_recommend_dark |
צהוב 500 | צהוב 400 | |
@color/sc_icon_warn_dark |
Red 500 | Red 400 | |
@color/sc_icon_null_dark |
אפור 600 | אפור 400 | #BDC1C6 |
@color/sc_shield_accent_dark |
לא זמין | אפור 900 | #202124 |
צבעי ממשק המשתמש
מצב ירוק
| Green Shield | |
|---|---|
|
#1E8E3E (ירוק/600) |
| עיצוב כהה #34A853 (ירוק/500) |
|
| מאגר ירוק | |
|---|---|
|
#CEEAD6 (ירוק/100) |
| עיצוב כהה #474741 |
|
| סמל ההגדרות הירוק | |
|---|---|
|
#34A853 (ירוק/500) |
| עיצוב כהה #34A853 (ירוק/500) |
|
| לחצן הסריקה | |
|---|---|
|
לחצן ירוק |
| #5BB974 (ירוק/400) | |
| כותרת | כותרת משנה |
|---|---|
|
|
| #1B1C17 (TextColorPrimary) | #46483B (TextColorSecondary) |
מצב צהוב
| מגן צהוב | |
|---|---|
|
#F9AB00 (צהוב/600) |
| עיצוב כהה #FBBC04 (צהוב/500) |
|
| מאגר צהוב | |
|---|---|
|
#FEEFC3 (צהוב/100) |
| עיצוב כהה #474741 (צהוב/500) |
|
| סמל ההגדרות הצהוב | |
|---|---|
|
#FBBC04 (צהוב/500) |
| עיצוב כהה #FBBC04 (צהוב/500) |
|
| לחצן הסריקה | |
|---|---|
|
לחצן צהוב |
| #5BB974 (צהוב/400) | |
| כותרת | כותרת משנה |
|---|---|
|
|
| #1B1C17 (TextColorPrimary) | #46483B (TextColorSecondary) |
מדינה אדומה
| Red Shield | |
|---|---|
|
#D93025 (אדום/600) |
| עיצוב כהה #EA4335 (אדום/500) |
|
| מאגר אדום | |
|---|---|
|
#FAD2CF (red/100) |
| עיצוב כהה #474741 |
|
| סמל ההגדרות האדום | |
|---|---|
|
#EA4335 (אדום/500) |
| עיצוב כהה #EA4335 (אדום/500) |
|
| לחצן ההסרה | |
|---|---|
|
לחצן אדום |
| #EE675C (אדום/400) | |
| כותרת | כותרת משנה |
|---|---|
|
|
| #1B1C17 (TextColorPrimary) | #46483B (TextColorSecondary) |
גופנים ומראה הטקסט
הגופנים והמראה של הטקסט במרכז הבטיחות מבוססים על מראה הטקסט שמוגדר כברירת המחדל ב-Android, והם אמורים לרשת שינויים במשפחת הגופן, בעובי ובמאפיינים אחרים שכבר הוגדרו על ידי יצרני ציוד מקורי בסגנונות שלהם ברמת המכשיר. אפשר לשנות את המראה של הטקסט במרכז הבטיחות ישירות באמצעות קובצי RRO.
| מראה הטקסט במרכז הבטיחות | בסיס DeviceDefault | צבע | גודל | משקל |
|---|---|---|---|---|
TextAppearance.SafetyCenter.Headline |
TextAppearance.DeviceDefault.Headline |
android:textColorPrimary |
משתנה | רגיל |
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 |
משתנה | 14 sp/20 sp או 16 sp/24 sp |
בינוני |
TextAppearance.SafetyCenter.Body |
TextAppearance.DeviceDefault.Small |
android:textColorSecondary |
14 sp/20 sp | רגיל |
ריווח וסגנונות
מרכז הבטיחות משתמש בקבוצה של ערכי ברירת מחדל לכל הפריטים, לרווח ולמרווחים. כדי לשנות את הצפיפות של המידע במרכז הבטיחות, משנים את ערכי המרווחים.
| שם משאב | ערך ברירת מחדל |
|---|---|
@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 |
אתם יכולים להתאים אישית את רדיוס הפינות של הכרטיסים במרכז הבטיחות. יש גודל אחד של רדיוס פינות ללחצנים, ויש שלושה גדלים של פינות לכרטיסים במרכז הבטיחות:
| שם משאב | ערך ברירת מחדל |
|---|---|
@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 |
לחצן בהגדרות המהירות
אפשר לגשת למרכז הבטיחות דרך משבצת בהגדרות המהירות שמוטמעת במודול PermissionController. כדי שאפשר יהיה להשתמש בשכבות-על, בחלונית ההגדרות המהירות נעשה שימוש חוזר בחלק מרכיבי ממשק המשתמש של המסכים במרכז הבטיחות:
- שירות של קטעי מפות בהגדרות המהירות:
SafetyCenterQsTileService.kt - פעילות בהגדרות המהירות:
SafetyCenterQsActivity.java