Làm quen với màn hình lớn

Màn hình lớn giúp tăng thêm trải nghiệm người dùng. Màn hình lớn của máy tính bảng, thiết bị gập, và thiết bị Chrome OS làm nổi bật nội dung, hỗ trợ nhiều thao tác đồng thời mang lại trải nghiệm giao diện mà người dùng không có được trên thiết bị màn hình nhỏ.

Để bắt đầu với quy trình phát triển màn hình lớn, hãy làm theo nguyên tắc về chất lượng đối với ứng dụng màn hình lớn. Hướng dẫn này là một bộ các yêu cầu toàn diện được thiết kế để giúp ứng dụng của bạn hoạt động tốt nhất có thể trên màn hình lớn.

Các nguyên tắc về chất lượng được sắp xếp theo ba bậc: Màn hình lớn đã sẵn sàng, Đã tối ưu hóa màn hình lớn và Đã tách biệt màn hình lớn. Thêm các chức năng màn hình lớn vào ứng dụng của bạn bằng cách làm việc theo từng cấp độ, bắt đầu từ chế độ Màn hình lớn đã sẵn sàng. Nếu bạn hiện có một ứng dụng, hãy dùng các tình huống thử nghiệm để xác định cấp độ mà ứng dụng hiện được hỗ trợ. Sau đó, vui lòng triển khai các tính năng theo bậc cho đến khi ứng dụng của bạn được phân biệt riêng cho màn hình lớn.

Màn hình lớn đã sẵn sàng.

Ứng dụng của bạn đã sẵn sàng với màn hình lớn để người dùng có thể truy cập vào tất cả các chức năng trên một thiết bị màn hình lớn. Ứng dụng hỗ trợ hướng dọc và ngang cũng như chế độ nhiều cửa sổ, nhưng bố cục ứng dụng và giao diện người dùng có thể ít hơn chế độ tối ưu hóa.

Thay đổi cấu hình và tính liên tục

Các thay đổi về cấu hình như xoay thiết bị, thay đổi kích thước cửa sổ trong chế độ nhiều cửa sổ và việc đóng hoặc mở thiết bị gập có thể khiến người dùng mất ngữ cảnh hiển thị — hoặc thậm chí là dữ liệu.

Đảm bảo ứng dụng của bạn giữ lại hoặc khôi phục trạng thái trong quá trình thay đổi cấu hình và tiếp tục các tác vụ đang diễn ra, chẳng hạn như phát lại phương tiện.

Để biết thêm thông tin chi tiết, vui lòng xem hướng dẫn dành cho nhà phát triển sau đây:

Chế độ nhiều cửa sổ

Màn hình lớn giúp chế độ nhiều cửa sổ trở nên hữu dụng và hiệu quả hơn. Cho phép ứng dụng của bạn chạy ở chế độ nhiều cửa sổ cùng với các ứng dụng khác ở chế độ chia đôi màn hình hoặc chế độ biểu mẫu tùy ý.

Khi ứng dụng của bạn ở chế độ nhiều cửa sổ, hãy sử dụng API WindowMetrics để xác định chính xác kích thước của cửa sổ ứng dụng.

Hãy xem phần Hỗ trợ nhiều cửa sổ.

Tiếp tục nhiều lần (multi-resume)

Kể từ Android 10 (API cấp 29), khi một thiết bị ở chế độ nhiều cửa sổ, các hoạt động không tập trung vẫn ở trạng thái RESUMED. (Trước Android 10, các hoạt động không tập trung vẫn ở trạng thái STARTED, nhưng không RESUMED.)

Đảm bảo ứng dụng hỗ trợ chế độ tiếp tục nhiều lần bằng cách liên tục duy trì các quy trình đang diễn ra, chẳng hạn như phát lại phương tiện hoặc tải tệp xuống khi ứng dụng không còn là tiêu điểm. Ứng dụng cũng phải xử lý việc bị loại bỏ các tài nguyên độc quyền như máy ảnh và micrô của thiết bị.

Vui lòng xem nội dung Vòng đời chế độ nhiều cửa sổ trong phần Hỗ trợ chế độ nhiều cửa sổ.

Bản xem trước của máy ảnh

Nếu ứng dụng của bạn có bản xem trước của máy ảnh, hãy kiểm tra bản xem trước để biết hướng và tỷ lệ khung hình trên màn hình lớn. Màn hình gập lớn theo hướng dọc có thể có tỷ lệ khung hình dạng ngang. Chế độ nhiều cửa sổ có thể hiển thị các ứng dụng theo hướng dọc trong một cửa sổ có khả năng đổi kích thước khi thiết bị nằm ngang.

Xem các mục sau đây:

Chiếu nội dung nghe nhìn

Một phép chiếu nội dung nghe nhìn tạo ra một màn hình ảo dựa trên ranh giới của màn hình (gốc) thực tế. Màn hình thực tế là toàn bộ màn hình thiết bị, ngay cả khi thiết bị ở chế độ nhiều cửa sổ và ứng dụng tạo phép chiếu nội dung nghe nhìn đang chạy trong cửa sổ.

