Google ใช้เทคโนโลยี AI เพื่อแปลเนื้อหาเป็นภาษาที่คุณต้องการ การแปลโดย AI อาจมีข้อผิดพลาด

การวางแนวแอปถูกจำกัดในโทรศัพท์ แต่ไม่ได้จำกัดในหน้าจอขนาดใหญ่

แอปของคุณทำงานได้ดีในโทรศัพท์ที่วางในแนวตั้ง คุณจึงจำกัดให้แอปแสดงเฉพาะในแนวตั้ง แต่คุณเห็นโอกาสที่จะทำได้มากขึ้นในหน้าจอขนาดใหญ่ที่วางในแนวนอน

คุณจะทำทั้ง 2 อย่างพร้อมกันได้อย่างไร นั่นคือจำกัดให้แอปแสดงเฉพาะในแนวตั้งบนหน้าจอขนาดเล็ก แต่เปิดใช้แนวนอนบนหน้าจอขนาดใหญ่

แนวทางปฏิบัติแนะนำ

แอปที่ดีที่สุดจะคำนึงถึงค่ากำหนดของผู้ใช้ เช่น การวางแนวอุปกรณ์

หลักเกณฑ์ด้านคุณภาพของแอปที่ปรับเปลี่ยนได้แนะนำให้แอปต่างๆ รองรับการกำหนดค่าอุปกรณ์ทั้งหมด ซึ่งรวมถึงการวางแนวแนวตั้งและแนวนอน โหมดหลายหน้าต่าง รวมถึงสถานะพับและกางออกของอุปกรณ์แบบพับได้ แอปควรเพิ่มประสิทธิภาพเลย์เอาต์และอินเทอร์เฟซผู้ใช้สำหรับการกำหนดค่าต่างๆ และควรบันทึกและกู้คืนสถานะระหว่างการเปลี่ยนแปลงการกำหนดค่า

สูตรนี้เป็นมาตรการชั่วคราว ซึ่งเป็นการรองรับหน้าจอขนาดใหญ่เพียงเล็กน้อย ใช้สูตรนี้ไปก่อนจนกว่าคุณจะปรับปรุงแอปให้รองรับการกำหนดค่าอุปกรณ์ทั้งหมดได้อย่างเต็มที่

ส่วนผสม

screenOrientation: การตั้งค่าไฟล์ Manifest ของแอปที่ช่วยให้คุณระบุวิธีที่แอปตอบสนองต่อการเปลี่ยนแปลงการวางแนวอุปกรณ์ได้
Activity#setRequestedOrientation(): เมธอดที่คุณใช้เปลี่ยนการวางแนวแอปได้ในขณะรันไทม์
LocalConfiguration: ผู้ให้บริการในเครื่องที่สร้างได้ซึ่งแสดง Configurationปัจจุบันของอุปกรณ์ ทำให้คุณอ่านขนาดหน้าจอเป็น DP ได้
LaunchedEffect: API ของ Compose Side-Effect ที่เรียกใช้บล็อกโค้ดเมื่อมีการเปลี่ยนแปลงคีย์ (ในกรณีนี้คือเมื่อมีการเปลี่ยนแปลงการกำหนดค่า)

ขั้นตอน

เปิดใช้แอปให้จัดการการเปลี่ยนแปลงการวางแนวโดยค่าเริ่มต้นในไฟล์ Manifest ของแอป จากนั้นในขณะรันไทม์ ให้ใช้ Jetpack Compose เพื่อจำกัดการวางแนวเป็นแนวตั้งแบบไดนามิกในหน้าจอขนาดกะทัดรัด (โทรศัพท์) ขณะเดียวกันก็อนุญาตการวางแนวทั้งหมดในหน้าจอขนาดใหญ่

1. ระบุการตั้งค่าการวางแนวในไฟล์ Manifest ของแอป

