การออกแบบพับได้: ท่าทาง ขนาดหน้าต่าง และท่าทาง
วิธีการออกแบบแอปสำหรับโทรศัพท์แบบพับได้: เค้าโครงแบบพับและกางออก ท่าทางบนโต๊ะและหนังสือ คลาสขนาดหน้าต่าง ความต่อเนื่องและท่าทางใกล้พับ
หลัก Takeaway
ออกแบบเค้าโครงแบบพับได้ตามขนาดหน้าต่างที่มีอยู่ ไม่ใช่รุ่นอุปกรณ์: คลาสขนาดหน้าต่างของ Android ถือว่าความกว้างที่ต่ำกว่า 600dp เป็นขนาดกะทัดรัด 600 ถึง 840dp เป็นขนาดกลาง และ 840 ถึง 1200dp เมื่อขยาย รองรับท่าทางพับ เปิด และครึ่งเปิด (บนโต๊ะ) รักษาตำแหน่งของผู้ใช้เมื่ออุปกรณ์พับหรือกางออก และเก็บเนื้อหาหลักและเป้าหมายการสัมผัสให้ห่างจากพับ
ท่า
เอกสารประกอบสำหรับนักพัฒนาของ Android อธิบายพับได้ในอิริยาบถต่างๆ: พับ, เปิดราบ, เปิดราบ, หมุนเป็นแนวนอน และเปิดครึ่งหนึ่ง เรียกว่าบนโต๊ะ การพับแบ่งหน้าจอออกเป็นสองส่วน ไม่ว่าจะเป็นพื้นที่ยืดหยุ่นของหน้าจอเดียวหรือเป็นบานพับระหว่างจอแสดงผลสองจอ และอาจบดบังส่วนหนึ่งของจอแสดงผลได้
ออกแบบตามคลาสขนาดหน้าต่าง
แทนที่จะกำหนดเป้าหมายไปที่อุปกรณ์เฉพาะ Android จะจัดกลุ่มพื้นที่ว่างเป็นคลาสขนาดหน้าต่าง ความกว้างกะทัดรัด (ต่ำกว่า 600dp) ครอบคลุมโทรศัพท์เกือบทั้งหมดในแนวตั้ง ความกว้างปานกลาง (600 ถึง 840dp) ครอบคลุมแท็บเล็ตส่วนใหญ่ในแนวตั้ง และจอแสดงผลด้านในขนาดใหญ่ที่กางออกในแนวตั้ง ความกว้างที่ขยาย (840 ถึง 1200dp) ครอบคลุมแท็บเล็ตส่วนใหญ่และจอแสดงผลขนาดใหญ่ที่กางออกในแนวนอน ชั้นเรียนขนาดใหญ่และขนาดใหญ่พิเศษครอบคลุมแท็บเล็ตและเดสก์ท็อปที่ใหญ่กว่า
เค้าโครงที่ใช้การพับ
รูปแบบทั่วไป:
- พับ: เค้าโครงโทรศัพท์ปกติ
- เปิดแบบเรียบ: เค้าโครงแบบรายละเอียดรายการหรือแบบสองบานหน้าต่าง โดยแต่ละบานหน้าต่างจะอยู่ที่ด้านหนึ่งของพับ
- บนโต๊ะ: เนื้อหา เช่น วิดีโอในครึ่งบน การควบคุมในครึ่งล่าง
- อย่าวางปุ่ม บรรทัดข้อความ หรือหน้าพับ
ความต่อเนื่อง
เมื่อมีคนเปิดอุปกรณ์ระหว่างทำงาน แอปควรทำงานต่อจากจุดเดิม: ตำแหน่งการเลื่อนแบบเดิม แบบร่างแบบเดิม และการเล่นแบบเดิม ถือว่าการพับและกางออกเป็นการเปลี่ยนแปลงเค้าโครง ไม่ใช่การรีสตาร์ท และทำให้การเปลี่ยนแปลงเคลื่อนไหวเพื่อให้ผู้คนสามารถติดตามตำแหน่งที่เนื้อหาย้ายได้
ท่าทางและการเข้าถึง
หน้าจอที่ขยายใหญ่ขึ้นจะเปลี่ยนระยะเอื้อมของนิ้วหัวแม่มือ: วางการควบคุมบ่อยครั้งใกล้กับขอบที่มือวางอยู่ และหลีกเลี่ยงการปัดขอบที่ขัดแย้งกับท่าทางของระบบ การเคลื่อนไหวตามหลักฟิสิกส์ก็ช่วยได้เช่นกัน กรอบที่เลื่อนและตกลงไปกับสปริงทำให้การเปลี่ยนท่าทางต่างๆ ให้ความรู้สึกเป็นธรรมชาติมากกว่าที่จะสั่นสะเทือน
คีย์ Principles ที่ต้องจำ
- ออกแบบตามคลาสขนาดหน้าต่าง ไม่ใช่รุ่นอุปกรณ์
- กะทัดรัด < 600dp, ปานกลาง 600–840dp, ขยาย 840–1200dp
- รองรับท่าพับ เปิด และท่าตั้งโต๊ะ
- เก็บเนื้อหาและการควบคุมไว้ในหน้าพับ
- รักษาสถานะและการเคลื่อนไหวท่าทางที่เปลี่ยนแปลง
คำถามที่พบบ่อย
แหล่งที่มา
- Learn about foldables — นักพัฒนา Android
- Use window size classes — นักพัฒนา Android