Thẻ thông báo

Thẻ thông báo truyền tải một lượng nhỏ thông tin kịp thời từ hệ thống hoặc từ ứng dụng.

Thiết kế của những thẻ này dành cho hệ điều hành Android Automotive OS nhằm mục đích giảm thiểu sự xao nhãng cho người lái xe. Các thẻ có ba phiên bản cơ bản:

  • Thẻ thông báo nổi (HUN): Được sử dụng cho thông báo xuất hiện nhanh trên màn hình hiện tại.
  • Thẻ Trung tâm Thông báo: Dùng để hiển thị các thông báo trong Trung tâm Thông báo.
  • Thẻ thông báo nhóm: Kết hợp nhiều thẻ Trung tâm thông báo thành một thẻ duy nhất.

Trong các phiên bản này, thiết kế cũng có thể khác nhau đôi chút tùy thuộc vào loại thông báo. Ví dụ, thông báo cuộc gọi có các nút và biểu tượng khác với thông báo điều hướng.

Giải phẫu học

Thẻ thông báo là một thành phần linh hoạt có thể bao gồm nhiều yếu tố khác nhau. Nó có ba phiên bản chính:

  • Thẻ HUN: Phiên bản này rộng hơn thẻ Trung tâm Thông báo và hiển thị ở trên cùng màn hình hiện tại cho đến khi bị ẩn đi.
  • Thẻ Trung tâm Thông báo: Phiên bản này hẹp hơn thẻ HUN và xuất hiện cùng với các thẻ tương tự khác trong Trung tâm Thông báo, theo dạng danh sách dọc.
  • Thẻ thông báo nhóm: Phiên bản này của thẻ Trung tâm thông báo kết hợp nhiều thông báo liên quan vào một thẻ duy nhất, với các nút điều khiển để mở rộng hiển thị từng thông báo riêng lẻ.

Các biến thể của các phiên bản này theo loại thông báo được hiển thị trong mục Kiểu .

Hình ảnh dưới đây hiển thị cùng một thẻ thông báo, phiên bản dành cho HUN và Trung tâm Thông báo, với các thành phần sau:
1. Tiêu đề
2. Nội dung (có và không có tùy chọn xem trước tin nhắn, có thể ẩn đi khi xe đang chạy)
3. Hành động
4. Biểu tượng lớn


Hình ảnh hiển thị ở đây là một thẻ thông báo nhóm ở cả dạng thu gọn và mở rộng, bao gồm các thành phần sau:
1. Tiêu đề
2. Nội dung
3. Hành động mở rộng/thu gọn
4. Chỉ báo mở rộng/thu gọn

Thông số kỹ thuật – Thẻ HUN

HUN tiêu chuẩn

HUN với hình đại diện

Gửi tin nhắn cho HUN kèm bản xem trước

Gửi tin nhắn tới HUN kèm nhiều tin nhắn khác nhau.

Hình ảnh lớn HUN

Thông số kỹ thuật – Thẻ Trung tâm thông báo

Thông báo tiêu chuẩn

Thông báo tin nhắn kèm xem trước

Thông báo tin nhắn với nhiều tin nhắn

Thông báo hành động đơn lẻ

Thông số kỹ thuật – Thẻ thông báo nhóm

Thông báo nhóm – Thu gọn

Thông báo nhóm – Mở rộng

Điều chỉnh tỷ lệ bố cục

Các bố cục tham khảo này cho thấy cách điều chỉnh thông báo để phù hợp với màn hình có chiều rộng và chiều cao khác nhau. Lưu ý rằng tất cả các giá trị pixel đều là pixel đã được hiển thị, trước khi bất kỳ quá trình giảm kích thước hoặc tăng kích thước nào diễn ra.

biểu tượng chú thích
Cách trình bày
Lề, đường kẻ và khoảng đệm cho các kích thước màn hình khác nhau.

Màn hình chiều rộng tiêu chuẩn

Thẻ HUN.


Thẻ Trung tâm Thông báo.

Thẻ thông báo nhóm (thu gọn).

Thẻ thông báo nhóm (mở rộng).

Màn hình rộng

Thẻ HUN.


Thẻ Trung tâm Thông báo.

Thẻ thông báo nhóm (thu gọn).

Thẻ thông báo nhóm (mở rộng).

Màn hình cực rộng và siêu rộng

Thẻ HUN.


Thẻ Trung tâm Thông báo.

Thẻ thông báo nhóm (thu gọn).

Thẻ thông báo nhóm (mở rộng).

Khoảng cách dọc giữa các thông báo trên màn hình có chiều cao khác nhau

Các thông số về khoảng cách dọc trong phần này chỉ áp dụng cho thẻ HUN.

Màn ảnh ngắn

Thẻ HUN.

Màn hình cao và màn hình tiêu chuẩn

Thẻ HUN.

Phong cách

Kiểu chữ

Kiểu chữ Kiểu chữ Cân nặng Kích thước (dp)
Thân 1 Robot Thường xuyên 32
Thân 3 M Robot Trung bình 24
Thân 3 Robot Thường xuyên 24

Màu sắc

Yếu tố Màu sắc (chế độ ban ngày) Màu sắc (chế độ ban đêm)
Loại chính / biểu tượng Trắng Màu trắng @ 88%
Loại thứ cấp Màu trắng @ 72% Màu trắng @ 60%
Biểu tượng phụ Giọng điệu của bên thứ ba Giọng điệu của bên thứ ba
Đường phân chia tóc Màu trắng 22% Màu trắng 12%
Hình nền thẻ Xám 868 Xám 900
Màn chắn chuyển màu Màu đen 100% - 0% Màu đen 100% - 20%

Kích thước

Yếu tố Kích thước (dp)
Biểu tượng chính 44
Biểu tượng phụ 36
Avatar cỡ trung bình 76
Bán kính bo tròn góc (R2) 8

Ví dụ

Các thẻ HUN: Gọi điện, Nhắn tin, Cảnh báo xe và Điều hướng.
Các thẻ trong Trung tâm Thông báo: Cuộc gọi, Tin nhắn và Cảnh báo xe.
Thẻ thông báo nhóm: Tin nhắn, mở rộng và thu gọn - theo ngày.
Thẻ thông báo nhóm: Tin nhắn, mở rộng và thu gọn - ban đêm.

Cử động

Các thao tác sau đây là một phần quan trọng của trải nghiệm thông báo:

  • chuyển động đến của HUN
  • Thao tác vuốt để đóng thông báo
  • Các thao tác mở rộng và thu gọn thông báo nhóm

Sự xuất hiện của HUN

Chuyển động của biểu tượng HUN trượt xuống từ đầu màn hình giúp người dùng nhận biết sự xuất hiện của nó, đồng thời cung cấp gợi ý về cách truy cập thông báo bằng cách vuốt xuống nếu Trung tâm Thông báo được triển khai dưới dạng thanh kéo xuống.

Vuốt để bỏ qua

Thao tác kéo khi người dùng vuốt ngang trên một thông báo sẽ cung cấp xác nhận trực quan rằng thông báo đó đang được đóng lại, sau đó chuyển động hướng lên của thông báo tiếp theo sẽ lấp đầy khoảng trống trong danh sách.

Thông báo nhóm mở rộng và thu gọn

Việc cho phép nhóm thẻ thông báo kéo dài xuống dưới tạo ra sự chuyển tiếp mượt mà từ trạng thái thu gọn sang trạng thái mở rộng.