แอปที่ปรับขนาดได้รองรับการแสดงผลทุกขนาด ได้แก่ หน้าจอทั้งหน้าจอของอุปกรณ์ หน้าต่างที่ปรับขนาดได้โหมดหลายหน้าต่าง แนวตั้งและแนวนอน การแสดงผลแบบพับและไม่พับของอุปกรณ์แบบพับได้
รายการการตั้งค่าการกําหนดค่าและ API สั้นๆ ที่ช่วยให้คุณสร้างแอปที่ปรับเปลี่ยนได้ แต่การตั้งค่าและ API บางรายการที่ล้าสมัยจะใช้ร่วมกับแอปที่ปรับเปลี่ยนไม่ได้และต้องหลีกเลี่ยง
ปรับขนาดได้
แอปที่ปรับขนาดได้รองรับการปรับขนาดแอปและโหมดหลายหน้าต่าง
แอตทริบิวต์ resizeableActivity
ขององค์ประกอบไฟล์ Manifest <activity>
และ <application>
จะเปิดหรือปิดใช้โหมดหลายหน้าต่างใน Android 11 (API ระดับ 30) และต่ำกว่า ใน Android 12 (API ระดับ 31) ขึ้นไป หน้าจอขนาดใหญ่จะรองรับโหมดหลายหน้าต่าง ไม่ว่าแอตทริบิวต์จะเป็นแบบใดก็ตาม ดูข้อมูลเพิ่มเติมได้ที่รองรับโหมดหลายหน้าต่าง
เปิดใช้แอปให้เข้าร่วมในสถานการณ์การทำงานแบบหลายหน้าต่างและการทำงานหลายอย่างพร้อมกันเพื่อเพิ่มประสิทธิภาพและความพึงพอใจของผู้ใช้
ตั้งค่าเป็น resizeableActivity="true"
หากแอปกำหนดเป้าหมายเป็น API ระดับต่ำกว่า 24 หรือไม่ต้องตั้งค่าเลยเพราะค่าเริ่มต้นใน Android 7.0 (API ระดับ 24) ขึ้นไปคือ true
อย่าตั้งค่า resizeableActivity="false"
สำหรับระดับ API ใดๆ อย่ายกเว้นแอปของคุณจาก Use Case ที่เกี่ยวข้องกับโหมดหลายหน้าต่าง
การวางแนว
แอปที่ปรับเปลี่ยนได้รองรับการวางแนวตั้งและแนวนอน ไม่ว่าจะมีขนาดการแสดงผลหรือโหมดการแสดงผลแบบใดก็ตาม
การตั้งค่าไฟล์ Manifest screenOrientation
จะจํากัดการวางแนวกิจกรรม
นำการตั้งค่า screenOrientation
ออกจากไฟล์ Manifest ของแอป
การล็อกการวางแนวของแอปจะไม่ป้องกันการเปลี่ยนแปลงขนาดหน้าต่าง ระบบจะปรับขนาดแอปเมื่อเข้าสู่โหมดหลายหน้าต่าง เมื่อพับหรือกางอุปกรณ์ หรือเมื่อปรับขนาดหน้าต่างประเภทเดสก์ท็อป แอปของคุณต้องรองรับการเปลี่ยนแปลงขนาดหน้าต่าง ไม่ว่าจะตั้งค่าแอตทริบิวต์ screenOrientation
ไว้อย่างไรก็ตาม
อย่าจํากัดการวางแนวกิจกรรม แอปที่ล็อกการวางแนวจะมีแถบดำด้านบนและด้านล่างในอุปกรณ์หน้าจอขนาดใหญ่และขนาดหน้าต่างที่เข้ากันไม่ได้
แอปที่มีแถบดำด้านบนและด้านล่างจะลดโอกาสในการค้นพบใน Google Play สำหรับแท็บเล็ต อุปกรณ์แบบพับ และอุปกรณ์ ChromeOS
สัดส่วนภาพ
เนื่องจากขนาดหน้าจอและหน้าต่างแตกต่างกันไป สัดส่วนภาพจึงแตกต่างกันไป ตั้งแต่สูงและแคบไปจนถึงสี่เหลี่ยมจัตุรัส สั้นและกว้าง
การตั้งค่าไฟล์ Manifest minAspectRatio
และ maxAspectRatio
จะจำกัดสัดส่วนภาพของแอปเป็นค่าที่กำหนดไว้ล่วงหน้า
ปรับแอปให้พอดีกับการแสดงผลโดยไม่คำนึงถึงมิติข้อมูลที่เกี่ยวข้อง
นำการตั้งค่า minAspectRatio
และ maxAspectRatio
ออกจากไฟล์ Manifest ของแอป หรือตรวจสอบว่าแอปปรับขนาดได้และสัดส่วนการแสดงผลจะปรับให้เอง (ดูส่วนการปรับขนาดได้)
อย่าพยายามควบคุมขนาดสัมพัทธ์ของแอป หากแอปทำงานบนหน้าจอหรือในหน้าต่างที่มีสัดส่วนการแสดงผลที่เข้ากันไม่ได้กับสัดส่วนการแสดงผลของแอป แอปจะมีแถบดำด้านบนและด้านล่าง
ใน Android 14 (API ระดับ 34) ขึ้นไป ผู้ใช้สามารถลบล้างอัตราส่วนการแสดงผลของแอปเพื่อขยายแอปที่มีแถบดำด้านบนและด้านล่างให้เต็มพื้นที่แสดงผลที่มีอยู่ ดูโหมดความเข้ากันได้ของอุปกรณ์
ขนาดหน้าต่าง
การเพิ่มประสิทธิภาพเลย์เอาต์สำหรับขนาดการแสดงผลที่แตกต่างกันเป็นพื้นฐานสำคัญของการออกแบบที่ปรับเปลี่ยนตามอุปกรณ์ แอปที่ปรับขนาดได้จะมุ่งเน้นที่ขนาดหน้าต่างแอปมากกว่าขนาดหน้าจอของอุปกรณ์ เมื่อแอปแสดงแบบเต็มหน้าจอ หน้าต่างแอปจะเป็นหน้าจอของอุปกรณ์
คลาสขนาดหน้าต่างเป็นวิธีที่มีระบบในการกำหนดและจัดหมวดหมู่ขนาดของหน้าต่างแอป ปรับแอปโดยเปลี่ยนเลย์เอาต์เมื่อคลาสขนาดหน้าต่างของแอปมีการเปลี่ยนแปลง
ประเมินขนาดหน้าต่างของแอปตามคลาสขนาดหน้าต่าง
หากต้องการระบุคลาสขนาดหน้าต่าง ให้ใช้ฟังก์ชันระดับบนสุด currentWindowAdaptiveInfo()
ของไลบรารี Compose Material 3 Adaptive ดูข้อมูลเพิ่มเติมได้ที่สร้างแอปที่ปรับเปลี่ยนได้
อย่ามองข้ามประโยชน์ของคําจํากัดความของคลาสขนาดหน้าต่างและ API ในตัว อย่าใช้ API ที่เลิกใช้งานเพื่อคํานวณขนาดกรอบเวลา
API ที่เลิกใช้งานแล้ว
API ของแพลตฟอร์มรุ่นเก่าวัดขนาดหน้าต่างแอปไม่ถูกต้อง บางรายการวัดหน้าจออุปกรณ์ บางรายการไม่รวมการตกแต่งระบบ
ใช้ WindowManager#getCurrentWindowMetrics()
และ
WindowMetrics#getBounds()
เพื่อรับขนาดของหน้าต่างแอป ใช้ WindowMetrics#getDensity()
เพื่อดูความหนาแน่นของการแสดงผล
อย่าใช้ Display
API ที่เลิกใช้งานต่อไปนี้เพื่อกําหนดขนาดกรอบเวลา
getSize()
: เลิกใช้งานแล้วใน Android 11 (API ระดับ 30)getMetrics()
: เลิกใช้งานแล้วใน Android 11 (API ระดับ 30)getRealSize()
: เลิกใช้งานใน Android 12 (API ระดับ 31)getRealMetrics()
: เลิกใช้งานใน Android 12 (API ระดับ 31)
เขียน
Jetpack Compose ออกแบบมาเพื่อการพัฒนา UI แบบปรับเปลี่ยนได้ ไม่มี XML, ไม่มีไฟล์เลย์เอาต์, ไม่มีตัวระบุทรัพยากร คอมโพสิเบิลแบบไม่มีสถานะที่ทำงานบน Kotlin เท่านั้น เช่น Column
, Row
และ Box
ที่อธิบาย UI และตัวแก้ไข เช่น offset
, padding
และ size
ที่เพิ่มลักษณะการทำงานให้กับองค์ประกอบ UI
สร้างด้วย Compose ติดตามฟีเจอร์และรุ่นล่าสุด
อย่าใช้เทคโนโลยีที่ล้าสมัย อย่าปล่อยให้แอปล้าสมัย
เขียนไลบรารี Adaptive ของ Material 3
ไลบรารี Compose Material 3 Adaptive มีคอมโพเนนต์และ API ที่อำนวยความสะดวกในการพัฒนาแอปที่ปรับเปลี่ยนได้
ใช้ API ต่อไปนี้เพื่อทำให้แอปปรับเปลี่ยนได้
NavigationSuiteScaffold
: สลับระหว่างแถบนำทางกับแถบข้างสำหรับไปยังส่วนต่างๆ โดยขึ้นอยู่กับคลาสขนาดหน้าต่างของแอปListDetailPaneScaffold
: ใช้เลย์เอาต์ Canonical ของรายการแบบละเอียด ปรับเลย์เอาต์ให้เหมาะกับขนาดหน้าต่างแอปSupportingPaneScaffold
: ใช้เลย์เอาต์ Canonical ของแผงสนับสนุน
อย่าทำอะไรซ้ำๆ อย่าพลาดโอกาสที่จะได้เพิ่มประสิทธิภาพการทำงานสำหรับนักพัฒนาแอปจากคลัง Jetpack Compose ทั้งหมด
เลย์เอาต์
ผู้ใช้คาดหวังว่าแอปจะใช้พื้นที่ในการแสดงผลที่มีอยู่ให้เกิดประโยชน์สูงสุดด้วยเนื้อหาเสริมหรือการควบคุมที่มีประสิทธิภาพมากขึ้น
แอปที่ปรับเปลี่ยนได้จะเพิ่มประสิทธิภาพเลย์เอาต์ตามการเปลี่ยนแปลงในการแสดงผล โดยเฉพาะการเปลี่ยนแปลงขนาดของหน้าต่างแอปหรือการเปลี่ยนแปลงการวางแนวของอุปกรณ์
เปลี่ยนคอมโพเนนต์ UI เมื่อขนาดหน้าต่างเปลี่ยนแปลงเพื่อใช้ประโยชน์จากพื้นที่แสดงผลที่มีอยู่ เช่น เปลี่ยนแถบนำทางด้านล่างที่ใช้กับขนาดหน้าต่างแบบกะทัดรัดเป็นแถบนำทางแนวตั้งในหน้าต่างขนาดกลางและแบบขยาย ปรับตำแหน่งกล่องโต้ตอบเพื่อให้เข้าถึงได้บนจอแสดงผลทั้งหมด
จัดระเบียบเนื้อหาเป็นแผงเพื่อใช้เลย์เอาต์หลายแผง เช่น แผงรายละเอียดรายการและแผงสนับสนุนสำหรับการแสดงเนื้อหาแบบไดนามิก
หากคุณไม่ได้ใช้แผงเนื้อหา อย่าเพิ่งยืดองค์ประกอบ UI ให้เต็มพื้นที่แสดงผล ข้อความบรรทัดยาวอ่านยาก ปุ่มที่ยืดออกดูออกแบบมาไม่ดี หากคุณใช้ Modifier.fillMaxWidth
อย่าคิดว่าลักษณะการทำงานนั้นเหมาะกับขนาดการแสดงผลทุกขนาด
อุปกรณ์อินพุต
ผู้ใช้ไม่ได้ใช้แค่หน้าจอสัมผัสเพื่อโต้ตอบกับแอป
แอปที่ปรับเปลี่ยนได้รองรับแป้นพิมพ์ เมาส์ และสไตลัสภายนอกเพื่อให้ประสบการณ์การใช้งานที่ดีขึ้นและช่วยให้ผู้ใช้ทำงานได้อย่างมีประสิทธิภาพมากขึ้นในรูปแบบต่างๆ
ใช้ประโยชน์จากฟังก์ชันการทำงานในตัวของเฟรมเวิร์ก Android สำหรับการไปยังส่วนต่างๆ ของแป้นพิมพ์ การคลิก เลือก และเลื่อนของเมาส์หรือแทร็กแพด เผยแพร่แป้นพิมพ์ลัดของแอปในเครื่องมือช่วยเหลือแป้นพิมพ์ลัด
ใช้ Material 3 Library ของ Jetpack เพื่อให้ผู้ใช้เขียนลงในคอมโพเนนต์ TextField
ใดก็ได้โดยใช้สไตลัส
อย่าทำให้วิธีการป้อนข้อมูลอื่นใช้งานไม่ได้ ไม่ทำให้เกิดปัญหาการช่วยเหลือพิเศษ
สรุป
- สร้างแอปด้วย Compose และไลบรารี Material 3 Adaptive
- เลย์เอาต์ตามคลาสขนาดหน้าต่าง
- สร้างเลย์เอาต์แบบหลายแผง
- ทำให้แอปปรับขนาดได้
- ไม่ล็อกการวางแนวกิจกรรม
- ไม่จำกัดสัดส่วนภาพ
- รองรับการป้อนข้อมูลนอกเหนือจากการสัมผัส
- หลีกเลี่ยง API ที่เลิกใช้งานแล้ว
✓ ทำในสิ่งที่ผู้ใช้คาดหวัง โดยเพิ่มประสิทธิภาพแอปให้เหมาะกับอุปกรณ์ที่หลากหลายที่ผู้ใช้ใช้งานทุกวัน
✗ อย่ารอ เริ่มต้นใช้งานเลยวันนี้