SwiftUI 新互動:用 reorderable 與 swipe actions 少寫一大段自訂拖放
這支短片濃縮 WWDC26 SwiftUI 更新:重新排序不再只屬於 List,swipe actions 也能放到自訂容器;完整 session 則把它放在 document、toolbar、performance 與 state lazy initialization 的大脈絡裡。
SwiftUI 這次把常見互動從「自己拼 drag/drop 與 row gesture」推回 framework primitive:先用系統容器能力,再把產品心力放在資料 identity、工具列適應與狀態測試。
短片背後是四個 SwiftUI app 實務問題
自訂 grid / stack 也需要可排序
短片提到 `.reorderable()` 放在 `ForEach`,父層加 `.reorderContainer()`。價值是讓 grid、stack、section 也能得到拖曳排序與 lift/drop animation,而不是每個 app 自己維護 gesture 狀態。
Swipe actions 不該被 List 綁住
把 `.swipeActions()` 加在 row,再把 `.swipeActionsContainer()` 放到 scrollable container,讓自訂 row 也能提供刪除、封存或狀態切換等快速動作。
工具列要能隨尺寸退讓
完整 session 補充 toolbar visibility priority、overflow menu container 與 pinned trailing placement,重點是 resizable iOS / iPad / Mac 視窗下,重要動作仍要可見。
互動流暢度來自少做不必要工作
SwiftUI 同步改善 nested stack layout、AsyncImage HTTP caching、Observable state lazy initialization。互動 API 變簡單後,資料與狀態設計反而更不能混亂。
導入時不要只替換 modifier,要檢查資料模型
先確認 item identity 穩定
排序和 swipe 都會放大 identity 問題。`ForEach` 的 id、資料來源更新、刪除後 animation 與 persisted order 必須先定義清楚。
把可排序範圍限制在正確容器
不要讓 drag target 跨過不該排序的 section。先決定是整個 scroll view、一個 section,還是單一 grid 可排序。
將 swipe action 做成可撤銷或可復原流程
刪除、封存、取消收藏這類動作不只是一個 modifier,還要處理 undo、同步失敗、離線 queue 與 accessibility label。
用多尺寸 preview 測 toolbar 與 gesture 衝突
同一套 UI 在 iPhone Mirroring、iPad split view、Mac 視窗縮放下會有不同空間壓力;重要按鈕要測縮到極端尺寸時是否仍可被找到。
重點 1:reorderable containers 是把自訂互動還給系統
以往 List 以外的 grid / stack 排序常會演變成自訂 drag gesture、drop target、placeholder、動畫與資料同步。WWDC26 的 SwiftUI 更新讓常見排序模式可以用 `.reorderable()` 與 `.reorderContainer()` 表達,讓 SwiftUI 處理 lift、drop 與容器內移動。
這不代表所有拖放都變簡單。只要排序結果會寫入 server、跨 section、影響權限或牽涉多人同步,仍要把 persistence、conflict resolution 與 error recovery 設計好。
重點 2:swipe actions 進入自訂容器後,row 設計要更一致
當 swipe actions 可放在自訂 row,產品就更容易在卡片列表、水平 scroller 或自製 layout 裡加入快速操作。風險是同一 app 裡可能出現太多不一致手勢:有些 row 可 swipe、有些只能長按、有些按鈕外露。
實務上應先整理 action taxonomy:哪些是 destructive、哪些是 reversible、哪些需要確認、哪些要支援鍵盤或 context menu。SwiftUI 提供容器 primitive,但互動語言仍要由 app 保持一致。
重點 3:完整 session 的訊號不只互動,也包含 app scale
Apple 官方「What's new in SwiftUI」同時談新的 Document protocol、direct disk access、snapshot-based diffing、toolbar adaptation、AsyncImage caching 與 lazy state initialization。這些主題指向同一件事:SwiftUI 不只處理小畫面,也正在補大型、可縮放、資料密集 app 的基礎能力。
來源
主要來源:Apple Developer YouTube short「New capabilities in SwiftUI」、Apple Developer 官方 session「What's new in SwiftUI」與「Platforms State of the Union」。
- →SwiftUI 新增 reorderable container pattern,讓 grid / stack 的拖曳排序更接近系統能力。
- →Swipe actions 進入任意容器後,互動一致性、destructive action 與復原流程要重新盤點。
- →Toolbar adaptation、Document API、AsyncImage caching 與 lazy state initialization 顯示 SwiftUI 正在補大型 app 的基礎能力。
- →導入前先檢查 item identity、資料同步與多尺寸 layout,不要只把 modifier 加上去。