คุณสามารถหลีกเลี่ยงการประกาศองค์ประกอบ screenOrientation ของไฟล์ Manifest ของแอป (ในกรณีนี้ การวางแนวจะเป็น unspecified โดยค่าเริ่มต้น) หรือตั้งค่าการวางแนวหน้าจอ เป็น fullUser หากผู้ใช้ไม่ได้ล็อกการหมุนตามเซ็นเซอร์ แอปของคุณจะรองรับการวางแนวอุปกรณ์ทั้งหมด

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

ความแตกต่างระหว่างการใช้ unspecified กับ fullUser นั้นเล็กน้อยแต่สำคัญ หากคุณไม่ได้ประกาศค่า screenOrientation ระบบจะเลือกการวางแนว และนโยบายที่ระบบใช้กำหนดการวางแนวอาจแตกต่างกันไปในแต่ละอุปกรณ์ ในทางกลับกัน การระบุ fullUser จะตรงกับลักษณะการทำงานที่ผู้ใช้กำหนดไว้สำหรับอุปกรณ์มากขึ้น กล่าวคือ หากผู้ใช้ล็อกการหมุนตามเซ็นเซอร์ แอปจะทำตามค่ากำหนดของผู้ใช้ ไม่เช่นนั้นระบบจะอนุญาตการวางแนวหน้าจอที่เป็นไปได้ทั้ง 4 แบบ (แนวตั้ง แนวนอน แนวตั้งกลับด้าน หรือแนวนอนกลับด้าน) ดู android:screenOrientation

2. จำกัดการวางแนวแบบไดนามิกใน Compose

ใน Jetpack Compose คุณสามารถอ่านขนาดหน้าจอปัจจุบันเป็น DP แบบรีแอกทีฟจาก LocalConfiguration.current และใช้ LaunchedEffect เพื่ออัปเดตการวางแนวของ Activity ทุกครั้งที่การกำหนดค่ามีการเปลี่ยนแปลง

หากความกว้างหรือความสูงของหน้าจอมีค่าน้อยกว่า 600dp (ซึ่งสอดคล้องกับเบรกพอยต์ขนาดกะทัดรัดสำหรับโทรศัพท์) ให้จำกัดการวางแนวเป็นแนวตั้ง ไม่เช่นนั้น ให้ระบบหมุนแอปตามค่ากำหนดของผู้ใช้ (unspecified หรือ fullUser)

นี่คือการใช้งานที่สมบูรณ์และคอมไพล์ได้

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

การเพิ่มตรรกะภายในบล็อก LaunchedEffect(configuration) จะช่วยให้คุณลบล้างการตั้งค่าการวางแนวแบบรีแอกทีฟได้ทุกครั้งที่การกำหนดค่าแอปมีการเปลี่ยนแปลง เช่น เมื่อมีการปรับขนาดกิจกรรม ย้ายกิจกรรมระหว่างจอแสดงผล หรือเมื่อมีการพับหรือกางอุปกรณ์แบบพับได้

ดูข้อมูลเพิ่มเติมเกี่ยวกับเวลาที่การกำหนดค่ามีการเปลี่ยนแปลงและเวลาที่การเปลี่ยนแปลงดังกล่าวทำให้เกิด การสร้างกิจกรรมขึ้นใหม่ได้ที่หัวข้อจัดการการเปลี่ยนแปลงการกำหนดค่า

ผลลัพธ์

ตอนนี้แอปของคุณควรแสดงเฉพาะในแนวตั้งบนหน้าจอขนาดเล็ก ไม่ว่าอุปกรณ์จะหมุนหรือไม่ก็ตาม ส่วนในหน้าจอขนาดใหญ่ แอปควรรองรับการวางแนวทั้งแนวนอนและแนวตั้ง

แหล่งข้อมูลเพิ่มเติม

ดูวิธีอัปเกรดแอปให้รองรับการกำหนดค่าอุปกรณ์ทั้งหมดได้ตลอดเวลาที่หัวข้อต่อไปนี้