Thanh điều khiển cung cấp các chế độ điều khiển liên kết với một chế độ xem cụ thể. Trung tâm này hiển thị tối đa 5 chế độ điều khiển trong phiên bản không mở rộng và tối đa 5 chế độ điều khiển bổ sung khi mở rộng.
Trong ứng dụng đa phương tiện, thanh điều khiển được dùng trong chế độ xem phát/Tạm dừng, Trước, Tiếp theo và các chế độ điều khiển khác, bao gồm cả các chế độ điều khiển dành cho các thao tác tuỳ chỉnh của bên thứ ba.
Phân tích
Thanh điều khiển có hai định dạng: không mở rộng và mở rộng. Phiên bản không mở rộng có thể bao gồm tối đa 5 chế độ điều khiển. Trong ứng dụng đa phương tiện, một trong các chế độ đó là Phát/Tạm dừng.
Khi được mở rộng, thanh điều khiển có thể bao gồm tối đa 5 chế độ điều khiển bổ sung trong hàng thứ hai. Người dùng có thể chọn nút mục bổ sung để mở rộng hoặc thu gọn thanh điều khiển.
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-anatomy-1.png?authuser=19&hl=vi)
2. Phần mở rộng của thanh thao tác
3. Một trong các chế độ kiểm soát
4. Nút xem thêm (mở rộng và thu gọn thanh điều khiển)
Thông số
Thanh điều khiển
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-spec-1.png?authuser=19&hl=vi)
Thanh điều khiển được mở rộng
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-spec-2.png?authuser=19&hl=vi)
Vị trí của 1–4 chế độ điều khiển trên thanh điều khiển với bộ điều khiển cố định ở giữa
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-spec-3.png?authuser=19&hl=vi)
Vị trí của 1–4 chế độ điều khiển trên thanh điều khiển không có chế độ điều khiển cố định
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-spec-4.png?authuser=19&hl=vi)
Vị trí của 6–9 điều khiển trên thanh điều khiển
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-spec-5.png?authuser=19&hl=vi)
Điều chỉnh tỷ lệ bố cục
Các bố cục tham chiếu này cho thấy cách điều chỉnh thanh điều khiển cho phù hợp với các màn hình có chiều rộng và chiều cao khác nhau. (Danh mục chiều rộng và chiều cao được xác định trong phần Bố cục.) Lưu ý rằng tất cả các giá trị pixel đều tính bằng pixel được kết xuất, trước khi xảy ra bất kỳ quá trình giảm hoặc tăng tần số lấy mẫu nào.
Màn hình cực rộng có các lề giữa các lề hơn 1028 dp
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-ar-1.png?authuser=19&hl=vi)
Màn hình cực rộng có các lề dưới 1028dp
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-ar-2.png?authuser=19&hl=vi)
Màn hình rộng
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-ar-3.png?authuser=19&hl=vi)
Màn hình có chiều rộng tiêu chuẩn
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-ar-4.png?authuser=19&hl=vi)
Màn hình ngắn
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-ar-0.png?authuser=19&hl=vi)
Thanh điều khiển được mở rộng trên màn hình ngắn hơn 1000 dp
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-ar-5.png?authuser=19&hl=vi)
Thanh điều khiển được mở rộng trên màn hình ngắn
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-ar-7.png?authuser=19&hl=vi)
Thanh điều khiển được mở rộng trên màn hình cao hơn 1000 dp
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-ar-6.png?authuser=19&hl=vi)
Kiểu
Màu
Phần tử | Màu(chế độ ban ngày) | Màu (chế độ ban đêm) |
---|---|---|
Biểu tượng chính | Trắng | Trắng @ 88% |
Màn toàn màn hình | Đen @ 78% | Đen @ 84% |
Màn chắn chuyển màu | Chưa xác định | Chưa xác định |
Kích thước
Phần tử | Kích thước (dp) |
---|---|
Thanh điều khiển | 96 (màn hình ngắn) / 128 (chiều cao tiêu chuẩn trở lên) |
Biểu tượng chính | 44 |
Ví dụ
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-mock-3.png?authuser=19&hl=vi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-mock-4.png?authuser=19&hl=vi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-mock-5.png?authuser=19&hl=vi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-mock-1.png?authuser=19&hl=vi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-mock-6.png?authuser=19&hl=vi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-mock-2.png?authuser=19&hl=vi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/action-bar-controlbar.gif?authuser=19&hl=vi)