การแสดงภาพซ้อนภาพ

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

รูปที่ 1: ผู้ใช้สามารถดูวิดีโอต่อได้แม้จะไม่ได้อยู่ในแอปของคุณ

สรุปประเด็นสำคัญ

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

เพิ่มการรองรับการแสดงภาพซ้อนภาพลงในแอป

โดยค่าเริ่มต้น ระบบจะไม่รองรับ PiP สำหรับแอปโดยอัตโนมัติ และแอปจะต้องประกาศเพื่อรองรับฟีเจอร์นี้

หน้าต่าง PiP จะปรากฏในเลเยอร์บนสุดของหน้าจอที่มุมที่ระบบเลือก

การควบคุม

โดยค่าเริ่มต้น Android จะมีการควบคุม PIP สำหรับการปิดหน้าต่าง การขยายหน้าต่างกลับไปยังแบบเต็มหน้าจอ การตั้งค่า และการเล่นสื่อ แอปสามารถเพิ่มการดำเนินการที่กําหนดเองและชิ้นงานไอคอนที่เหมาะสมเพื่อให้ผู้ใช้โต้ตอบกับเนื้อหา PiP ได้

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

ในโหมด PIP กิจกรรมจะแสดงในหน้าต่างเล็กๆ ผู้ใช้จะโต้ตอบกับองค์ประกอบ UI อื่นๆ ของแอปไม่ได้ในโหมดนี้ และรายละเอียดขององค์ประกอบ UI ขนาดเล็กในหน้าต่าง PiP อาจมองเห็นได้ยาก

การควบคุม PiP เริ่มต้น

การควบคุม PiP เริ่มต้น

ตัวอย่างการควบคุม PiP ที่กําหนดเอง

ตัวอย่างการควบคุม PiP ที่กําหนดเอง

การใช้งาน

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

ตัวอย่างการดำเนินการที่เป็นไปได้มีดังนี้

  • กิจกรรมจะเข้าสู่โหมด PiP ได้เมื่อผู้ใช้แตะปุ่มหน้าแรกหรือปัดขึ้นเพื่อไปที่หน้าแรก วิธีนี้ช่วยให้ Google Maps แสดงเส้นทางต่อไปได้ขณะที่ผู้ใช้ทำกิจกรรมอื่นในเวลาเดียวกัน

    รูปที่ 4: ใช้ PiP เพื่อไปยังส่วนต่างๆ ต่อไป
  • แอปสามารถย้ายวิดีโอไปยังโหมด PIP เมื่อผู้ใช้ไปยังส่วนอื่นของแอปจากวิดีโอ

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

  • แอปของคุณสามารถช่วยให้ผู้ใช้จัดคิวเนื้อหาเพิ่มเติมขณะดูวิดีโอได้ วิดีโอจะเล่นต่อในโหมด PIP ขณะที่หน้าจอหลักแสดงกิจกรรมการเลือกเนื้อหา

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

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

รูปแบบการโต้ตอบ

ผู้ใช้สามารถลากหน้าต่าง PiP ไปยังตำแหน่งอื่นได้

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

รูปที่ 5: การควบคุม PiP เริ่มต้น

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

รูปที่ 6: สลับระหว่าง PiP ขนาดต่ำสุดและสูงสุดด้วยการแตะสองครั้ง

ซ่อนหน้าต่างโดยลากไปยังขอบด้านซ้ายหรือขวา หากต้องการเลิกซ่อนหน้าต่าง ให้แตะส่วนที่มองเห็นได้ของหน้าต่างที่ซ่อนอยู่หรือลากหน้าต่างนั้นออก

รูปที่ 7: PiP ที่เก็บไว้

ปรับขนาดหน้าต่าง PiP โดยใช้การบีบนิ้วเพื่อซูม

ปัด PIP ลงเพื่อนำหน้าต่างออก

รูปที่ 8: การปัดลง

ทรานซิชัน

ภาพเคลื่อนไหวที่ราบรื่นเมื่อเข้าสู่โหมด PIP

เมื่อผู้ใช้เปิดใช้งานโหมด PiP กิจกรรมปัจจุบันจะหดจากแบบเต็มหน้าจอเป็นหน้าต่างเล็กๆ ซึ่งจะแสดงเนื้อหาต่อไปโดยไม่มีการวางซ้อน UI

