SwiftUI Drag & Drop で困った話

SwiftUI Drag & Drop で困った話 KAWASHIMA Yoshiyuki 【Sansan ✖ YUMEMI】iOSランチLT 2024.11.14

伝えたいこと • iOS アプリ開発は難しい

ターゲット OS は？

iOS アプリ開発は難しい

難しくしているものは何？

iOS が得意としているもの

スクラップ＆ビルド

永くメンテナンスされるものは苦手

開発期間が長いとそれだけで ミスマッチが発生しやすい

前提 iOS アプリの機能として Drag & Drop を実装することになった SwiftUI ベースで iOS 17 以上をターゲット

https://developer.apple.com/documentation/swiftui/drag-and-drop

• https://developer.apple.com/documentation/swiftui/drag-and-drop

https://developer.apple.com/documentation/swiftui/making-a-view-into-a-drag-source

• https://developer.apple.com/documentation/swiftui/making-a-view-into-a-drag-source

https://developer.apple.com/documentation/swiftui/drag-and-drop

• https://developer.apple.com/documentation/swiftui/drag-and-drop

https://developer.apple.com/documentation/swiftui/drag-and-drop

• https://developer.apple.com/documentation/swiftui/drag-and-drop

https://developer.apple.com/documentation/CoreTransferable/Transferable

• https://developer.apple.com/documentation/CoreTransferable/Transferable

https://developer.apple.com/documentation/CoreTransferable/Transferable

• https://developer.apple.com/documentation/CoreTransferable/Transferable

https://developer.apple.com/documentation/CoreTransferable/Transferable

• https://developer.apple.com/documentation/CoreTransferable/Transferable

https://developer.apple.com/documentation/swiftui/drag-and-drop

• https://developer.apple.com/documentation/swiftui/drag-and-drop

https://developer.apple.com/documentation/swiftui/drag-and-drop

• https://developer.apple.com/documentation/swiftui/drag-and-drop

https://developer.apple.com/jp/design/Human-Interface-Guidelines/drag-and-drop

• https://developer.apple.com/jp/design/Human-Interface-Guidelines/drag-and-drop

https://developer.apple.com/documentation/swiftui/view/draggable(_:)

https://developer.apple.com/documentation/swiftui/view/draggable(_:)

https://developer.apple.com/tutorials/app-dev-training/supporting-drag-and-drop/

• https://developer.apple.com/tutorials/app-dev-training/supporting-drag-and-drop/

Drag & Drop ハンドリングができない

https://developer.apple.com/documentation/swiftui/making-a-view-into-a-drag-source

• https://developer.apple.com/documentation/swiftui/making-a-view-into-a-drag-source

https://developer.apple.com/documentation/swiftui/making-a-view-into-a-drag-source

• https://developer.apple.com/documentation/swiftui/making-a-view-into-a-drag-source

https://developer.apple.com/documentation/swiftui/making-a-view-into-a-drag-source

• https://developer.apple.com/documentation/swiftui/making-a-view-into-a-drag-source

https://developer.apple.com/documentation/swiftui/view/dropdestination(for:action:istargeted:)

https://developer.apple.com/documentation/swiftui/view/dropdestination(for:action:istargeted:)

https://developer.apple.com/documentation/swiftui/view/dropdestination(for:action:istargeted:)

もう少しハンドリングしたい

https://developer.apple.com/documentation/swiftui/drag-and-drop

• https://developer.apple.com/documentation/swiftui/drag-and-drop

https://developer.apple.com/documentation/swiftui/drag-and-drop

• https://developer.apple.com/documentation/swiftui/drag-and-drop

https://developer.apple.com/documentation/foundation/nsitemprovider

• https://developer.apple.com/documentation/foundation/nsitemprovider

https://developer.apple.com/documentation/foundation/nsitemprovider

• https://developer.apple.com/documentation/foundation/nsitemprovider

https://developer.apple.com/documentation/foundation/nsitemprovider

• https://developer.apple.com/documentation/foundation/nsitemprovider

https://developer.apple.com/documentation/swiftui/view/ondrag(_:preview:)

https://developer.apple.com/documentation/swiftui/view/ondrag(_:preview:)

https://developer.apple.com/documentation/swiftui/dropdelegate

• https://developer.apple.com/documentation/swiftui/dropdelegate

DragDelegate はない

もっとハンドリングしたい

https://developer.apple.com/documentation/swiftui/dropdelegate

• https://developer.apple.com/documentation/swiftui/dropdelegate

https://developer.apple.com/documentation/swiftui/dropdelegate

• https://developer.apple.com/documentation/swiftui/dropdelegate

https://developer.apple.com/documentation/swiftui/draggesture

• https://developer.apple.com/documentation/swiftui/draggesture

https://developer.apple.com/documentation/swiftui/draggesture

• https://developer.apple.com/documentation/swiftui/draggesture

https://developer.apple.com/documentation/swiftui/draggesture

• https://developer.apple.com/documentation/swiftui/draggesture

https://developer.apple.com/documentation/swiftui/draggesture

• https://developer.apple.com/documentation/swiftui/draggesture

https://developer.apple.com/documentation/swiftui/composing-swiftui-gestures

• https://developer.apple.com/documentation/swiftui/composing-swiftui-gestures

https://developer.apple.com/documentation/swiftui/composing-swiftui-gestures

• https://developer.apple.com/documentation/swiftui/composing-swiftui-gestures

https://developer.apple.com/documentation/swiftui/composing-swiftui-gestures

• https://developer.apple.com/documentation/swiftui/composing-swiftui-gestures

https://developer.apple.com/documentation/swiftui/composing-swiftui-gestures

• https://developer.apple.com/documentation/swiftui/composing-swiftui-gestures

https://developer.apple.com/documentation/swiftui/composing-swiftui-gestures

• https://developer.apple.com/documentation/swiftui/composing-swiftui-gestures

https://developer.apple.com/documentation/swiftui/composing-swiftui-gestures

• https://developer.apple.com/documentation/swiftui/composing-swiftui-gestures

SwiftUI Drag & Drop 併用はできない API 実装 ハンドリング iOS 16 draggable/dropDestination 不要 できない iOS 14 onDrag/onDrop 一部必要 Dropはできる iOS 13 DragGesture 全て できる

SwiftUI Drag & Drop を難しくしているもの • 選択肢があって自由である • 一方でターゲット OS によっては制限がある • OS によって振る舞いが違う • API が不完全にも感じる • 問題の切り分けや判断基準が定まりにくい

OS によって異なる振る舞い • ScrollView + LazyVGrid + dropDestination • ドラッグしたアイテムをスクロールして一度フレームアウトした dropDestination にドロップができない • iOS 17.5 で発生する • iOS 18 では発生しない • Lazy をやめて Stack で組めば解消できる

まとめ • iOS アプリ開発のスコープはできる限り小さくしよう • 開発期間 • 生存期間 • 機能 • スクラップ＆ビルドを前提に計画しよう