يمكن العثور على رمز واجهة مستخدم "مركز الأمان" في الدليل safetycenter
packages/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 |
| السطح | 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 | أحمر 400 | #EE675C |
@color/sc_status_background_info_light |
Green 100 | دون تغيير | |
@color/sc_status_background_recommend_light |
أصفر 100 | دون تغيير | |
@color/sc_status_background_warn_light |
أحمر 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 | أحمر 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 (أحمر/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 نقطة في البوصة/28 نقطة في البوصة | " |
TextAppearance.SafetyCenter.Headline.Issue |
TextAppearance.DeviceDefault.Headline |
android:textColorPrimary |
18 نقطة في البوصة/24 نقطة في البوصة | " |
TextAppearance.SafetyCenter.Headline.Entry |
TextAppearance.DeviceDefault.Headline |
android:textColorPrimary |
20 نقطة في البوصة/24 نقطة في البوصة | " |
TextAppearance.SafetyCenter.Medium |
TextAppearance.DeviceDefault.Medium |
يختلف | 14 حرفًا في السطر/20 حرفًا في السطر أو 16 حرفًا في السطر/24 حرفًا في السطر |
متوسط |
TextAppearance.SafetyCenter.Body |
TextAppearance.DeviceDefault.Small |
android:textColorSecondary |
14 نقطة/20 نقطة | منتظمة |
المسافات والأنماط
يستخدم تطبيق Safety Center مجموعة من قيم الحشو التلقائية بشكل عام للحشو والحدود. يمكنك تغيير كثافة المعلومات في "مركز الأمان" من خلال إلغاء قيم المسافة.
| اسم المورِد | القيمة التلقائية |
|---|---|
@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 نقطة كثافة |
يمكنك تخصيص نصف قطر زوايا بطاقات "مركز الأمان". يتم استخدام حجم زاوية واحد نصف قطر للأزرار ويتم استخدام ثلاثة أحجام زوايا لبطاقات مركز الأمان:
| اسم المورِد | القيمة التلقائية |
|---|---|
@dimen/sc_button_corner_radius |
12 dp |
@dimen/sc_card_corner_radius_large |
28 نقطة كثافة |
@dimen/sc_card_corner_radius_medium |
20 dp |
@dimen/sc_card_corner_radius_xsmall |
4 dp |
مربّع الإعدادات السريعة
يمكن الوصول إلى "مركز الأمان" من مربّع "الإعدادات السريعة" الذي تم تنفيذه في وحدة PermissionController. يعيد مربّع "الإعدادات السريعة" استخدام بعض مكونات واجهة المستخدِم من شاشات "مركز الأمان" لكي تعمل العناصر التي يمكن عرضها على سطح التطبيقات الأخرى:
- خدمة مربّعات الإعدادات السريعة:
SafetyCenterQsTileService.kt - نشاط "الإعدادات السريعة":
SafetyCenterQsActivity.java