Để có được ranh giới chính xác cho phép chiếu nội dung nghe nhìn trên màn hình lớn, hãy sử dụng API WindowMetrics được giới thiệu trong Android 11 (API cấp 30), hoặc để tương thích xuống đến API cấp 14, API Jetpack WindowsManager WindowMetrics.

Xem Phép chiếu nội dung nghe nhìn trên màn hình lớn.

Hỗ trợ cơ bản cho các thiết bị đầu vào bên ngoài

Người dùng thường kết nối bàn phím ngoài hoặc chuột với máy tính bảng. Chromebook tích hợp sẵn bàn phím và bàn di chuột. Hỗ trợ các thiết bị đầu vào bên ngoài bằng cách cho phép ứng dụng của bạn xử lý các thao tác bàn phím, chuột và bàn di chuột, chẳng hạn như:

  • Nút nhấp vào, trường nhập dữ liệu và biểu tượng điều hướng
  • Chọn các mục trong trình đơn, nút chọn, hộp đánh dấu và văn bản
  • Cuộn theo chiều dọc và chiều ngang trong các phần tử có thể cuộn được như danh sách

Vui lòng xem nội dung Khả năng tương thích đầu vào trên màn hình lớn.

Đã tối ưu hóa màn hình lớn

Trải nghiệm người dùng sẽ sống động, hiệu quả và hấp dẫn khi ứng dụng của bạn được tối ưu hóa cho màn hình lớn— người dùng sẽ thích ứng dụng của bạn trên các thiết bị màn hình lớn.

Bố cục thích ứng/thích ứng

Để hỗ trợ cho cả màn hình lớn và nhỏ, hãy thiết kế bố cục đáp ứng/thích ứng nhằm cung cấp trải nghiệm người dùng tối ưu trên tất cả các loại thiết bị.

Hãy bắt đầu bằng cách tự làm quen với các nội dung sau:

Các lớp kích thước cửa sổ

Lớp kích thước cửa sổ là một tập hợp các điểm ngắt khung nhìn được cố định giúp bạn triển khai thiết kế đáp ứng/thích ứng. Hãy sử dụng các lớp kích thước cửa sổ để phân loại khu vực hiển thị có sẵn cho ứng dụng như nhỏ gọn, trung bình hoặc mở rộng, sau đó áp dụng bố cục được tối ưu hóa.

Vui lòng xem nội dung Các loại kích thước cửa sổ trong phần Hỗ trợ nhiều kích thước màn hình.

Điều hướng trong ứng dụng thích ứng

Trên các màn hình nhỏ, thanh điều hướng dưới cùng hoạt động khá ổn, nhưng ở màn hình lớn, dải điều hướng hoặc ngăn điều hướng được tận dụng tốt hơn với không gian màn hình rộng hơn. Điều chỉnh cách điều hướng trong ứng dụng theo những thay đổi kích thước màn hình.

Vui lòng xem nội dung Điều chỉnh thành phần trong phần Bố cục màn hình lớn.

Thành phần giao diện người dùng thích ứng

Định dạng các thành phần trên giao diện người dùng dựa vào kích thước màn hình. Giới hạn chiều rộng của các nút, thẻ và trường văn bản có chiều rộng đầy đủ trên màn hình nhỏ đến kích thước phù hợp về mặt chức năng trên màn hình lớn. Vui lòng tránh để hộp thoại và các cửa sổ phụ khác lấp đầy toàn bộ màn hình. Xác định vị trí của các trình đơn theo bối cảnh và cửa sổ bật lên khác liên quan đến phần tử bên cạnh thành phần mà người dùng đã chọn, không được căn giữa trên màn hình.

Vui lòng xem Thành phần trong Material Design, bao gồm các Nút, Trường văn bản, Trình đơnHộp thoại.

Hỗ trợ tiếp cận

Tối ưu hóa ứng dụng của bạn để hỗ trợ tiếp cận các tính năng (a11y) như Tab và phím điều hướng bằng mũi tên. Cung cấp phím tắt cho các thao tác thường dùng như chọn, sao chép, cắt và dán. Bật bàn phím điều khiển việc phát nội dung nghe nhìn; ví dụ: bật thanh dấu cách để phát và tạm dừng nội dung nghe nhìn hoặc phím Enter để gửi tin nhắn trong các ứng dụng giao tiếp.

Xem phần Xây dựng một ứng dụng dễ tiếp cận hơn.

Hỗ trợ nâng cao cho các thiết bị đầu vào bên ngoài

Các ứng dụng được tối ưu hóa trên màn hình lớn cung cấp hỗ trợ nâng cao cho đầu vào bàn phím, chuột và bàn di chuột. Các trình đơn tùy chọn có thể truy cập được bằng hành vi nhấp chuột phải của chuột và bàn di chuột. Bạn có thể thu phóng nội dung ứng dụng bằng con lăn chuột và cử chỉ chụm bàn di chuột. Thành phần trên giao diện người dùng có các trạng thái di chuột.

Đã tách biệt màn hình lớn

Các ứng dụng khác biệt trên màn hình lớn nổi bật hơn so với các cửa hàng ứng dụng khác. Các ứng dụng khác biệt mang lại trải nghiệm mà người dùng không thể có được trên màn hình nhỏ.

Sự khác biệt tùy thuộc vào ứng dụng. Triển khai các yêu cầu phù hợp với ứng dụng của bạn.

Đa nhiệm

Màn hình lớn dễ dàng hơn cho việc xử lý hoạt động đa nhiệm. Chế độ nhiều cửa sổ cho phép bạn làm nhiều việc cùng lúc, nhưng các chế độ hiển thị đặc biệt cũng có thể là chế độ hình trong hình và nhiều chế độ.

Chế độ Hình trong hình

Nếu ứng dụng đang phát nội dung video, hãy triển khai chế độ hình trong hình để video tiếp tục được phát khi người dùng đang tương tác với một ứng dụng khác.

Vui lòng xem nội dung phần Hỗ trợ chế độ hình trong hình (PiP).

Chế độ nhiều phiên bản

Tăng hiệu suất trong các ứng dụng như trình chỉnh sửa tài liệu hoặc trình quản lý nội dung bằng cách cho phép hai hoặc nhiều phiên bản ứng dụng chạy cùng lúc.

Vui lòng xem nội dung Nhiều phiên bản trong phần Hỗ trợ nhiều cửa sổ.

Thiết bị có thể gập lại

Có thể nói các thiết bị gập có màn hình lớn là sự kết hợp giữa một chiếc điện thoại và một máy tính bảng. Các tính năng gấp chẳng hạn như chế độ trên mặt bàn (gập theo chiều ngang) và chế độ sách (gập theo chiều dọc) mang đến cho người dùng những trải nghiệm mới mẻ. Tạo sự khác biệt cho ứng dụng bằng cách hỗ trợ các tính năng độc đáo của thiết bị gập.

Xem các mục sau đây:

Kéo và thả

Màn hình lớn rất phù hợp để tương tác kéo và thả – trong một ứng dụng hoặc trên Android 7.0 (API cấp 24) trở lên, giữa các ứng dụng ở chế độ nhiều cửa sổ.

Tăng hiệu suất và mức độ tương tác của người dùng bằng cách thêm các tính năng kéo và thả vào ứng dụng của bạn.

Vui lòng xem nội dung phần Kéo và thả.

Hỗ trợ riêng biệt cho các thiết bị đầu vào bên ngoài

Cung cấp dịch vụ hỗ trợ giống máy tính cho các thiết bị đầu vào bên ngoài. Tạo một bộ các phím tắt có thể tùy chỉnh một cách toàn diện. Bật các tổ hợp bàn phím và chuột hoặc bàn phím và bàn di chuột, chẳng hạn như Ctrl+nhấp, Shift+click và Ctrl+nhấn, Shift+nhấn để cung cấp các chức năng mở rộng.

Hiện thanh cuộn trong khi nội dung đang được cuộn bằng chuột hoặc bàn di chuột. Hiển thị các thành phần nội dung bị ẩn như trình đơn fly-out hoặc chú giải công cụ trên chuột hoặc bàn di chuột. Bao gồm các trình đơn kiểu màn hình và trình đơn theo bối cảnh. Giúp bạn thay đổi kích thước bảng điều khiển giao diện người dùng bằng chuột hoặc bàn di chuột. Dùng tính năng nhấp chuột nhiều lần bằng chuột, nhiều lần nhấn bằng bàn di chuột.

Bút cảm ứng

Các ứng dụng cao cấp hỗ trợ các thiết bị màn hình lớn được trang bị bút cảm ứng. Có thể dùng bút cảm ứng để điều khiển các thành phần trên giao diện người dùng, chẳng hạn như vẽ, ghi, xóa, kéo và thả, đại loại là tất cả các tương tác chạm và cử chỉ.

Hỗ trợ bút cảm ứng nâng cao bao gồm độ nhạy áp lực, tính năng phát hiện độ nghiêng và từ chối lòng bàn tay lẫn ngón tay (theo đó, thao tác chạm sẽ không được đăng ký).

Mang lại trải nghiệm người dùng đặc biệt trên các thiết bị cao cấp bằng cách hỗ trợ đầy đủ tính năng nhập bằng bút cảm ứng.

Vui lòng xem phần Bút cảm ứng trong phần Khả năng tương thích đầu vào trên màn hình lớn.

Bước tiếp theo

Xem tài nguyên được trích dẫn trong các phần ở trên để biết các tính năng áp dụng cho ứng dụng của bạn. Sau đó, hãy tham khảo nguyên tắc về chất lượng đối với ứng dụng trên màn hình lớn và bắt đầu xây dựng ứng dụng của bạn để màn hình lớn được sẵn sàng, tối ưu hóa và khác biệt.

Tài nguyên khác