Android 12 มีการปรับปรุงภาพลักษณ์ที่สำคัญในทรานซิชันภาพเคลื่อนไหวระหว่างหน้าต่างแบบเต็มหน้าจอกับ PiP เราขอแนะนําอย่างยิ่งให้ใช้การเปลี่ยนแปลงที่เกี่ยวข้องทั้งหมด เมื่อทําเช่นนั้นแล้ว การเปลี่ยนแปลงเหล่านี้จะปรับขนาดให้เหมาะกับหน้าจอขนาดใหญ่โดยอัตโนมัติ เช่น หน้าจอแบบพับได้และแท็บเล็ต โดยที่คุณไม่ต้องดําเนินการใดๆ เพิ่มเติม

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

ตั้งแต่ Android 12 เป็นต้นไป Flag PictureInPictureParams.Builder.setAutoEnterEnabled(true) จะให้ภาพเคลื่อนไหวที่ราบรื่นยิ่งขึ้นสำหรับการเปลี่ยนไปใช้เนื้อหาวิดีโอในโหมด PIP โดยใช้การไปยังส่วนต่างๆ ด้วยท่าทางสัมผัส เช่น เมื่อปัดขึ้นเพื่อไปยังหน้าแรกจากแบบเต็มหน้าจอ เราขอแนะนําให้ใช้วิธีนี้หากแอปของคุณอยู่ในหมวดหมู่แอป ENTERTAINMENT, COMMUNICATION หรือ VIDEO_PLAYER

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

ประสบการณ์การเปลี่ยนที่ไม่ค่อยราบรื่นเมื่อ PiP ไม่ได้ติดตั้งใช้งานอย่างถูกต้อง setAutoEnterEnabled

เพิ่ม setAutoEnterEnabled ลงในแอปเพื่อมอบประสบการณ์การเปลี่ยนภาพที่ยอดเยี่ยม

ภาพที่ราบรื่นของวิดีโอ

เมื่อเราเปิดตัว PiP ใน Android 8.0 sourceRectHint จะระบุพื้นที่ของกิจกรรมที่มองเห็นได้หลังจากเปลี่ยนเป็นโหมด PIP เช่น ขอบเขตของมุมมองวิดีโอในวิดีโอเพลเยอร์ ตั้งแต่ Android 12 เป็นต้นไป ระบบปฏิบัติการจะใช้ sourceRectHint เพื่อแสดงภาพเคลื่อนไหวที่ราบรื่นยิ่งขึ้นทั้งเมื่อเข้าสู่และออกจากโหมด PIP

หากแอปไม่มี sourceRectHint ที่เหมาะสม ทรานซิชันของ PIP จะยังคงทำงานได้ แต่ภาพเคลื่อนไหวจะดูไม่เรียบร้อย ตัวอย่างเช่น วิดีโอ 3 แสดงตัวอย่างการเปลี่ยนจากโหมดเต็มหน้าจอเป็นโหมด PIP ที่ยังไม่สมบูรณ์ หลังจากหน้าต่างแบบเต็มหน้าจอหดขนาดเป็นหน้าต่าง PIP แล้ว หน้าต่างดังกล่าวจะปกคลุมด้วยการวางซ้อนสีดําก่อนที่จะแสดงวิดีโออีกครั้ง

วิดีโอ 3: ประสบการณ์การเปลี่ยนที่ไม่ค่อยราบรื่นเมื่อ PiP ไม่ได้ติดตั้งใช้งาน sourceRectHint อย่างถูกต้อง

หากต้องการดูตัวอย่างลักษณะภาพเคลื่อนไหวของ PiP เมื่อติดตั้งใช้งาน sourceRectHint อย่างถูกต้อง โปรดดูวิดีโอที่ 2 ในส่วนก่อนหน้า

ดูตัวอย่าง Kotlin PictureInPicture ของ Android เป็นข้อมูลอ้างอิงสำหรับการเปิดใช้ประสบการณ์การเปลี่ยนภาพที่ราบรื่น

ดูข้อมูลเพิ่มเติมเกี่ยวกับการใช้งาน PiP ได้ที่เอกสารประกอบสำหรับนักพัฒนาแอปเกี่ยวกับฟีเจอร์การแสดงภาพซ้อนภาพ