SwiftUI Inspectorが難しすぎる / Mobile Act OSAKA 18

Mobile Act OSAKA 18
https://mobileact.connpass.com/event/383587/

Transcript

1. SwiftUI Inspectorが 難しすぎる id:yutailang0119 / @yutailang0119 2026/03/06 Mobile Act Osaka 18 1
2. yutailang0119 • 株式会社はてな ◦ @京都オフィス ◦ アプリケーションエンジニア ◦ サービスプラットフォームチーム • try! Swift Tokyo Organizer ◦ 2026チケット販売中 • AVP座談会 🥽 2
3. 3 SwiftUI Inspector
4. 4 macOS 26.3
7. 7 iPadOS 26.2 (w/ Xcode 26.3)
10. 10 iOS 26.2 (w/ Xcode 26.3)
13. 13 SwiftUI inspector(isPresented:content:)
14. inspector(isPresented:content:) • Navigationコンポーネントとpresentation両方 の性質を持つ • 高度な抽象化（単なるサイドバーではない） ◦ 画面サイズが小さい（コンパクト） >「シート」 ◦ 大きなiPadの分割画面 > 「オーバーレイ」 • iOS 17.0+, iPadOS 17.0+, Mac Catalyst 17.0+, macOS 14.0+ 14
15. 15 今回のお題
16. 今回のお題 16 • inspector(isPresented:content:) を使用 • inspector、toolbarの配置を試す
17. 17 ① Inside navigation
18. ① Inside navigation 18 struct Inspectors: View { @State private var isPresented: Bool = false var body: some View { NavigationStack { RootView() .toolbar { Toggle(isOn: $isPresented) } .inspector(isPresented: $isPresented) {} } } }
20. 20 Inspector内で NavigationLinkする と...
21. Inspector内でNavigationLink 21 struct Inspectors: View { var body: some View { NavigationStack { RootView() .toolbar { Toggle(isOn: $isPresented) } .inspector(isPresented: $isPresented) { NavigationStack { NavigationLink() } } } } }
25. Inside navigationの課題 25 • Inspector内のNavigationLinkが外側で実 行 ◦ 別NavigationStackのスコープ外 ◦ コンパクトレイアウトでは、裏側で遷移してしまう • Inspector内の実装が外側に巻き上げられる ◦ NavigationLink ◦ Modifier
26. Inspectorの巻き上げ 26 • 巻き上げられる ◦ seachable ◦ toolbar ◦ ... • 巻き上げられない ◦ refreshable ◦ ...
28. 28 ② Outside navigation
29. ② Outside navigation 29 struct Inspectors: View { @State private var isPresented: Bool = false var body: some View { NavigationStack { RootView() .toolbar { Toggle(isOn: $isPresented) } } .inspector(isPresented: $isPresented) {} } }
32. Outside navigationの注意点 32 • Inspector表示用のtoolbarをInspector側 に置けない ◦ 操作できなくなる
33. Outside navigationの注意点 33 struct Inspectors: View { var body: some View { NavigationStack { RootView() } .inspector(isPresented: $isPresented) { NavigationStack { Inspector() .toolbar { Toggle(isOn: $isPresented) } } } } }
36. 36 Inspector Placement
37. 37 https://developer.apple.com/videos/play/wwdc2023/10161/
38. まとめ 38 • InspectorはNavigationとToolbarとの組 み合わせで配置を考える • Inspector内で凝った実装をしない！ ◦ NavigationLink ◦ searchable ◦ ...
39. 39 ところで現代... Inspectorの使用箇所 減っていません...？
40. 40 Keynote 15.1.1 on iPadOS 26.3.1
41. iOS 26ではFullモーダルに変更 41 iOS 18.6 iOS 26.2
42. 42 Liquid Glass時代の Inspector...
43. References 43 • https://developer.apple.com/documentation/SwiftUI/View/insp ector(isPresented:content:) • https://developer.apple.com/videos/play/wwdc2023/10161/ • https://www.createwithswift.com/presenting-an-inspector-wit h-swiftui/
44. 44 Advertisement
46. try! Swift Tokyo 2026 • 2026/04/12 (日) - 14 (火) • 立川ステージガーデン • https://tryswift.jp/ 46
47. hatena.co.jp/recruit 47 47