Kode untuk UI Pusat Keamanan terletak di direktori safetycenter packages/modules/Permission/PermissionController/src/com/android/permissioncontroller/safetycenter/ . Sesuaikan UI Pusat Keamanan menggunakan Runtime Resource Overlay (RROs) di folder overlay OEM. Untuk informasi tentang RRO, lihat Mengubah nilai sumber daya aplikasi saat runtime .
Tema dan warna Pusat Keamanan
Safety Center memiliki empat tema prinsip yang memiliki atribut UI yang sama:
- Lampu Pusat Keamanan
- Pusat Keamanan gelap
- Lampu Pengaturan Cepat Pusat Keamanan
- Pengaturan Cepat Pusat Keamanan gelap
Tema Pusat Keamanan berisi warna default. Warna UI utama diambil dari warna sistem Android dan dapat beradaptasi secara otomatis dengan kustomisasi umum warna Android OEM. Secara default, warna-warna ini diadaptasi sebagai bagian dari penataan gaya Material You di Android.
Anda dapat mengubah warna Pusat Keamanan dengan mengganti nilainya.
| Warna UI Pusat Keamanan | Nama atribut | Sumber |
|---|---|---|
| Latar belakang | android:colorBackground | @android:color/background_device_default_light@android:color/primary_dark_device_default_settings |
| Permukaan | colorSurface | @color/sc_surface_light @color/sc_surface_dark |
| Varian permukaan | colorSurfaceVariant | @color/sc_surface_variant_light@color/sc_surface_variant_dark |
| Teks utama | android:textColorPrimary | @android:color/text_color_primary |
| Teks sekunder | android:textColorSecondary | @android:color/text_color_secondary |
| Ikon | android:textColorSecondary | @android:color/text_color_secondary |
| Sumber | Nilai bawaan |
|---|---|
@color/sc_surface_light | @android:color/system_neutral1_500 dengan nilai bintang L 98 (luminansi persepsi) |
@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 |
Masalah warna tingkat keparahan
Pusat Keamanan mengomunikasikan tingkat keparahan masalah dengan sistem warna lampu lalu lintas:
- Hijau untuk masalah informasi dan status OK
- Kuning untuk rekomendasi
- Merah untuk masalah serius
- Abu-abu karena kurangnya informasi
Secara default, warna-warna ini diambil dari palet warna Google Material. Kami menyarankan Anda tetap menggunakan warna dasar ini, tetapi Anda dapat menggunakan corak palet hijau, kuning, dan merah yang berbeda.
Atribut warna ini digunakan untuk mengaitkan item dengan tingkat keparahan warna di UI Pusat Keamanan termasuk ikon, tombol, dan animasi pemindaian dan perubahan status. Memodifikasi warna-warna ini akan mewarnai ulang semua elemen. Misalnya, memodifikasi @color/sc_status_info_{light,dark} akan mengubah warna latar belakang pada gambar status statis dan animasi latar belakang selama pemindaian.
Tema Pengaturan Cepat Pusat Keamanan menggunakan warna mode gelap, baik perangkat diatur dalam mode gelap atau tidak.
| Kerasnya | Elemen UI | Nama atribut atau sumber daya | Warna bawaan |
|---|---|---|---|
| Info (Hijau) | Perisai status | ?attr/colorScStatusInfo | Lampu: Hijau 600 (#1e8e3e) Gelap: Hijau 500 (#34a853) |
| Wadah pelindung status | ?attr/colorScStatusBackgroundInfo | Lampu: Hijau 100 (#ceead6)colorSurfaceVariant | |
| Ikon | ?attr/colorScIconInfo | Hijau 500 (#34a853) | |
| Tombol tindakan utama | @color/safety_center_button_info | Hijau 400 (#5bb974) | |
| Tombol tindakan sekunder | @color/safety_center_outline_button_info | Hijau 300 (#81c995) | |
| Rekomendasi (Kuning) | Perisai status | ?attr/colorScStatusRecommend | Cahaya: Kuning 600 (#f9ab00) Gelap: Kuning 500 (#fbbc04) |
| Wadah pelindung status | ?attr/colorScStatusBackgroundRecommend | Cahaya: Kuning 100 (#feefc3) Gelap: colorSurfaceVariant | |
| Ikon | ?attr/colorScIconRecommend | Kuning 500 (#fbbc04) | |
| Tombol tindakan utama | @color/safety_center_button_recommend | Kuning 400 (#fcc934) | |
| Tombol tindakan sekunder | @color/safety_center_outline_button_recommend | Kuning 300 (#fdd663) | |
| Peringatan (Merah) | Perisai status | ?attr/colorScStatusWarn | Lampu: Merah 600 (#d93025) Gelap: Merah 500 (#ea4335) |
| Wadah pelindung status | ?attr/colorScStatusBackgroundWarn | Lampu: Merah 100 (#fad2cf) Gelap: colorSurfaceVariant | |
| Ikon | ?attr/colorScIconWarn | Merah 500 (#ea4335) | |
| Tombol tindakan utama | @color/safety_center_button_warn | Merah 400 (#ee675c) | |
| Tombol tindakan sekunder | @color/safety_center_outline_button_warn | Merah 300 (#f28b82) | |
| Tidak ada rekomendasi (Abu-abu) | Ikon | ?attr/colorScIconNull | Abu-abu 600 (#80868b) |
Di Android 14, sumber daya warna yang dapat dihamparkan telah ditambahkan untuk setiap properti warna tema, dan beberapa warna default telah diubah:
| Nama Sumberdaya | Warna dukungan Android 13 | Warna pendukung Android 14 | Kode heksa Android 14 |
|---|---|---|---|
@color/sc_status_info_light | Hijau 600 | Hijau Semantik | #0E8435 |
@color/sc_status_recommend_light | Kuning 600 | Tidak berubah | |
@color/sc_status_warn_light | Merah 600 | Tidak berubah | |
@color/sc_status_info_dark | Hijau 500 | Hijau 400 | #5BB974 |
@color/sc_status_recommend_dark | Kuning 500 | Kuning 400 | #FCC934 |
@color/sc_status_warn_dark | Merah 500 | Merah 400 | #EE675C |
@color/sc_status_background_info_light | Hijau 100 | Tidak berubah | |
@color/sc_status_background_recommend_light | Kuning 100 | Tidak berubah | |
@color/sc_status_background_warn_light | Merah 100 | Tidak berubah | |
@color/sc_status_background_info_dark | sc_surface_variant_dark | Tidak berubah | |
@color/sc_status_background_recommend_dark | sc_surface_variant_dark | Tidak berubah | |
@color/sc_status_background_warn_dark | sc_surface_variant_dark | Tidak berubah | |
@color/sc_icon_info_light | Hijau 500 | Tidak berubah | |
@color/sc_icon_recommend_light | Kuning 500 | Tidak berubah | |
@color/sc_icon_warn_light | Merah 500 | Tidak berubah | |
@color/sc_icon_null_light | Abu-abu 600 | Tidak berubah | |
@color/sc_icon_info_dark | Hijau 500 | Hijau 400 | |
@color/sc_icon_recommend_dark | Kuning 500 | Kuning 400 | |
@color/sc_icon_warn_dark | Merah 500 | Merah 400 | |
@color/sc_icon_null_dark | Abu-abu 600 | Abu-abu 400 | #BDC1C6 |
@color/sc_shield_accent_dark | Tidak tersedia | Abu-abu 900 | #202124 |
Warna UI
negara bagian hijau
| Perisai Hijau | |
|---|---|
| #1E8E3E (hijau/600) |
| Tema gelap #34A853 (hijau/500) | |
| Wadah hijau | |
|---|---|
| #CEEAD6 (hijau/100) |
| Tema gelap #474741 | |
| Ikon pengaturan hijau | |
|---|---|
| #34A853 (hijau/500) |
| Tema gelap #34A853 (hijau/500) | |
| Tombol pindai | |
|---|---|
| Tombol hijau |
| #5BB974 (hijau/400) | |
| Judul | Subjudul |
|
|
|---|---|
| #1B1C17 (WarnaTeksUtama) | #46483B (TeksWarna Sekunder) |
keadaan kuning
| Perisai Kuning | |
|---|---|
| #F9AB00 (Kuning/600) |
| Tema gelap #FBBC04 (kuning/500) | |
| Wadah kuning | |
|---|---|
| #FEEFC3 (kuning/100) |
| Tema gelap #474741 (kuning/500) | |
| Ikon pengaturan kuning | |
|---|---|
| #FBBC04 (kuning/500) |
| Tema gelap #FBBC04 (kuning/500) | |
| Tombol pindai | |
|---|---|
| Tombol kuning |
| #5BB974 (Kuning/400) | |
| Judul | Subjudul |
|
|
|---|---|
| #1B1C17 (WarnaTeksUtama) | #46483B (TeksWarna Sekunder) |
negara bagian merah
| Perisai Merah | |
|---|---|
| #D93025 (Merah/600) |
| Tema gelap #EA4335 (merah/500) | |
| Wadah merah | |
|---|---|
| #FAD2CF (merah/100) |
| Tema gelap #474741 | |
| Ikon pengaturan merah | |
|---|---|
| #EA4335 (merah/500) |
| Tema gelap #EA4335 (merah/500) | |
| tombol hapus instalan | |
|---|---|
| Tombol merah |
| #EE675C (merah/400) | |
| Judul | Subjudul |
|
|
|---|---|
| #1B1C17 (WarnaTeksUtama) | #46483B (TeksWarna Sekunder) |
Font dan tampilan teks
Font dan tampilan teks Pusat Keamanan didasarkan pada tampilan teks default Android dan harus mewarisi perubahan apa pun pada kelompok font, bobot, dan properti lain yang telah dikonfigurasi oleh OEM untuk gaya seluruh perangkat mereka. Tampilan teks Pusat Keamanan dapat diganti secara langsung menggunakan RRO.
| Tampilan Teks Pusat Keamanan | Basis PerangkatDefault | Warna | Ukuran | Berat |
|---|---|---|---|---|
TextAppearance.SafetyCenter.Headline | TextAppearance.DeviceDefault.Headline | android:textColorPrimary | Bervariasi | Reguler |
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 | Bervariasi | 14 sp/20 sp atau 16 sp/24 sp | Sedang |
TextAppearance.SafetyCenter.Body | TextAppearance.DeviceDefault.Small | android:textColorSecondary | 14 sp/20 sp | Reguler |
Jarak dan gaya
Pusat Keamanan menggunakan serangkaian nilai padding default secara universal untuk padding dan margin. Ubah kepadatan informasi Pusat Keamanan dengan mengganti nilai spasi.
| Nama Sumberdaya | Nilai bawaan |
|---|---|
@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 |
Anda dapat menyesuaikan radius sudut kartu Pusat Keamanan. Jari-jari ukuran satu sudut digunakan untuk tombol dan tiga ukuran sudut digunakan untuk kartu Pusat Keamanan:
| Nama Sumberdaya | Nilai bawaan |
|---|---|
@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 |
Ubin Pengaturan Cepat
Pusat Keamanan dapat diakses dari ubin Pengaturan Cepat yang diterapkan dalam modul PermissionController. Petak Pengaturan Cepat menggunakan kembali beberapa komponen UI dari layar Pusat Keamanan sehingga overlay dapat berfungsi:
- Layanan ubin Pengaturan Cepat:
SafetyCenterQsTileService.kt - Aktivitas Pengaturan Cepat:
SafetyCenterQsActivity.java