Tuỳ chỉnh giao diện người dùng của Trung tâm an toàn

Mã cho giao diện người dùng của Trung tâm an toàn nằm trong thư mục safetycenter packages/modules/Permission/PermissionController/src/com/android/permissioncontroller/safetycenter/. Tuỳ chỉnh giao diện người dùng của Trung tâm an toàn bằng Lớp phủ tài nguyên trong thời gian chạy (RRO) trong Thư mục lớp phủ OEM. Để biết thông tin về RRO, hãy xem phần Thay đổi giá trị của trong thời gian chạy.

Giao diện và màu sắc của Trung tâm an toàn

Trung tâm an toàn có 4 chủ đề nguyên tắc có cùng thuộc tính trên giao diện người dùng:

  • Đèn Trung tâm an toàn
  • Trung tâm an toàn ở chế độ tối
  • Đèn trong trình đơn Cài đặt nhanh của Trung tâm an toàn
  • Phần Cài đặt nhanh của Trung tâm an toàn, tối

Các giao diện của Trung tâm an toàn có màu mặc định. Màu sắc trên giao diện người dùng nguyên tắc được vẽ từ màu hệ thống Android và có thể tự động điều chỉnh theo tuỳ chỉnh màu cho Android. Theo mặc định, những màu này sẽ điều chỉnh như một phần của Tạo kiểu bằng Material You trong Android.

Bạn có thể thay đổi màu của Trung tâm an toàn bằng cách ghi đè giá trị của màu đó.

Màu giao diện người dùng của Trung tâm an toàn Tên thuộc tính Tài nguyên
Thông tin khái quát android:colorBackground @android:color/background_device_default_light
@android:color/primary_dark_device_default_settings
Bề mặt colorSurface @color/sc_surface_light @color/sc_surface_dark
Biến thể của vùng hiển thị colorSurfaceVariant @color/sc_surface_variant_light
@color/sc_surface_variant_dark
Văn bản chính android:textColorPrimary @android:color/text_color_primary
Văn bản thứ cấp android:textColorSecondary @android:color/text_color_secondary
Biểu tượng android:textColorSecondary @android:color/text_color_secondary
Tài nguyên Giá trị mặc định
@color/sc_surface_light @android:color/system_neutral1_500 có giá trị L sao 98 (độ chói cảm quan)
@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

Màu mức độ nghiêm trọng của vấn đề

Trung tâm an toàn sẽ thông báo mức độ nghiêm trọng của vấn đề bằng hệ thống màu đèn giao thông:

  • Màu xanh lục biểu thị vấn đề về thông tin và trạng thái OK
  • Màu vàng cho nội dung đề xuất
  • Màu đỏ cho các vấn đề nghiêm trọng
  • Màu xám biểu thị trường hợp không có thông tin

Theo mặc định, những màu này được vẽ từ bảng màu của Google Material. T4 khuyên bạn nên giữ các màu cơ bản này, nhưng bạn có thể sử dụng các sắc độ khác nhau bảng màu xanh lục, vàng và đỏ.

Những thuộc tính màu sắc này dùng để liên kết các mục có màu mức độ nghiêm trọng trong thuộc tính Giao diện người dùng của Trung tâm an toàn, trong đó có các biểu tượng, nút cũng như nội dung quét và nội dung thay đổi trạng thái ảnh động. Việc sửa đổi các màu này sẽ tô màu lại tất cả phần tử. Ví dụ: sửa đổi @color/sc_status_info_{light,dark} thay đổi màu nền trong cả hai hình ảnh trạng thái tĩnh và ảnh động của nền trong quá trình quét.

Giao diện Cài đặt nhanh của Trung tâm an toàn sử dụng màu chế độ tối, cho dù thiết bị được đặt ở chế độ tối.

