ข่าวสารผลิตภัณฑ์

ปลดล็อกความเป็นไปได้ใหม่ๆ ด้วยเลย์เอาต์แบบปรับอัตโนมัติของ Compose 1.2 เบต้า

ใช้เวลาอ่าน 3 นาที

เมื่อมีรูปแบบใหม่ๆ เช่น Pixel 10 Pro Fold เข้ามาในระบบนิเวศของ Android การพัฒนาแอปแบบปรับเปลี่ยนได้จึงเป็นสิ่งจำเป็นในการสร้างประสบการณ์ของผู้ใช้คุณภาพสูงในโทรศัพท์ แท็บเล็ต และอุปกรณ์พับได้ ผู้ใช้คาดหวังให้ UI ของแอปปรับให้เข้ากับขนาดและท่าทางต่างๆ เหล่านี้ได้อย่างราบรื่น

เราจึงขอประกาศว่า Compose Adaptive Layouts Library 1.2 ได้เข้าสู่เวอร์ชันเบต้าอย่างเป็นทางการแล้ว เพื่อช่วยให้คุณสร้างประสบการณ์แบบไดนามิกเหล่านี้ได้อย่างมีประสิทธิภาพมากขึ้น รุ่นนี้มีเครื่องมือใหม่ๆ ที่มีประสิทธิภาพในการสร้าง UI ที่สวยงามและตอบสนองได้ดีสำหรับระบบนิเวศของอุปกรณ์ที่กำลังขยายตัวนี้

เครื่องมือใหม่ที่ทรงประสิทธิภาพสำหรับผืนผ้าใบที่ใหญ่ขึ้น

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

  • กลยุทธ์เลย์เอาต์ใหม่ที่มีประสิทธิภาพ: เวอร์ชันเบต้าเปิดตัวกลยุทธ์เลย์เอาต์ใหม่ เช่น Reflow และ Levitate ซึ่งออกแบบมาเพื่อช่วยคุณสร้างเลย์เอาต์แบบไดนามิกที่ดูดีทั้งบนจอแสดงผลด้านนอกและด้านในของอุปกรณ์ เช่น Pixel 10 Pro Fold, Galaxy Z Fold7 และ Z Flip7
  • คลาสขนาดหน้าต่างใหม่: การเปิดตัวนี้ได้เพิ่มการรองรับในตัวสำหรับคลาสขนาดหน้าต่างใหม่ขนาดใหญ่และใหญ่พิเศษ เบรกพอยท์ใหม่เหล่านี้มีความสำคัญต่อการออกแบบและการทริกเกอร์การเปลี่ยนแปลง UI แบบหลายบานหน้าต่างที่สมบูรณ์บนหน้าจอขนาดใหญ่ เช่น แท็บเล็ตและอุปกรณ์พับขนาดใหญ่
new-pane-adaptation.webp

กลยุทธ์การปรับบานหน้าต่างใหม่ 2 แบบ ได้แก่ การปรับข้อความใหม่ (ซ้าย) และการลอย (ขวา)

ดูรายการการเปลี่ยนแปลงทั้งหมดได้ในเอกสารประกอบการเปิดตัวอย่างเป็นทางการ ดูคำแนะนำเกี่ยวกับเลย์เอาต์มาตรฐานและการสร้างเลย์เอาต์แผงสนับสนุน

ดึงดูดผู้ใช้ให้มีส่วนร่วมมากขึ้นในทุกหน้าจอ

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

adaptive2.png

นี่คือหลักการสำคัญเบื้องหลังกลยุทธ์เลย์เอาต์แบบไดนามิก เช่น reflow ซึ่งเป็นฟีเจอร์ใหม่ที่มีประสิทธิภาพใน Compose Adaptive Layouts 1.2 เบต้าที่ออกแบบมาเพื่อช่วยคุณสร้าง UI เหล่านี้ ตัวอย่างเช่น จุดเริ่มต้นที่ดีคือการใช้เลย์เอาต์แบบหลายบานหน้าต่าง การแสดงรายการและมุมมองรายละเอียดที่เกี่ยวข้องควบคู่กันจะช่วยลดการแตะและช่วยให้ผู้ใช้ทำงานได้เร็วขึ้น

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

ระบบนิเวศของ Android ที่ขยายตัวตั้งแต่โทรศัพท์แบบพับได้ไปจนถึงเดสก์ท็อป

การเปลี่ยนไปใช้การออกแบบที่ปรับเปลี่ยนตามอุปกรณ์นี้ครอบคลุมทั้งระบบนิเวศของ Android ตั้งแต่ Pixel 10 Pro Fold รุ่นใหม่ไปจนถึง Samsung Galaxy รุ่นพับได้ล่าสุด นักพัฒนาแอปมีโอกาสดึงดูดฐานผู้ใช้จำนวนมากที่กำลังเติบโตในอุปกรณ์หน้าจอขนาดใหญ่กว่า 500 ล้านเครื่อง

material.png

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

การนำหลักการแบบปรับเปลี่ยนได้ไปใช้จริง

สำหรับนักพัฒนาแอปที่ต้องการเตรียมแอปให้พร้อมสำหรับอนาคตที่ปรับเปลี่ยนได้นี้ โปรดคำนึงถึงแนวทางปฏิบัติแนะนำที่สำคัญต่อไปนี้

  • ประเมินสถานการณ์: ขั้นตอนแรกคือการดูว่าคุณอยู่ตรงไหนในวันนี้ ทดสอบแอปในอุปกรณ์หน้าจอขนาดใหญ่หรือด้วยโปรแกรมจำลองที่ปรับขนาดได้ใน Android Studio เพื่อระบุจุดที่ควรปรับปรุง เช่น UI ที่ยืดออกหรือปัญหาด้านความสามารถในการใช้งาน
  • รองรับเลย์เอาต์ที่เพิ่มประสิทธิภาพ: ใช้ไลบรารี เช่น Compose Adaptive Layouts เพื่อสร้าง UI ที่ปรับให้เข้ากับขนาดหน้าต่างและท่าทางของอุปกรณ์ต่างๆ แอปควรทำงานได้ดีทั้งในแนวตั้งและแนวนอนโดยไม่จำกัดการวางแนว
  • คิดถึงการใช้งานที่มากกว่าการสัมผัส: ประสบการณ์การใช้งานแบบปรับเปลี่ยนที่ยอดเยี่ยมหมายถึงการรองรับวิธีการป้อนข้อมูลทั้งหมด ซึ่งนอกเหนือจากฟังก์ชันพื้นฐานแล้ว ยังรวมถึงรายละเอียดที่ผู้ใช้คาดหวัง เช่น สถานะการวางเมาส์เหนือเคอร์เซอร์ของเมาส์ เมนูตามบริบทเมื่อคลิกขวา และการรองรับแป้นพิมพ์ลัด

ศักยภาพของแอปไม่ได้จำกัดอยู่แค่หน้าจอเดียวอีกต่อไป สำรวจแกลเลอรีการออกแบบสำหรับหน้าจอขนาดใหญ่และหลักเกณฑ์ด้านคุณภาพของแอปในวันนี้เพื่อดูว่าแอปของคุณจะไปได้ไกลแค่ไหน รับแรงบันดาลใจและค้นหารูปแบบการออกแบบ คำแนะนำอย่างเป็นทางการ และแอปตัวอย่างที่คุณต้องใช้ในการสร้างแอปสำหรับทุกการพับ การพลิก และหน้าจอที่ developer.android.com/adaptive-apps

เขียนโดย

อ่านต่อ