發表文章

iOS 16.1 Live Activities (即時動態) 開發上手教學 (下)

圖片
iOS 16.1 Live Activities(即時動態) 之動態島 上一篇 我們提到了即時動態的基本應用和相關的設定,那這篇我們就來聊聊更多關於即時動態能做到的酷炫功能吧! 上次我們提到關於 ActivityConfiguration 的設置: import SwiftUI import WidgetKit @available(iOSApplicationExtension 16.1, *) @main struct PizzaDeliveryWidget: Widget { var body: some WidgetConfiguration { ActivityConfiguration(for: PizzaDeliveryAttributes.self) { context in // 製作鎖定畫面應該顯示的畫面,這也同時支援沒有動態島的iOS裝置。 } dynamicIsland: { context in // 製作動態島顯示畫面,這部分下一章會再細說 // ... } } } 但也只有針對上半部 context 的設計去作延伸,但我相新眼尖的各位一定有發現在 closure 的下面有另外一個 context 的設定,看字面上的意思,當然就是關於動態島的設置,因為這部分的內容偏多、複雜,所以我就另外寫一篇文章來跟大家分享。 Dynamic Island 動態島 首先呢,以開發者的角度來看的話,Apple 官方在開發動態島的元件 UI 時,有列出了一些規範和不同的顯示狀況: 一.  當使用者只有一個顯示中的即時動態時,動態島會在畫面上呈現 Leading side (頭) 跟 Trailing side (尾)。 這時就只有兩側的畫面能夠顯示相關資訊,因此會建議開發者在這樣的規範下設置首要的資訊就好,以上禮拜提到的外送來繼續舉例的話,首要的資訊就是餐點的即時動態。 二.  當使用者同時有不只一個即時動態在運作的時候,兩個即時動態會以 minimal 的方式在 UI 上做互動,動態島選擇一個優先級別更高的顯示在 Leading side,而另一個會以圓形圖示展現在 trailing side 的位置。 三.  若使用者

iOS 16.1 Live Activities (即時動態) 開發上手教學 (上)

圖片
iOS 16.1 Live Activities (即時動態) 相信大家都已經習慣iOS 16一陣子了吧?在這版新增的諸多功能的確令人非常期待,包含Home screen的widgets 以及電池電量的顯示優化等等,但今天要向大家介紹的則是iOS 16.1才開始支援的Live Activities (即時動態)。 Live Activities 是一種能夠動態顯示在鎖定畫面及動態島(目前只有14 Pro & 14 Pro Max支援)的 widget,蘋果官方給予這項功能很大的設計彈性,它能讓開發者更多的去客製化自己想要展現的資訊,例如Uber 司機的即時位置狀態、Foodpanda 的外送狀態、飛機航班等等。 那廢話不多說就讓我們直接開始吧! ActivityKit 基本介紹 在介紹 ActivityKit 之前,相信大部分有實作過 widget 的開發者都對 WidgetKit 不陌生,這套在iOS 13由 Apple 官方釋出的  framework 對當時的開發者可以說是個完全新的世界,他對於 iOS 生態來說是一種全新但卻是未來不可或缺的一套 UI 工具。 那回到 ActivityKit,他和 WidgetKit 有什麼區別呢? 其實 ActivityKit 就是基於 WidgetKit 衍生出來的新 framework,他能同時支持 iOS 原本就存在的 widgets 以及即時動態的 widgets,但其中有個最明顯的差別就是 Life-cycle:Activity widget 並沒有所謂的 Time-line Provider (也就是其他widget用來更新的驅動),因此要更新 Activity widget 只能透過 app target 調用 ActivityKit 來實時更新它。 基礎設置 首先,在開始製作你的第一個 Live Activities Widget 時,請務必確認先讓你的 App 支援即時動態的權限,添加的方式是在 Info.plist 裏面添加  NSSupportsLiveActivities  並設定為 YES。 接著,File -> New -> Target -> Widget Extension 如果你是要製作有 Activity widget 的 extension 的話,記得下方的兩個