Dynamic Island: คืออะไร การแจ้งเตือนแบบโต้ตอบของ iPhone

Dynamic Island บน iPhone คืออะไร?

Dynamic Island คือองค์ประกอบอินเทอร์เฟซของ iPhone 14 Pro, 15 Pro และรุ่นที่ใหม่กว่า ซึ่งใช้พื้นที่รอบกล้องหน้าและเซ็นเซอร์ Face ID เพื่อแสดงการแจ้งเตือนและ Live Activity แตกต่างจาก notch แบบเก่าที่เป็นองค์ประกอบสีดำคงที่ Dynamic Island เปลี่ยนรูปร่างและขนาดได้อย่างไดนามิก: ขยายเพื่อแสดงตัวจับเวลา, หดตัวสำหรับไอคอน AirPods ที่เชื่อมต่อ, เปลี่ยนเป็นสี่เหลี่ยมผืนผ้าสำหรับคะแนนกีฬา

การนำไปใช้ทางเทคนิค ของ Dynamic Island อาศัยรอยตัดฮาร์ดแวร์รูปทรงยาเม็ดของหน้าจอ OLED และการประมวลผลพิกเซลของซอฟต์แวร์รอบๆ ระบบเพิ่มอัตราการรีเฟรชพิกเซลเป็น 120 Hz ในพื้นที่ Island และใช้การปรับให้เรียบเพื่อการเปลี่ยนที่ราบรื่นระหว่างเนื้อหาและพื้นที่สีดำของกล้อง นักพัฒนาไม่ได้เขียนโปรแกรม Island โดยตรง — พวกเขาสร้างเนื้อหาผ่าน ActivityKit และระบบจะวางไว้รอบรอยตัดโดยอัตโนมัติ

การรับรู้ของผู้ใช้ — Dynamic Island เปลี่ยนข้อเสียของฮาร์ดแวร์ให้เป็นองค์ประกอบที่ใช้งานได้ จากการวิจัยของ Apple ผู้ใช้มองว่า Island เป็นส่วนธรรมชาติของหน้าจอหลังจากใช้งานเพียงไม่กี่วัน การไฮไลต์และภาพเคลื่อนไหวเปลี่ยนความสนใจ — ตัวอย่างเช่น การแจ้งเตือนขาเข้าจะเลื่อน Island และแสดงเนื้อหาพร้อมเอฟเฟกต์การขยายที่ 120 เฟรมต่อวินาที

โหมดการแสดงผลของ Dynamic Island

Dynamic Island รองรับ โหมดการแสดงเนื้อหาสามโหมด ซึ่งระบบจะเลือกโดยอัตโนมัติตามประเภทและจำนวนกิจกรรม นักพัฒนากำหนด UI สำหรับแต่ละโหมดใน WidgetBundle แต่ไม่สามารถควบคุมว่าโหมดใดกำลังทำงานอยู่ ระบบสามารถแสดงสองกิจกรรมพร้อมกันได้: หนึ่งทางซ้ายของรอยตัด, อีกหนึ่งทางขวา

การเปลี่ยนระหว่างโหมด ดำเนินการด้วยภาพเคลื่อนไหวของระบบที่ยาว 0.4–0.6 วินาทีด้วยเส้นโค้ง ease-in-out เมื่อ Activity ใหม่ปรากฏขึ้น Island จะขยายจากโหมดกะทัดรัดเป็นโหมดขยาย เมื่อสิ้นสุด จะหดกลับ ผู้ใช้สามารถบังคับยุบโหมดขยายโดยการปัดไปทางซ้าย — Island จะเปลี่ยนเป็นโหมดกะทัดรัดหรือน้อยที่สุด ระบบยังยุบโหมดขยายหลังจากไม่มีการเคลื่อนไหว 5 วินาทีหากไม่มีการอัปเดตที่คาดไว้