Tính nghiêm trọng Phần tử trên giao diện người dùng Tên thuộc tính hoặc tài nguyên Màu mặc định
Thông tin (Xanh lục) Thẻ thông tin trạng thái ?attr/colorScStatusInfo Sáng: Xanh lục 600 (#1e8e3e)
Tối: Xanh lục 500 (#34a853)
Vùng chứa thẻ trạng thái ?attr/colorScStatusBackgroundInfo Sáng: Xanh lục 100 (#ceead6)
colorSurfaceVariant
Biểu tượng ?attr/colorScIconInfo Xanh lục 500 (#34a853)
Nút hành động chính @color/safety_center_button_info Xanh lục 400 (#5bb974)
Nút hành động phụ @color/safety_center_outline_button_info Xanh lục 300 (#81c995)
Đề xuất (Màu vàng) Thẻ thông tin trạng thái ?attr/colorScStatusRecommend Sáng: Vàng 600 (#f9ab00)
Tối: Vàng 500 (#fbbc04)
Vùng chứa thẻ trạng thái ?attr/colorScStatusBackgroundRecommend Sáng: Vàng 100 (#feefc3)
Tối: colorSurfaceVariant
Biểu tượng ?attr/colorScIconRecommend 500 màu vàng (#fbbc04)
Nút hành động chính @color/safety_center_button_recommend Vàng 400 (#fcc934)
Nút hành động phụ @color/safety_center_outline_button_recommend Vàng 300 (#fdd663)
Cảnh báo (Đỏ) Thẻ thông tin trạng thái ?attr/colorScStatusWarn Sáng: Đỏ 600 (#d93025)
Tối: Đỏ 500 (#ea4335)
Vùng chứa thẻ trạng thái ?attr/colorScStatusBackgroundWarn Sáng: Đỏ 100 (#fad2cf)
Tối: colorSurfaceVariant
Biểu tượng ?attr/colorScIconWarn Đỏ 500 (#ea4335)
Nút hành động chính @color/safety_center_button_warn Đỏ 400 (#ee675c)
Nút hành động phụ @color/safety_center_outline_button_warn Đỏ 300 (#f28b82)
Không có đề xuất (Xám) Biểu tượng ?attr/colorScIconNull Xám 600 (#80868b)

Trong Android 14, tài nguyên màu có thể phủ lên đã được thêm cho từng thuộc tính màu giao diện và một số màu mặc định đã được sửa đổi:

Tên tài nguyên Màu hỗ trợ trên Android 13 Màu hỗ trợ trên Android 14 Mã hex Android 14
@color/sc_status_info_light Xanh lục 600 Màu xanh lục ngữ nghĩa #0E8435
@color/sc_status_recommend_light Vàng 600 Không thay đổi
@color/sc_status_warn_light Đỏ 600 Không thay đổi
@color/sc_status_info_dark Xanh lục 500 Xanh lục 400 #5BB974
@color/sc_status_recommend_dark Vàng 500 Vàng 400 #FCC934
@color/sc_status_warn_dark Đỏ 500 Đỏ 400 #EE675C
@color/sc_status_background_info_light Xanh lục 100 Không thay đổi
@color/sc_status_background_recommend_light Vàng 100 Không thay đổi
@color/sc_status_background_warn_light Đỏ 100 Không thay đổi
@color/sc_status_background_info_dark sc_surface_variant_tối Không thay đổi
@color/sc_status_background_recommend_dark sc_surface_variant_tối Không thay đổi
@color/sc_status_background_warn_dark sc_surface_variant_tối Không thay đổi
@color/sc_icon_info_light Xanh lục 500 Không thay đổi
@color/sc_icon_recommend_light Vàng 500 Không thay đổi
@color/sc_icon_warn_light Đỏ 500 Không thay đổi
@color/sc_icon_null_light Xám 600 Không thay đổi
@color/sc_icon_info_dark Xanh lục 500 Xanh lục 400
@color/sc_icon_recommend_dark Vàng 500 Vàng 400
@color/sc_icon_warn_dark Đỏ 500 Đỏ 400
@color/sc_icon_null_dark Xám 600 Xám 400 #BDC1C6
@color/sc_shield_accent_dark Không có Xám 900 #202124

Màu giao diện người dùng

Trạng thái xanh lục

Lá xanh

#1E8E3E (xanh lục/600)
Giao diện tối
#34A853 (xanh lục/500)
Vùng chứa màu xanh lục

#CEEAD6 (xanh lục/100)
Giao diện tối
#474741
Biểu tượng cài đặt màu xanh lục

#34A853 (xanh lục/500)
Giao diện tối
#34A853 (xanh lục/500)
Nút Quét

Nút màu xanh lục
#5BB974 (xanh lục/400)
Tiêu đề Phụ đề

#1B1C17 (TextColorPrimary) #46483B (TextColorSecondary)

Trạng thái màu vàng

Khiên màu vàng

#F9AB00 (Vàng/600)
Giao diện tối
#FBBC04 (vàng/500)
Vùng chứa màu vàng

#FEEFC3 (vàng/100)
Giao diện tối
#474741 (vàng/500)
Biểu tượng cài đặt màu vàng

#FBBC04 (vàng/500)
Giao diện tối
#FBBC04 (vàng/500)
Nút Quét

Nút màu vàng
#5BB974 (Vàng/400)
Tiêu đề Phụ đề

#1B1C17 (TextColorPrimary) #46483B (TextColorSecondary)

Trạng thái màu đỏ

Bảo vệ Đỏ

#D93025 (Đỏ/600)
Giao diện tối
#EA4335 (đỏ/500)
Vùng chứa màu đỏ

#FAD2CF (đỏ/100)
Giao diện tối
#474741
Biểu tượng cài đặt màu đỏ

#EA4335 (đỏ/500)
Giao diện tối
#EA4335 (đỏ/500)
Nút gỡ cài đặt

Nút màu đỏ
#EE675C (đỏ/400)
Tiêu đề Phụ đề

#1B1C17 (TextColorPrimary) #46483B (TextColorSecondary)

Phông chữ và giao diện văn bản

Phông chữ và giao diện văn bản của Trung tâm an toàn dựa trên văn bản mặc định của Android và nên kế thừa mọi thay đổi đối với bộ phông chữ, độ đậm và các thuộc tính đã được OEM định cấu hình cho kiểu trên toàn thiết bị của họ. Trung tâm an toàn giao diện văn bản có thể được ghi đè trực tiếp bằng cách sử dụng RRO.

Giao diện Văn bản của Trung tâm an toàn Cơ sở DeviceDefault Màu Kích thước Cân nặng
TextAppearance.SafetyCenter.Headline TextAppearance.DeviceDefault.Headline android:textColorPrimary Thay đổi Thông dụng
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 Thay đổi 14 sp/20 sp hoặc
16 sp/24 sp
Trung bình
TextAppearance.SafetyCenter.Body TextAppearance.DeviceDefault.Small android:textColorSecondary 14 sp/20 sp Thông dụng

Giãn cách và kiểu

Trung tâm an toàn sử dụng một nhóm giá trị khoảng đệm mặc định cho tất cả khoảng đệm và lề. Thay đổi mật độ thông tin trong Trung tâm an toàn bằng cách ghi đè khoảng cách giá trị.

Tên tài nguyên Giá trị mặc định
@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

Bạn có thể tuỳ chỉnh bán kính góc của các thẻ Trung tâm an toàn. Một góc bán kính dùng cho các nút và kích thước ba góc được dùng cho Trung tâm an toàn thẻ:

Tên tài nguyên Giá trị mặc định
@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

Ô Cài đặt nhanh

Bạn có thể truy cập Trung tâm an toàn từ ô Cài đặt nhanh được triển khai trong Mô-đun permissionController. Ô Cài đặt nhanh sử dụng lại một số giao diện người dùng các thành phần từ màn hình Trung tâm an toàn để các lớp phủ có thể hoạt động: