Hướng ứng dụng bị hạn chế trên điện thoại nhưng không bị hạn chế trên màn hình lớn

Ứng dụng của bạn hoạt động tốt trên điện thoại ở hướng dọc, vậy nên bạn hạn chế ứng dụng chỉ ở chế độ dọc. Tuy nhiên, bạn có thể làm được nhiều việc hơn trên màn hình lớn theo hướng ngang.

Làm thế nào để bạn có thể sử dụng theo cả hai cách – nghĩa là hạn chế ứng dụng ở hướng dọc trên màn hình nhỏ, nhưng vẫn bật được hướng ngang trên màn hình lớn?

Các phương pháp hay nhất

Một ứng dụng tối ưu luôn tôn trọng các lựa chọn ưu tiên của người dùng, chẳng hạn như hướng thiết bị.

Theo nguyên tắc về chất lượng ứng dụng thích ứng, các ứng dụng sẽ hỗ trợ tất cả các cấu hình thiết bị, bao gồm cả hướng dọc và ngang, chế độ nhiều cửa sổ , cũng như các trạng thái gập và mở của thiết bị có thể gập lại. Ứng dụng phải tối ưu hoá bố cục và giao diện người dùng cho các cấu hình khác nhau, đồng thời phải lưu và khôi phục trạng thái trong quá trình thay đổi cấu hình.

Công thức này chỉ là một giải pháp tạm thời — một khoảng nhỏ hỗ trợ màn hình lớn. Sử dụng công thức này cho đến khi bạn có thể cải thiện ứng dụng của mình để cung cấp hỗ trợ đầy đủ cho tất cả các cấu hình thiết bị.

Nguyên liệu

• screenOrientation: Tuỳ chọn cài đặt tệp kê khai ứng dụng cho phép bạn chỉ định cách ứng dụng của bạn phản hồi các thay đổi về hướng trên thiết bị
• Activity#setRequestedOrientation(): Phương thức mà bạn có thể thay đổi hướng ứng dụng trong thời gian chạy
• LocalConfiguration: Nhà cung cấp cục bộ có thể kết hợp, hiển thị của thiết bị hiện tại Configuration, cho phép bạn đọc kích thước màn hình theo DP.
• LaunchedEffect: API hiệu ứng phụ của Compose chạy một khối mã khi một khoá thay đổi (trong trường hợp này, khi cấu hình thay đổi).

Các bước

Cho phép ứng dụng xử lý các thay đổi về hướng theo mặc định trong tệp kê khai ứng dụng. Sau đó, trong thời gian chạy, hãy dùng Jetpack Compose để hạn chế hướng theo cách động thành hướng dọc trên màn hình nhỏ (điện thoại) trong khi cho phép tất cả các hướng trên màn hình lớn.

1. Chỉ định tuỳ chọn cài đặt hướng trong tệp kê khai ứng dụng

Bạn có thể tránh khai báo phần tử screenOrientation của tệp kê khai ứng dụng (trong trường hợp này, hướng được đặt mặc định thành unspecified) hoặc đặt hướng màn hình thành fullUser. Nếu người dùng chưa khoá chế độ xoay dựa trên cảm biến, ứng dụng của bạn sẽ hỗ trợ tất cả các hướng của thiết bị.

<activity
    android:name=".MyActivity"
    android:screenOrientation="fullUser">

Sự khác biệt giữa việc sử dụng unspecified và fullUser là khó thấy nhưng quan trọng. Nếu bạn không khai báo một giá trị screenOrientation, thì hệ thống sẽ chọn hướng và chính sách mà hệ thống sử dụng để xác định hướng có thể khác nhau giữa các thiết bị. Mặt khác, việc chỉ định fullUser sẽ phù hợp hơn với hành vi mà người dùng đã xác định cho thiết bị: nếu người dùng đã khoá chế độ xoay dựa trên cảm biến, thì ứng dụng sẽ tuân theo lựa chọn ưu tiên của người dùng; nếu không, hệ thống sẽ cho phép sử dụng bất kỳ hướng nào trong 4 hướng màn hình có thể có (dọc, ngang, dọc lộn ngược hoặc ngang lộn ngược). Xem android:screenOrientation.

2. Hạn chế hướng theo cách động trong Compose

Trong Jetpack Compose, bạn có thể đọc kích thước màn hình hiện tại theo DP một cách phản ứng từ LocalConfiguration.current và sử dụng LaunchedEffect để cập nhật hướng của Hoạt động bất cứ khi nào cấu hình thay đổi.

Nếu chiều rộng hoặc chiều cao của màn hình nhỏ hơn 600dp (tương ứng với điểm ngắt nhỏ gọn cho điện thoại), hãy hạn chế hướng thành hướng dọc. Nếu không, hãy cho phép hệ thống xoay ứng dụng dựa trên lựa chọn ưu tiên của người dùng (unspecified hoặc fullUser).

Dưới đây là quá trình triển khai đầy đủ, có thể biên dịch:

val configuration = LocalConfiguration.current
val context = LocalActivity.current

LaunchedEffect(configuration) {
    val activity = context ?: return@LaunchedEffect
    // Determine if screen is compact (phone-sized) in either width or height
    val isCompact = configuration.screenWidthDp < 600 || configuration.screenHeightDp < 600
    activity.requestedOrientation = if (isCompact) {
        ActivityInfo.SCREEN_ORIENTATION_PORTRAIT
    } else {
        ActivityInfo.SCREEN_ORIENTATION_FULL_USER
    }
}
AdaptiveAppCookbook.kt

Bằng cách thêm logic bên trong khối LaunchedEffect(configuration), bạn có thể ghi đè chế độ cài đặt hướng một cách phản ứng bất cứ khi nào cấu hình ứng dụng thay đổi, chẳng hạn như khi hoạt động được đổi kích thước, di chuyển giữa các màn hình hiển thị hoặc khi một thiết bị có thể gập lại được gập hoặc mở ra.

Để biết thêm thông tin về thời điểm diễn ra các thay đổi về cấu hình và thời điểm các thay đổi đó dẫn đến việc tạo lại hoạt động, hãy tham khảo bài viết Xử lý các thay đổi về cấu hình.

Kết quả

Ứng dụng của bạn vẫn nằm ở hướng dọc trên màn hình nhỏ bất kể thiết bị có xoay hướng nào. Trên màn hình lớn, ứng dụng sẽ hỗ trợ cả hướng ngang lẫn hướng dọc.

Tài nguyên khác

Để được trợ giúp về cách nâng cấp ứng dụng nhằm luôn có thể hỗ trợ tất cả cấu hình thiết bị, hãy xem các mục sau:

• Hỗ trợ nhiều kích thước màn hình
• Xử lý thay đổi về cấu hình
• Lưu trạng thái giao diện người dùng