สองกิจกรรม — หากสองแอปมี Live Activities ที่ทำงานอยู่ Dynamic Island จะแสดงทั้งสองด้านของรอยตัด ด้านซ้ายคือ Activity ที่เริ่มก่อน ด้านขวาคือ Activity ที่สอง หากมีกิจกรรมเดียว จะครอบครองด้านซ้าย ด้านขวาจะว่างเปล่า การแตะด้านใดด้านหนึ่งจะขยาย Island และแสดงเนื้อหาของ Activity นั้น ระบบจะตัดสินใจเองว่า Activity ใดได้รับลำดับความสำคัญในกรณีที่ขัดแย้ง

การสร้างเนื้อหาสำหรับ Dynamic Island

เนื้อหา Dynamic Island ถูกสร้างขึ้นผ่าน Live Activity ด้วยเฟรมเวิร์ก ActivityKit เท่านั้น นักพัฒนากำหนดสี่พื้นที่ในโค้ด: กะทัดรัดซ้าย (compactLeading), กะทัดรัดขวา (compactTrailing), น้อยที่สุด (minimal) และขยาย (expanded) แต่ละพื้นที่คือ SwiftUI View ที่รับสถานะปัจจุบันของ Activity ผ่าน context หากพื้นที่ไม่ได้ถูกกำหนด Island จะไม่แสดง Activity นั้นในโหมดที่เกี่ยวข้อง

struct DeliveryIsland: DynamicIsland {
    var body: some DynamicIslandContent {
        DynamicIslandExpandedContent {
            VStack(alignment: .leading) {
                Text(context.state.status)
                    .font(.headline)
                ProgressView(
                    value: context.state.progress
                )
                Text("ETA: \(context.state.minutes) min")
                    .font(.caption)
            }
        } compactLeading: {
            Image(systemName: "box.truck")
        } compactTrailing: {
            Text("\(context.state.minutes) min")
                .monospacedDigit()
        } minimal: {
            Image(systemName: "box.truck")
        }
    }
}

ข้อจำกัดของ SwiftUI ใน Dynamic Island — คอมโพเนนต์ที่ใช้ได้: Text, Image, HStack, VStack, ZStack, Spacer, ProgressView, Button (ผ่าน Link เท่านั้น), Gauge ต้องห้าม: ScrollView, List, TabView, ภาพเคลื่อนไหว, gesture recognizers จานสี — เฉพาะ System Colors (label, secondaryLabel, tint) แบบอักษร — ขนาดระบบจาก .caption ถึง .title3 แบบอักษรที่กำหนดเองและ SF Symbols ทำงานได้อย่างถูกต้อง

การทดสอบ Dynamic Island — Xcode มีโปรแกรมจำลองที่รองรับ Dynamic Island เลือก iPhone 14 Pro หรือ 15 Pro เป็นอุปกรณ์เป้าหมาย ActivityKit จำลองโหมด Island ต่างๆ: ปุ่ม Dynamic Island Mode ในเมนู Debug ของ Xcode จะสลับระหว่างกะทัดรัด น้อยที่สุด และขยาย หากต้องการทดสอบหลาย Activities พร้อมกัน ให้ใช้สคีมาที่มี ActivityID ต่างกัน หรือเรียกใช้สองอินสแตนซ์ของแอป

เหตุการณ์ระบบใน Dynamic Island

เหตุการณ์ระบบ — สายเรียกเข้า, AirPods, Face ID, การชาร์จ และอื่นๆ — มีลำดับความสำคัญเหนือ Live Activities ที่กำหนดเอง เมื่อเหตุการณ์ระบบเกิดขึ้น Island จะหยุดการแสดงเนื้อหาที่กำหนดเองชั่วคราวและแสดงเนื้อหาระบบ หลังจากเหตุการณ์ระบบสิ้นสุด Island จะกลับไปยังเนื้อหาที่กำหนดเองพร้อมภาพเคลื่อนไหว นักวิจัยไม่สามารถยกเลิกหรือแก้ไขเหตุการณ์ระบบ — เหตุการณ์เหล่านี้ถูกจัดการในระดับระบบปฏิบัติการ iOS

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

