Tùy chỉnh thanh công cụ với lớp phủ tài nguyên thời gian chạy

Tổng quan về bố cục cơ sở

Thanh công cụ car-ui-lib được tùy chỉnh thông qua tệp bố cục car_ui_base_layout_toolbar.xml . Nó được gọi là thanh công cụ *bố trí cơ sở* vì tệp bố cục này chứa FrameLayout với id car_ui_base_layout_content_container , sẽ chứa tất cả nội dung của ứng dụng ngay sau khi bố cục được tăng cường. Cấu trúc này cho phép OEM đặt thanh công cụ ở các vị trí khác ngoài đầu màn hình.

Bố cục có thể
Bố cục thanh công cụ 1Bố cục thanh công cụ 2Bố cục thanh công cụ 3
Bố cục thanh công cụ 4Bố cục thanh công cụ 5Bố cục thanh công cụ 6

Bằng cách thay đổi các tham số bố cục trên car_ui_base_layout_content_container , ứng dụng có thể được nén vào một khu vực nhỏ hơn để tạo khoảng trống cho thanh công cụ. Tuy nhiên, một số tùy chỉnh có thể yêu cầu thanh công cụ phải trong suốt và được phủ lên trên ứng dụng. Trong trường hợp này, các chế độ xem có thể được gắn thẻ bằng car_ui_top/bottom/left/right_inset . Nếu car-ui-lib phát hiện một chế độ xem có thẻ như vậy, nó sẽ thông báo vị trí và kích thước của chế độ xem đó cho ứng dụng để ứng dụng có thể thụt lề nội dung của nó vào bên trong theo lượng đó nhưng vẫn giữ nền hợp lý trong khoảng trống bên dưới thanh công cụ . Ví dụ: hầu hết các ứng dụng sẽ có mục đầu tiên trong CarUiRecyclerView bắt đầu bên dưới phần lồng ghép được chỉ định nhưng vẫn hiển thị phía sau thanh công cụ khi người dùng cuộn xuống.

Hỗ trợ quay

Để hỗ trợ bộ điều khiển quay, bố cục cơ sở phải chứa FocusParkingView càng sớm càng tốt trong bố cục. Chế độ xem này là nội dung được tập trung khi người dùng không nhìn thấy tiêu điểm. Thanh công cụ cũng phải được bao bọc trong FocusParkingView , chỉ định rằng đó là vùng di chuyển riêng cho bộ điều khiển quay. Nếu nó không được bao bọc trong FocusParkingView thì người dùng không thể tương tác với thanh công cụ bằng bộ điều khiển quay.

Tab

Các tab thanh công cụ được tùy chỉnh bằng tệp bố cục car_ui_toolbar_tab_item.xml hoặc car_ui_toolbar_tab_item_flexible.xml . Không có sự khác biệt về chức năng giữa các tệp, tài nguyên Boolean car_ui_toolbar_tab_flexible_layout sẽ xác định tệp nào được sử dụng. Do đó, bạn nên đặt car_ui_toolbar_tab_flexible_layout thành false và chỉ tùy chỉnh tệp bố cục thông thường.

ImageView của tab sẽ được tô màu car_ui_toolbar_tab_item_selector trong mã Java, vì vậy car_ui_toolbar_tab_item_selector phải được tùy chỉnh cùng với bố cục. Các ứng dụng cũng có thể yêu cầu các biểu tượng tab của chúng không được tô màu này.

TextView của tab có giao diện văn bản được đặt thành TextAppearance.CarUi.Widget.Toolbar.Tab hoặc TextAppearance.CarUi.Widget.Toolbar.Tab.Selected trong mã Java, do đó, giao diện văn bản được đặt trên tệp bố cục sẽ không được áp dụng. Những phong cách này cũng phải được tùy chỉnh.

MenuItems là các nút ở góc trên bên phải của thanh công cụ mặc định. Chúng có thể là văn bản, biểu tượng, biểu tượng và văn bản hoặc công tắc. Các biến thể này đều là một phần của tệp bố cục car_ui_toolbar_menu_itemMenuItems cần có khả năng thay đổi giữa mỗi biểu mẫu nếu ứng dụng yêu cầu.

MenuItems có thể là Primary , làm tăng thêm một tệp bố cục khác: car_ui_toolbar_menu_item_primary . MenuItem chính phải trông khác biệt về mặt trực quan so với MenuItem thông thường, chẳng hạn như thông qua nút có viền/không viền. Theo mặc định, car_ui_toolbar_menu_item_primary chỉ chuyển hướng đến car_ui_toolbar_menu_item , vì vậy chúng trông giống nhau.

MenuItems có thể được kích hoạt , đây là một trạng thái trực quan khác cho biết MenuItem này đã được bật. Trạng thái này được triển khai bằng cách gọi setActivated(true) trên chế độ xem MenuItem, trạng thái này sẽ thêm trạng thái state_activated cho tất cả các đối tượng có thể vẽ trong chế độ xem của MenuItem. Trạng thái có thể vẽ này có thể được phản hồi bằng bộ chọn có thể vẽ trong lớp phủ tài nguyên thời gian chạy (RRO).

MenuItems có thể bị hạn chế UX khi xe đang di chuyển. UX bị hạn chế chỉ là một trạng thái có thể vẽ khác như được kích hoạt , nhưng lần này trạng thái được xác định trong ứng dụng thay vì khung Android. Điều này có nghĩa là thuộc tính state_ux_restricted cũng phải được phủ bằng RRO, sao cho thuộc tính được xác định trong RRO khớp với thuộc tính được xác định trong ứng dụng.

Thanh tìm kiếm được chứa trong một tệp bố cục car_ui_toolbar_search_view riêng biệt để cải thiện hiệu suất tăng cường bố cục cho các ứng dụng không cần thanh tìm kiếm. FrameLayout có id car_ui_toolbar_search_view_container sẽ chứa thanh tìm kiếm khi nó tăng cao.