Thư viện bộ công cụ giao diện người dùng Leanback

Tạo dựng ứng dụng hiệu quả hơn bằng Compose
Tạo giao diện người dùng đẹp mắt với mã tối thiểu bằng Jetpack Compose cho hệ điều hành Android TV.

Bộ công cụ giao diện người dùng Leanback không được dùng nữa cung cấp một số thư viện dành riêng cho TV, chỉ dành cho các ứng dụng được phát triển cho Android TV OS. Các thư viện này bao gồm:

  • Thư viện Leanback: cung cấp các mẫu giao diện người dùng giúp đơn giản hoá việc tạo ứng dụng Android TV.
  • Thư viện Leanback Preferences: cung cấp các màn hình lựa chọn ưu tiên và cài đặt nhất quán với nền tảng nhưng có thể được tạo chủ đề cho phù hợp với ứng dụng của bạn.
  • Thư viện Phân trang Leanback: hỗ trợ mô hình phân trang AndroidX cho ObjectAdapters, thường được dùng với các mẫu Leanback.
  • Thư viện Leanback Tabs: hỗ trợ chế độ điều hướng theo thẻ trên Android TV.

Thư viện phân trang Leanback

Tính năng phân trang trong bộ công cụ giao diện người dùng Leanback hoạt động giống như thư viện Paging 3 của AndroidX. Thư viện này giúp đơn giản hoá việc thêm tính năng phân trang vào RecyclerView.Adapter. Với thư viện Phân trang Leanback, bộ chuyển đổi được hiển thị thường là ObjectAdapter, vì vậy, thư viện sẽ thêm tính năng hỗ trợ phân trang vào ObjectAdapter.

Để thêm một bộ điều hợp phân trang vào ứng dụng, trước tiên, hãy thêm phần phụ thuộc thư viện vào dự án của bạn:

implementation "androidx.leanback:leanback-paging:$version"

Sau đó, hãy làm theo tài liệu về Paging 3 bằng cách sử dụng androidx.leanback.paging.PagingDataAdapter thay vì androidx.paging.PagingDataAdapter. Điểm khác biệt duy nhất là giờ đây, bạn có thể truyền vào một Presenter hoặc PresenterSelector. Phím tắt này hoạt động ở bất kỳ vị trí nào mà bạn thường dùng ObjectAdapter, chẳng hạn như trong ListRow:

Kotlin

val adapter: PagingDataAdapter<MyItem> = PagingDataAdapter(myPresenter,
   object : DiffUtil.ItemCallback<MyItem>() {
       override fun areItemsTheSame(
           oldItem: MyItem,
           newItem: MyItem
       ): Boolean {
           return oldItem.id === newItem.id
       }

       override fun areContentsTheSame(
           oldItem: MyItem,
           newItem: MyItem
       ): Boolean {
           return oldItem == newItem
       }
   })

val header = HeaderItem(headerTitle)
val row = ListRow(header, adapter)

Java

PagingDataAdapter<MyItem> adapter = new PagingDataAdapter(myPresenter, new DiffUtil.ItemCallback<MyItem>() {
    @Override
    public boolean areItemsTheSame(@NonNull MyItem oldItem, @NonNull MyItem newItem) {
        return oldItem.getId().equals(newItem.getId());
    }

    @Override
    public boolean areContentsTheSame(@NonNull MyItem oldItem, @NonNull MyItem newItem) {
        return oldItem.equals(newItem);
    }
});

HeaderItem header = new HeaderItem(headerTitle);
Row row = new ListRow(header, adapter);

Thư viện Thẻ Leanback

Các mẫu bộ công cụ giao diện người dùng Leanback cung cấp chế độ điều hướng bên trong màn hình duyệt xem. Để thêm một hàng thẻ theo chiều ngang ở đầu ứng dụng, bạn có thể sử dụng Thẻ Leanback.

Thêm phần phụ thuộc của thư viện vào dự án:

implementation "androidx.leanback:leanback-tab:$version"

Sau đó, hãy triển khai các thẻ bằng cách dùng LeanbackTabLayoutLeanbackViewPager theo hướng dẫn hiện có về ViewPager. Xin lưu ý rằng LeanbackViewPager dựa trên ViewPager chứ không dựa trên ViewPager2.

Sau đây là một ví dụ:

Kotlin

val leanbackTabLayout = findViewById<LeanbackTabLayout>(R.id.tab_layout)
val leanbackViewPager = findViewById<LeanbackViewPager>(R.id.view_pager)

leanbackViewPager.setAdapter(adapter)
leanbackTabLayout.setupWithViewPager(leanbackViewPager)

Java

LeanbackTabLayout leanbackTabLayout = findViewById(R.id.tab_layout);
LeanbackViewPager leanbackViewPager = findViewById(R.id.view_pager);

leanbackViewPager.setAdapter(adapter);
leanbackTabLayout.setupWithViewPager(leanbackViewPager);

Các điểm hạn chế

Thư viện Thẻ Leanback có những hạn chế về các giao diện mà thư viện này hỗ trợ và cách xử lý chuyển động tiêu điểm.

Các chủ đề được hỗ trợ

Chỉ hỗ trợ những giao diện bắt nguồn từ Theme.AppCompat. TabLayout chứa một ràng buộc thực thi giao diện, ngăn không cho sử dụng bất kỳ giao diện không phải là giao diện con nào của Theme.AppCompat. Bạn cũng có thể sử dụng giao diện cầu nối cho bộ công cụ giao diện người dùng Leanback.

Di chuyển tiêu điểm từ các thẻ lên trên cùng

Khi chiều cao bố cục lớn hơn chiều cao màn hình và bạn nhấn nút lên trên D-pad, chế độ điều khiển sẽ quay lại thẻ thay vì ở trong mảnh và chuyển đến một mục ở phía trên (xem hình 1). Để xử lý vấn đề này, nội dung bên trong mảnh phải ghi đè tìm kiếm tiêu điểm; ví dụ: sử dụng RowsSupportFragment. BrowseSupportFragment không thể dùng bên trong thẻ vì có phương thức tìm kiếm tiêu điểm bị ghi đè, ngăn tiêu điểm di chuyển trở lại thẻ.

Hình 1. Nút lên trên D-pad sẽ di chuyển tiêu điểm đến thẻ thay vì mục trước đó.