การเชื่อมต่อ AirPods — เมื่อเปิดเคสใกล้ iPhone Dynamic Island จะแสดงภาพเคลื่อนไหวการเชื่อมต่อและแสดงการชาร์จของหูฟังแต่ละข้างและเคส ภาพเคลื่อนไหวยาวนาน 2–3 วินาที หลังจากนั้น Island จะกลับสู่สถานะก่อนหน้า หากผู้ใช้ไม่มี Live Activities ที่ทำงานอยู่ Island จะยังคงว่างเปล่า AirPods Pro 2 ยังแสดงระดับเสียงและโหมดตัดเสียงรบกวนเมื่อกดที่ก้าน

แนวทางปฏิบัติที่ดีที่สุดสำหรับการพัฒนา Dynamic Island

แนวทางปฏิบัติที่ดีที่สุดของ Dynamic Island จาก Apple ควรปฏิบัติตามเพื่อให้แน่ใจว่ามีประสบการณ์ผู้ใช้ที่มีคุณภาพ โหมดกะทัดรัดควรแสดงเฉพาะข้อมูลที่สำคัญที่สุด — ไอคอนและตัวเลขเดียวหรือป้ายสั้นๆ โหมดขยาย — เฉพาะข้อมูลหลักโดยไม่มีองค์ประกอบซ้ำซ้อน หลีกเลี่ยงการวางข้อความในโหมดกะทัดรัดหากเกิน 20 ตัวอักษร — ระบบจะตัดข้อความด้วยจุดไข่ปลา

การอัปเดตแบบพุชสำหรับ Dynamic Island — ใช้ ActivityKit push สำหรับการอัปเดตที่หายาก (สถานะคำสั่งซื้อ, ผลกีฬา) และการอัปเดตเฉพาะที่สำหรับตัวจับเวลาบ่อยครั้งหรือนาฬิกาจับเวลา การแจ้งเตือนแบบพุชจะผ่าน APNs และใช้เวลา 0.5–2 วินาทีในการแสดงใน Island StaleDate — กำหนดวันหมดอายุของเนื้อหา: หากการอัปเดตไม่มาถึงตรงเวลา ระบบจะแสดงพื้นหลังสีเทาแทนเนื้อหา เพื่อส่งสัญญาณให้ผู้ใช้ทราบว่าข้อมูลล้าสมัย

func updateDelivery(activity: Activity<DeliveryAttributes>) {
    Task {
        let newContent = ActivityContent(
            state: DeliveryAttributes.ContentState(
                status: .delivered,
                estimatedMinutes: 0
            ),
            staleDate: Date().addingTimeInterval(300)
        )
        await activity.update(newContent)
        // กำลังสิ้นสุด Activity ใน 2 วินาที
        try? await Task.sleep(nanoseconds: 2_000_000_000)
        await activity.end(newContent)
    }
}

การใช้พลังงาน — Dynamic Island และ Live Activities มีผลกระทบต่อแบตเตอรี่น้อยที่สุดเนื่องจากการเพิ่มประสิทธิภาพฮาร์ดแวร์หน้าจอ OLED พิกเซลสีดำรอบรอยตัดถูกปิด และเนื้อหาจะถูกเรนเดอร์บนโคโปรเซสเซอร์เฉพาะ การใช้พลังงาน Live Activity โดยเฉลี่ยน้อยกว่า 1% ของแบตเตอรี่ต่อชั่วโมงการใช้งานเมื่ออัปเดตทุก 5 นาที ระบบจะหยุด Island โดยอัตโนมัติเมื่อแบตเตอรี่เหลือน้อย (ต่ำกว่า 20%) หรือในโหมดประหยัดพลังงาน

การออกแบบสำหรับ Dynamic Island ไม่ต้องการการปรับ UI หลักของแอป — Island ทำงานอิสระจากหน้าจอที่ทำงานอยู่ สีของ Live Activity ควรตรงกับธีมระบบ (สว่าง/มืด) ผ่าน Color Assets ของระบบ SF Symbols เป็นที่นิยมมากกว่าไอคอนที่กำหนดเอง — รับประกันว่าจะแสดงได้อย่างถูกต้องในทุกโหมดของ Island และมีการรองรับ Dynamic Type ในตัว