Thiết bị TV cung cấp một số chế độ điều khiển thao tác cho ứng dụng. Việc tạo một lược đồ điều hướng hiệu quả cho ứng dụng TV phụ thuộc vào việc hiểu rõ các chế độ điều khiển bị hạn chế này cũng như giới hạn của người dùng khi sử dụng ứng dụng. Khi tạo ứng dụng Android cho TV, hãy đặc biệt chú ý đến cách người dùng thao tác khi sử dụng các nút điều khiển từ xa thay vì màn hình cảm ứng.
Nguyên tắc
Mục tiêu là để quá trình điều hướng mang lại cảm giác tự nhiên và quen thuộc mà không chi phối giao diện người dùng hoặc chuyển sự chú ý vào nội dung. Các nguyên tắc sau đây giúp đặt cơ sở để mang đến trải nghiệm nhất quán và trực quan cho người dùng trên các ứng dụng dành cho TV.
Giúp người dùng truy cập nội dung nhanh chóng và dễ dàng. Người dùng muốn truy cập vào nội dung nhanh chóng mà chỉ cần số lượt nhấp tối thiểu. Hãy sắp xếp thông tin của bạn theo cách yêu cầu ít màn hình nhất.
Làm theo các phương pháp hay nhất và đề xuất để giúp người dùng dễ dàng điều hướng. Đừng sáng tạo lại các mẫu điều hướng một cách không cần thiết, vì điều này sẽ dẫn đến sự nhầm lẫn và khó dự đoán.
Giúp điều hướng đủ đơn giản để hỗ trợ liền mạch các hành vi được chấp nhận rộng rãi của người dùng. Đừng phức tạp quá mức bằng cách thêm các lớp điều hướng không cần thiết.
Bộ điều khiển
Tay điều khiển có nhiều kiểu dáng, từ điều khiển từ xa tối giản đến tay điều khiển trò chơi phức tạp. Tất cả tay điều khiển đều có bàn phím di chuyển (D-pad) cùng với các nút chọn, nút màn hình chính và nút quay lại. Các nút khác sẽ khác nhau tuỳ theo kiểu máy.
D-pad
Phương thức điều hướng chính trên TV là thông qua D-pad, bao gồm các nút phần cứng định hướng lên, xuống, trái và phải. D-pad truyền tiêu điểm từ một đối tượng sang đối tượng gần nhất theo hướng nhấn nút.
Nút chọn
Chọn mục trên màn hình có tiêu điểm.
Nút Màn hình chính
Đưa người dùng đến Màn hình chính của hệ thống.
Nút Quay lại
Giúp người dùng quay lại chế độ xem trước đó.
Nút micrô
Gọi Trợ lý Google hoặc phương thức nhập bằng giọng nói.
Điều hướng bằng D-pad
Trên thiết bị TV, người dùng di chuyển bằng các phím D-pad hoặc mũi tên. Loại chế độ điều khiển này giới hạn chuyển động lên, xuống, trái và phải. Để xây dựng một ứng dụng tuyệt vời được tối ưu hoá cho TV, bạn phải cung cấp một lược đồ điều hướng mà trong đó người dùng có thể nhanh chóng tìm hiểu cách di chuyển trong ứng dụng của bạn bằng các chế độ điều khiển bị hạn chế này.
Khung Android tự động xử lý việc điều hướng theo hướng giữa các phần tử bố cục, vì vậy, bạn thường không cần làm gì thêm cho ứng dụng của mình. Tuy nhiên, bạn nên kiểm thử kỹ lưỡng tính năng điều hướng bằng bộ điều khiển D-pad để phát hiện mọi vấn đề điều hướng.
Hãy làm theo các nguyên tắc sau để kiểm thử nhằm đảm bảo rằng hệ thống điều hướng của ứng dụng hoạt động tốt với D-pad trên thiết bị TV:
- Đảm bảo rằng người dùng có bộ điều khiển D-pad có thể chuyển đến tất cả các chế độ điều khiển hiển thị trên màn hình.
- Đối với thao tác cuộn danh sách có tiêu điểm, hãy đảm bảo các nút lên và xuống của D-pad sẽ cuộn danh sách cũng như nút chọn có chọn một mục trong danh sách. Xác minh rằng người dùng có thể chọn một phần tử trong danh sách và danh sách vẫn cuộn khi chọn một phần tử.
- Đảm bảo rằng việc chuyển đổi giữa các chế độ điều khiển dễ hiểu và dễ dự đoán.
Sửa đổi điều hướng hướng
Khung Android tự động áp dụng một lược đồ điều hướng theo hướng dựa trên vị trí tương đối của các phần tử có thể làm tâm điểm trong bố cục của bạn. Kiểm thử lược đồ điều hướng đã tạo trong ứng dụng bằng bộ điều khiển D-pad. Sau khi kiểm thử, nếu quyết định muốn người dùng di chuyển qua bố cục theo một cách cụ thể, bạn có thể thiết lập tính năng điều hướng theo hướng rõ ràng cho các chế độ điều khiển.
Mã mẫu sau đây cho thấy cách xác định chế độ điều khiển tiếp theo để nhận tiêu điểm cho đối tượng bố cục TextView:
<TextView android:id="@+id/Category1" android:nextFocusDown="@+id/Category2" />
Bảng sau đây liệt kê tất cả thuộc tính điều hướng hiện có cho các tiện ích giao diện người dùng Android:
| Thuộc tính | Chức năng |
|---|---|
nextFocusDown |
Xác định khung hiển thị tiếp theo để nhận tiêu điểm khi người dùng di chuyển xuống. |
nextFocusLeft |
Xác định thành phần hiển thị tiếp theo để nhận tiêu điểm khi người dùng di chuyển sang trái. |
nextFocusRight |
Xác định thành phần hiển thị tiếp theo để nhận tiêu điểm khi người dùng di chuyển sang phải. |
nextFocusUp |
Xác định thành phần hiển thị tiếp theo để nhận tiêu điểm khi người dùng di chuyển lên. |
Để sử dụng một trong những thuộc tính điều hướng rõ ràng này, hãy đặt giá trị thành android:id của một tiện ích khác trong bố cục. Hãy nhớ thiết lập thứ tự điều hướng dưới dạng vòng lặp để chế độ điều khiển gần đây nhất chuyển tiêu điểm trở lại chế độ điều khiển đầu tiên.
Đưa ra trọng tâm và lựa chọn rõ ràng
Sự thành công của lược đồ điều hướng của ứng dụng trên thiết bị TV phụ thuộc vào việc người dùng có thể dễ dàng xác định phần tử nào trên giao diện người dùng là trọng tâm. Nếu bạn không cung cấp chỉ báo rõ ràng về mục được lấy làm tâm điểm và do đó người dùng có thể thao tác với mục nào, họ có thể nhanh chóng cảm thấy khó chịu và thoát khỏi ứng dụng của bạn. Cũng vì lý do này, điều quan trọng là phải luôn có một mục tập trung để người dùng có thể hành động ngay sau khi ứng dụng khởi động hoặc bất cứ khi nào ứng dụng không hoạt động.
Trong bố cục và quá trình triển khai ứng dụng, hãy sử dụng màu sắc, kích thước, ảnh động hoặc kết hợp các thuộc tính này để giúp người dùng dễ dàng xác định những hành động họ có thể thực hiện tiếp theo. Sử dụng một lược đồ đồng nhất để cho biết tâm điểm trên ứng dụng.
Android cung cấp tài nguyên danh sách trạng thái có thể vẽ để triển khai các điểm nổi bật cho các chế độ điều khiển có tiêu điểm và đã chọn. Ví dụ về mã sau đây minh hoạ cách bật hành vi trực quan cho một nút để cho biết rằng người dùng đã chuyển đến chế độ điều khiển rồi chọn chế độ điều khiển đó:
<!-- res/drawable/button.xml -->
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="@drawable/button_pressed" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="@drawable/button_focused" /> <!-- focused -->
<item android:state_hovered="true"
android:drawable="@drawable/button_focused" /> <!-- hovered -->
<item android:drawable="@drawable/button_normal" /> <!-- default -->
</selector>
Mã mẫu XML bố cục sau đây áp dụng đối tượng có thể vẽ trong danh sách trạng thái trước đó cho Button:
<Button
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="@drawable/button" />
Hãy đảm bảo cung cấp đủ khoảng đệm trong các thành phần điều khiển có thể làm tâm điểm và chọn được để những điểm nổi bật xung quanh chúng xuất hiện rõ ràng.
Di chuyển bằng nút quay lại
Để đảm bảo tính nhất quán giữa các ứng dụng trên nền tảng, hãy đảm bảo hành vi của nút quay lại tuân thủ các nguyên tắc này.
Dùng hành vi có thể dự đoán của nút quay lại
Để tạo ra trải nghiệm thao tác dễ dàng và dễ dự đoán, khi người dùng nhấn nút quay lại trên điều khiển từ xa, hãy đưa họ đến đích đến trước đó.
Nếu người dùng điều hướng từ một mục trong trình đơn đến một thẻ ở giữa trang rồi nhấn nút quay lại, thì kết quả phụ thuộc vào việc ứng dụng sử dụng thanh điều hướng trên cùng hay thanh điều hướng bên trái:
- Ứng dụng sử dụng thanh điều hướng trên cùng: đưa người dùng quay lại đầu trang bằng cách cuộn nhanh và kích hoạt tiêu điểm trên trình đơn.
- Ứng dụng sử dụng chức năng điều hướng bên trái: kích hoạt trình đơn bên trái và tập trung vào mục trong trình đơn đang hoạt động.
Đảm bảo rằng nút quay lại không bị màn hình xác nhận hoặc một phần của vòng lặp vô hạn kiểm soát.
Không nên.
Tránh nút thoát. Cho phép người dùng thoát khỏi ứng dụng mà không cần xác nhận.
Không nên.
Không bao giờ đi vào vòng lặp vô hạn để đóng và mở trình đơn. Tốt nhất là bạn nên nhấn nút quay lại để thoát khỏi ứng dụng. Không nên hiện nút thoát trên trình đơn trừ phi đó là một trường hợp đặc biệt, chẳng hạn như hồ sơ dành cho trẻ em.
Không hiển thị nút mũi tên lên hoặc nút quay lại
Không giống như trên các thiết bị cầm tay, nút quay lại trên điều khiển từ xa được dùng để lùi trên TV. Bạn không cần phải hiện nút quay lại ảo trên màn hình:
Không nên.
Hiện nút huỷ nếu cần
Nếu chỉ có các hành động hiển thị là hành động xác nhận, huỷ bỏ hoặc mua hàng, thì bạn nên có nút Cancel (Huỷ) để quay lại đích đến trước đó:
Nên.
Triển khai tính năng điều hướng quay lại
Khung Android thường xử lý tốt thao tác quay lại, tương tự như với D-pad. Nếu sử dụng thành phần Điều hướng, bạn có thể hỗ trợ nhiều biểu đồ điều hướng. Đôi khi, bạn có thể cần triển khai một số hành vi tuỳ chỉnh, chẳng hạn như yêu cầu nút quay lại đặt lại tiêu điểm về đầu một danh sách dài.
ComponentActivity, lớp cơ sở cho FragmentActivity và AppCompatActivity, cho phép bạn kiểm soát hành vi của nút quay lại bằng cách sử dụng OnBackPressedDispatcher mà bạn có thể truy xuất bằng cách gọi getOnBackPressedDispatcher().
Để biết thêm thông tin, hãy xem phần Cung cấp tính năng điều hướng quay lại tuỳ chỉnh.
Điều khiển chế độ phát trên TV
Phát lại video là một trong những tính năng quan trọng nhất trên TV. Điều quan trọng là các trình phát video trong các ứng dụng trên Android TV phải hoạt động như nhau. Tham khảo nguyên tắc về bộ điều khiển chế độ phát cho TV.
Di chuyển trong thẻ Trực tiếp
Ngoài việc tuân thủ các yêu cầu về chất lượng của ứng dụng dành cho TV, các ứng dụng có nguồn cấp dữ liệu truyền hình trực tuyến được tích hợp trên thẻ Trực tiếp cũng phải đáp ứng các yêu cầu về việc phát và phát lại trực tiếp mượt mà, như mô tả trong các phần sau.
Dễ dàng phát
Tính năng phát dễ dàng áp dụng cho hành vi trong ứng dụng theo mọi đường liên kết sâu Kênh Trực tiếp/Tuyến tính từ Google TV và Android TV.
Người dùng nhấp vào đường liên kết sâu của kênh Trực tiếp/Tuyến tính trên Google TV và Android TV phải được dẫn thẳng đến quá trình phát kênh mà không bị chặn hoặc làm trễ màn hình từ ứng dụng đích. Quy trình đăng nhập, quy trình đăng ký, video xây dựng thương hiệu và các độ trễ khác sẽ không được phép.
Tuy nhiên, nếu đường liên kết sâu bắt đầu quá trình tải ứng dụng mục tiêu từ một phiên khởi động nguội, thì độ trễ khởi động này trước khi phát được cho phép. Trong trường hợp này, bạn cũng được phép sử dụng một video hoặc ảnh động xây dựng thương hiệu để khởi động ứng dụng. Trải nghiệm khởi động nguội như vậy ít khi xảy ra nhiều lần mỗi phiên.
Ngoài ra, nếu quá trình chuyển đến kênh được liên kết sâu mất vài giây, thì bạn được phép hiển thị thương hiệu kênh và/hoặc dịch vụ. Tuy nhiên, thời lượng của nút này chỉ mất khi cần để tải kênh (và tương tự như thời gian tải kênh trung bình trong ứng dụng).
Nếu người dùng đã đăng xuất hoặc chưa đăng ký, bạn có thể chặn việc phát một kênh trả phí để hoàn tất quy trình đăng nhập hoặc đăng ký.
Trực tiếp
Khi người dùng chạy một ứng dụng từ một đường liên kết sâu trên thẻ Trực tiếp, sau đó nhấn nút quay lại, họ phải được đưa trở lại thẻ Trực tiếp chỉ bằng một lần nhấn nút quay lại, bất kể khoảng thời gian đã trôi qua. Hành vi quay lại trực tiếp này bắt buộc đối với tất cả đường liên kết sâu trong thẻ Trực tiếp trên Google TV và Android TV.
Các đường liên kết sâu của thẻ Trực tiếp được phân biệt bằng một tham số đường liên kết sâu được thêm vào: ?exit_on_back=[true|false]. Ứng dụng phải phân tích cú pháp tham số này để xác định xem ứng dụng có được chạy từ thẻ Trực tiếp hay không. Nếu exit_on_back là true, ứng dụng phải triển khai hành vi quay lại trực tiếp.
Xin lưu ý rằng nếu người dùng nhấn bất kỳ nút nào không phải là nút quay lại khi nhấn nút đầu tiên sau đường liên kết sâu, thì yêu cầu quay lại trực tiếp sẽ không được áp dụng và chỉ bắt buộc phải có hành vi của nút quay lại.
Ví dụ: giả sử sau khi nhấp vào một liên kết sâu, người dùng nhấn nút chọn của D-pad, thao tác này sẽ tạo ra một lớp phủ điều khiển. Người dùng chờ lớp phủ biến mất rồi nhấn vào nút quay lại. Vì nút đầu tiên được nhấn sau khi đi theo đường liên kết sâu là nút chọn D-pad, nên yêu cầu về thao tác quay lại trực tiếp không áp dụng. Thay vào đó, logic ngăn xếp lui thông thường của ứng dụng sẽ được áp dụng.
Thao tác nhấn nút quay lại nhiều lần phải đưa người dùng đến thư mục gốc của ứng dụng, sau đó quay lại Google TV hoặc Android TV mà không có bất kỳ vòng lặp vô hạn nào. Để biết thêm thông tin, hãy xem phần Hành vi của nút quay lại có thể dự đoán.
Cấu trúc điều hướng
Điểm bắt đầu cố định
Màn hình đầu tiên người dùng nhìn thấy khi chạy ứng dụng qua trình chạy cũng là màn hình cuối cùng mà người dùng nhìn thấy khi quay lại trình chạy sau khi nhấn nút quay lại.
Phương pháp liên kết sâu mô phỏng thao tác điều hướng thủ công
Cho dù là liên kết sâu hay điều hướng đến một đích đến cụ thể theo cách thủ công, người dùng đều có thể sử dụng nút quay lại để di chuyển qua các đích đến trở lại đích đến bắt đầu.
Việc liên kết sâu vào một ứng dụng từ một ứng dụng khác mô phỏng thao tác điều hướng thủ công. Ví dụ: nếu người dùng truy cập trực tiếp vào trang chi tiết trên ứng dụng Moviestar từ Google TV, sau đó nhấn nút quay lại, họ sẽ được đưa đến trang chủ của ứng dụng Moviestar.
Xoá đường dẫn đến tất cả phần tử có thể làm tâm điểm
Cho phép người dùng dễ dàng thao tác trên giao diện người dùng của bạn. Nếu không có đường dẫn rõ ràng để truy cập chế độ điều khiển, hãy cân nhắc việc chuyển vị trí điều khiển đó.
Nên làm.
Các chế độ điều khiển vị trí, chẳng hạn như thao tác tìm kiếm hiển thị ở đây, tại những vị trí không chồng chéo
với những phần tử có thể nhấp vào khác.
Không nên.
Tránh những bố cục chứa nút điều khiển ở những nơi khó tiếp cận. Bạn không dễ dàng quản lý thao tác tìm kiếm hiển thị ở đây bằng D-pad.
Trục
Thiết kế bố cục để tận dụng cả trục ngang và dọc. Cung cấp cho mỗi hướng một chức năng cụ thể, giúp bạn nhanh chóng điều hướng các hệ phân cấp lớn.
Nên làm.
Bạn có thể duyệt qua các danh mục trên trục tung và các mục trong mỗi danh mục có thể duyệt xem trên trục hoành.
Không nên.
Tránh hệ phân cấp bố cục phức tạp và lồng nhau.