แอป Android มีบทบาทสำคัญในการนิยามลักษณะของการประมวลผลสมัยใหม่ บนหน้าจอขนาดใหญ่ แต่การใช้งานแอปบนอุปกรณ์เคลื่อนที่ บน Chromebook ไม่ได้ทำให้ ทำให้ผู้ใช้ได้รับประสบการณ์ที่ดีที่สุด
หน้านี้แสดงรายละเอียดบางส่วนที่คุณสามารถปรับแต่งประสบการณ์การใช้งาน เทียบกับแล็ปท็อปและรูปแบบของอุปกรณ์แบบพับจอได้ โปรดดู รายการการทดสอบที่ครอบคลุมเพื่อดูข้อมูลเพิ่มเติมเกี่ยวกับการทดสอบแอปสำหรับ ความเข้ากันได้ของอุปกรณ์เหล่านี้
ใช้ประโยชน์จากการสนับสนุนหน้าต่างหลายหน้าต่างรูปแบบอิสระ
การใช้งานแอป Android บน ChromeOS ประกอบด้วยหน้าต่างหลายหน้าต่างพื้นฐาน การสนับสนุน แทนที่จะใช้พื้นที่เต็มหน้าจอเสมอ Android จะแสดงผล บน ChromeOS ลงในคอนเทนเนอร์หน้าต่างรูปแบบอิสระ ซึ่งเหมาะกับอุปกรณ์เหล่านี้มากกว่า
ผู้ใช้จะปรับขนาดหน้าต่างที่มีแอป Android ได้ดังที่แสดงในรูปที่ 1 เพื่อให้แน่ใจว่าหน้าต่างรูปแบบอิสระของคุณจะปรับขนาดได้อย่างราบรื่นและแสดงผล เนื้อหาทั้งหมดให้กับผู้ใช้ โปรดอ่านหลักเกณฑ์ในการจัดการหน้าต่าง
![](https://developer.android.com/static/images/topic/arc/resizable.png?authuser=0000&hl=th)
รูปที่ 1 หน้าต่างแอปที่ปรับขนาดได้
คุณปรับปรุงประสบการณ์ของผู้ใช้เมื่อแอปทำงานบน ChromeOS ได้โดยทำตามขั้นตอนต่อไปนี้ แนวทางปฏิบัติ:
- จัดการวงจรกิจกรรมอย่างถูกต้องใน โหมดหลายหน้าต่าง และตรวจสอบว่าคุณอัปเดต UI อย่างต่อเนื่อง แม้ว่าแอปของคุณจะ หน้าต่างที่โฟกัสอยู่ด้านบนสุด
- ตรวจสอบว่าแอปปรับเลย์เอาต์อย่างเหมาะสมทุกครั้งที่ผู้ใช้ปรับขนาดหน้าต่างของแอป
- ปรับแต่งขนาดเริ่มต้นของหน้าต่างแอปด้วยการระบุขนาด ขนาดการเปิดตัว
- โปรดทราบว่า การวางแนว กิจกรรมรูทของแอปส่งผลต่อหน้าต่างทั้งหมดของแอป
ปรับแต่งสีของแถบด้านบน
ChromeOS ใช้ธีมของแอปเพื่อใส่สีแถบด้านบนที่แสดงบนแอป
ซึ่งจะแสดงเมื่อผู้ใช้กดปุ่มควบคุมหน้าต่างและปุ่มย้อนกลับค้างไว้ เพื่อให้
แอปของคุณดูสะอาดตาและปรับให้เหมาะกับ ChromeOS
colorPrimary
และหากเป็นไปได้
วันที่ colorPrimaryDark
ในธีมของแอป
มีการใช้ colorPrimaryDark
เพื่อสร้างสีให้แถบด้านบน หากเพียง
กำหนด colorPrimary
แล้ว ChromeOS จะใช้เวอร์ชันสีเข้มใน
แถบด้านบน ดูข้อมูลเพิ่มเติมได้ที่รูปแบบและธีม
รองรับแป้นพิมพ์ แทร็กแพด และเมาส์
Chromebook ทุกเครื่องจะมีแป้นพิมพ์และแทร็กแพดจริง และบางรุ่นมี หน้าจอสัมผัสด้วย เปลี่ยนอุปกรณ์บางเครื่องจากแล็ปท็อปเป็นแท็บเล็ตได้
ในแอปสำหรับ ChromeOS ให้รองรับการป้อนข้อมูลจากเมาส์ แทร็กแพด และแป้นพิมพ์ เพื่อให้ใช้แอปได้โดยไม่ต้องหน้าจอสัมผัส แอปจำนวนมากรองรับเมาส์และ ให้แทร็กแพดได้โดยไม่ต้องดำเนินการเพิ่ม อย่างไรก็ตาม คุณควรปรับแต่งการตั้งค่า ของเมาส์อย่างเหมาะสม และเพื่อสนับสนุนและแยกความแตกต่างระหว่าง การป้อนข้อมูลด้วยเมาส์และ การแตะ
ตรวจสอบว่าเป็นไปตามนี้
- เป้าหมายทั้งหมดคลิกได้ด้วยเมาส์
- พื้นผิวที่เลื่อนได้แบบสัมผัสทั้งหมดซึ่งเลื่อนบนเหตุการณ์ล้อเลื่อนของเมาส์ ดังที่แสดงใน รูปที่ 2
- ใช้วิจารณญาณอย่างระมัดระวังเพื่อปรับปรุง การค้นพบ UI โดยไม่ทำให้ผู้ใช้รู้สึกว่ามากจนเกินไป ดังที่แสดงในรูปที่ 3
![](https://developer.android.com/static/images/topic/arc/scroll_on_mousewheel.png?authuser=0000&hl=th)
รูปที่ 2 การเลื่อนด้วยล้อเลื่อนของเมาส์
![](https://developer.android.com/static/images/topic/arc/hover_states.png?authuser=0000&hl=th)
รูปที่ 3 สถานะวางเมาส์เหนือปุ่ม
แยกความแตกต่างระหว่างการป้อนข้อมูลด้วยเมาส์และการแตะ ตามความเหมาะสม สำหรับ ตัวอย่างเช่น แตะและ การกดค้างที่รายการหนึ่งๆ อาจทริกเกอร์ UI แบบเลือกหลายรายการ ขณะที่ การคลิกขวาที่รายการเดียวกันอาจเรียกใช้เมนูตัวเลือกแทน
เคอร์เซอร์ที่กำหนดเอง
ปรับแต่งแอป เคอร์เซอร์เมาส์เพื่อบอกว่าผู้ใช้นั้นมีองค์ประกอบใดใน UI บ้าง
ในการโต้ตอบและวิธีโต้ตอบ คุณตั้งค่าให้ใช้ PointerIcon
ได้
เมื่อผู้ใช้โต้ตอบกับมุมมองด้วยการเรียกใช้เมธอด setPointerIcon()
แสดงข้อมูลต่อไปนี้ในแอปทั้งหมด
- ตัวชี้ I-beam สำหรับข้อความ
- ปรับขนาดแฮนเดิลที่ขอบเลเยอร์ที่ปรับขนาดได้
- ตัวชี้มือแบบเปิดและปิดสำหรับเนื้อหาที่สามารถเลื่อนหรือลากได้ โดยใช้ท่าทางสัมผัสการคลิกและลาก
- กำลังประมวลผลไอคอนหมุน
คลาส PointerIcon
จะให้ค่าคงที่ที่คุณ
เพื่อติดตั้งใช้งานเคอร์เซอร์ที่กำหนดเอง
แป้นพิมพ์ลัดและการนำทาง
เนื่องจาก Chromebook ทุกเครื่องมีแป้นพิมพ์จริง ให้เตรียมแป้นลัดเพื่อ ช่วยให้ผู้ใช้ทำงานได้อย่างมีประสิทธิภาพมากขึ้น เช่น หากแอปของคุณรองรับ การพิมพ์ ให้ใช้ Control+P เพื่อเปิดกล่องโต้ตอบการพิมพ์
ในทำนองเดียวกัน ให้จัดการองค์ประกอบ UI ที่สำคัญทั้งหมดโดยใช้การไปยังส่วนต่างๆ ของแท็บ ซึ่งสำคัญมากสำหรับการช่วยเหลือพิเศษ เพื่อให้เป็นไปตามมาตรฐานการช่วยเหลือพิเศษ แพลตฟอร์ม UI ทั้งหมดต้องมุ่งเน้นและสอดคล้องกับการช่วยเหลือพิเศษอย่างชัดเจน ดังที่ปรากฏในรูปต่อไปนี้
![](https://developer.android.com/static/images/topic/arc/transversal_tabbing.png?authuser=0000&hl=th)
รูปที่ 4 การแท็บการข้ามช่อง
![](https://developer.android.com/static/images/topic/arc/hover_controls.png?authuser=0000&hl=th)
รูปที่ 5 การแทนที่ท่าทางสัมผัสการปัดด้วยตัวควบคุมที่ปรากฏเมื่อวางเมาส์เหนือ
ใช้แป้นพิมพ์หรือเมาส์เป็นทางเลือกหลัก ฟีเจอร์ที่ถูกซ่อนภายใต้การโต้ตอบแบบเจาะจงการสัมผัส เช่น การแตะและ ระงับการดำเนินการ การปัด หรือท่าทางสัมผัสแบบมัลติทัชอื่นๆ ตัวอย่างโซลูชันคือ ปรากฏบนพื้นผิว เมื่อวางเมาส์เหนือปุ่ม
สำหรับข้อมูลเพิ่มเติมเกี่ยวกับแป้นพิมพ์ แทร็กแพด และการรองรับเมาส์ โปรดดู ความเข้ากันได้ของอินพุตบนหน้าจอขนาดใหญ่
ปรับปรุงข้อมูลจากผู้ใช้ให้ดียิ่งขึ้น
โปรดคํานึงถึงสิ่งต่อไปนี้เพื่อให้แอปใช้ฟังก์ชันการทำงานระดับเดสก์ท็อปได้ ข้อมูลที่เน้นประสิทธิภาพการทำงาน
เมนูตามบริบท
เมนูตามบริบทของ Android ซึ่งเป็นอีกตัวเร่งการนำผู้ใช้ไปยัง คุณลักษณะต่างๆ ของแอป สามารถทริกเกอร์ด้วยการคลิกเมาส์หรือแทร็กแพด ปุ่มรองหรือผ่านการแตะและ แตะหน้าจอสัมผัสค้างไว้
![](https://developer.android.com/static/images/topic/arc/contextual_menu.png?authuser=0000&hl=th)
รูปที่ 6 เมนูตามบริบทจะปรากฏขึ้นเมื่อคลิกขวา
ลากและวาง
การสร้างการโต้ตอบแบบลากและวาง อย่างเช่นในรูปต่อไปนี้ จะช่วยมอบประสิทธิภาพการทำงาน ที่เข้าใจง่ายและประสิทธิผล กับแอปของคุณได้ ดูข้อมูลเพิ่มเติมได้ที่ลากและวาง
![](https://developer.android.com/static/images/topic/arc/drag_and_drop.png?authuser=0000&hl=th)
รูปที่ 7 ลากและวางในอินเทอร์เฟซแผนผังไฟล์
รองรับสไตลัส
การรองรับสไตลัสมีความสำคัญมากสำหรับแอปวาดรูปและจดโน้ต มอบข้อมูลที่เพิ่มประสิทธิภาพ รองรับ Chromebook และแท็บเล็ตที่ติดตั้งสไตลัสด้วยการใช้การโต้ตอบ ที่ปรับให้เหมาะกับการใช้งานอินพุตของสไตลัส
คำนึงถึงรูปแบบที่เป็นไปได้ ในฮาร์ดแวร์สไตลัสแบบต่างๆ ขณะออกแบบการโต้ตอบของสไตลัส สำหรับโครงร่างของ Stylus API โปรดดู ความเข้ากันได้ของอินพุตบนหน้าจอขนาดใหญ่
ทำให้เลย์เอาต์ปรับเปลี่ยนตามอุปกรณ์
ใช้พื้นที่บนหน้าจอให้เกิดประโยชน์สูงสุดสำหรับแอปของคุณโดยไม่คำนึงถึง สถานะภาพ (เต็มหน้าจอ แนวตั้ง แนวนอน หรือหน้าต่าง) ตัวอย่างบางส่วนของ การใช้พื้นที่ที่ดีรวมถึง
- แสดงสถาปัตยกรรมแอป
- จำกัดความยาวของข้อความและขนาดรูปภาพให้มีความกว้างสูงสุด
- ใช้ประโยชน์จากอสังหาริมทรัพย์ในแถบเครื่องมือของแอปได้ดียิ่งขึ้น
- ปรับปรุงตำแหน่งความพร้อมใช้งานของ UI โดยปรับแอปให้เข้ากับการใช้เมาส์แทน ของนิ้วหัวแม่มือ
- ปรับขนาดของวิดีโอและรูปภาพ กำหนดความกว้างสูงสุด และความสูงสำหรับสื่อทั้งหมด รวมทั้งเพิ่มความสามารถในการอ่านและสแกนได้ง่าย
- ใช้ระบบคอลัมน์ที่ปรับเปลี่ยนตามอุปกรณ์ สำหรับข้อมูลเพิ่มเติม โปรดดูที่การปรับเปลี่ยนตามอุปกรณ์ เลย์เอาต์แบบตารางกริด
- ปรับขนาดและแก้ไข UI เมื่อจำเป็นโดยใช้ระบบคอลัมน์ หลีกเลี่ยงการเปิดหน้าต่างใหม่ หากเป็นไปได้
- ลดความสำคัญของคอมโพเนนต์การเลื่อนแนวนอนหรือนำออก
- หลีกเลี่ยง UI แบบเต็มหน้าจอ ใช้ UI ในบรรทัด เช่น สัญญาณบอกสถานะความคืบหน้าและ ในการดำเนินการที่ไม่สำคัญทั้งหมด
- ใช้คอมโพเนนต์ UI ที่ได้รับการปรับปรุง เช่น เครื่องมือเลือกเวลาและวันที่ ช่องข้อความ และ เมนูที่ออกแบบมาสำหรับเมาส์ แป้นพิมพ์ และหน้าจอขนาดใหญ่
- ใช้การแก้ไขในบรรทัด คอลัมน์เพิ่มเติม หรือ UI แบบโมดัลแทนกิจกรรมใหม่ สำหรับฟีเจอร์ตัดต่อตั้งแต่ขนาดเล็กถึงปานกลาง
- นำออกหรือแก้ไขปุ่มการทำงานแบบลอย (FAB) เพื่อแป้นพิมพ์ที่ดีขึ้น การนำทาง โดยค่าเริ่มต้น ตำแหน่ง FAB จะอยู่ในแท็บแบบข้ามผ่าน คำสั่งซื้อ แต่ให้สร้างการกระทำนั้นก่อน เนื่องจากเป็นการกระทำหลัก หรือ แทนที่ด้วยตัวเลือกที่มีราคาสูงกว่า
![](https://developer.android.com/static/images/topic/arc/responsive_layout.png?authuser=0000&hl=th)
รูปที่ 8 การจำลองเลย์เอาต์ที่ปรับเปลี่ยนตามอุปกรณ์บนหน้าจอขนาดของโทรศัพท์และเดสก์ท็อป
เปลี่ยนรูปแบบการนำทาง
ปุ่มย้อนกลับระดับระบบจะเป็นรูปแบบที่มี มาจากรากของ Android ที่ไม่เหมาะเท่าไหร่ ของเดสก์ท็อป
เมื่อแอปของคุณมีการปรับแต่งเข้ากับสภาพแวดล้อมแล็ปท็อปมากขึ้น คุณจึงควรพิจารณา ไปยังรูปแบบการนำทางที่ไม่ให้ความสำคัญกับปุ่มย้อนกลับ อนุญาตให้ แอปจัดการสแต็กประวัติของตัวเองด้วยการแสดงการย้อนกลับในแอป ปุ่ม เบรดครัมบ์ หรือเส้นทางยกเว้นอื่นๆ เช่น ปุ่มปิดหรือยกเลิก ของ UI หน้าจอขนาดใหญ่
คุณควบคุมได้ว่าจะให้แอปแสดงปุ่มย้อนกลับในหน้าต่างของแอปหรือไม่โดย
ตั้งค่ากำหนดภายใน
<activity>
แท็ก การตั้งค่าการซ่อน true
รายการ
ปุ่มย้อนกลับ
<meta-data android:name="WindowManagerPreference:SuppressWindowControlNavigationButton" android:value="true" />
แก้ปัญหาเกี่ยวกับรูปภาพตัวอย่างจากกล้อง
ปัญหากล้องอาจเกิดขึ้นเมื่อแอปทำงานได้ในแนวตั้งเท่านั้น แต่ผู้ใช้จะเรียกใช้บนหน้าจอแนวนอน ในกรณีนี้ ตัวอย่างหรือ ผลลัพธ์ที่บันทึกไว้อาจมีการหมุนไม่ถูกต้อง
โหมดความเข้ากันได้จะเปลี่ยนวิธีที่ระบบจัดการกับเหตุการณ์ เช่น การเปลี่ยนการวางแนว ใน ChromeOS การดำเนินการนี้จะช่วยป้องกันปัญหาเมื่อใช้กล้องในสถานที่ โหมดการวางแนว หากต้องการเปิดใช้โหมดความเข้ากันได้ คุณต้องมีคุณสมบัติตรงตามเกณฑ์ต่อไปนี้
- กำหนดเป้าหมายเป็น Android 7.0 เป็นอย่างต่ำ (API ระดับ 24) ระดับ SDK ต่ำสุดอาจต่ำกว่านี้
- ทำให้แอปปรับขนาดได้
จัดการการตั้งค่าอุปกรณ์
พิจารณาการตั้งค่าอุปกรณ์ต่อไปนี้สำหรับแอปที่ทำงานใน ChromeOS
เปลี่ยนระดับเสียง
อุปกรณ์ ChromeOS เป็นอุปกรณ์ที่มีระดับเสียงคงที่ ซึ่งหมายความว่าแอปที่เล่นเสียงจะมีแอปของตัวเอง การควบคุมระดับเสียง ปฏิบัติตามหลักเกณฑ์สำหรับ การทำงาน กับอุปกรณ์ที่มีระดับเสียงคงที่
เปลี่ยนความสว่างของหน้าจอ
คุณไม่สามารถปรับความสว่างของอุปกรณ์ใน ChromeOS การเรียกไปยัง
system settings
และ
ระบบจะไม่สนใจ WindowManager.LayoutParams
สื่อการเรียนรู้เพิ่มเติม
ดูข้อมูลเพิ่มเติมเกี่ยวกับการเพิ่มประสิทธิภาพแอป Android สำหรับ Chromebook ได้ที่ แหล่งข้อมูลต่อไปนี้
- อ่าน นำแอป Android ของคุณมาสู่ Chromebook ในโพสต์สำหรับนักพัฒนาซอฟต์แวร์ Android บล็อก
- ดูแอป Android สำหรับ Chromebook และอุปกรณ์หน้าจอขนาดใหญ่จากการประชุม Google I/O 2017