徐々に増えているSwiftUI Anchor関連API

Transcript

1. 徐々に増えている SwiftUI Anchor 関連API tokizo / @tokizuoh 2025/10/10 DroidKaigi & iOSDC After Talks Night 1
2. 2 SwiftUI Anchor 使っていますか？
3. 3 SwiftUI Anchorを 使えたり、受け取るAPIは 年々増えている
4. 4 今日はいくつか 関連APIを紹介
5. rotation3DEffect (_:axis:anchor:anchorZ:perspective:) • iOS 13.0+ • Viewを指定した軸を中心に3次元で回転 • 回転の中心をAnchorで指定 5 https://developer.apple.com/documentation/SwiftUI/Vie w/rotation3DEffect(_:axis:anchor:anchorZ:perspective:)
6. 6 rotation3DEffect (_:axis:anchor:anchorZ:perspective:)
7. gridCellAnchor(_:) • iOS 16.0+ • Gridのセル内での配置をAnchorで指定 7 https://developer.apple.com/documentation/swiftui/view /gridcellanchor(_:)
8. • 左: 与えられた領域の中央寄せ • 右: gridCellAnchor を使って 全体の中央寄せ ◦ 🟥 .gridCellAnchor(.bottomLeading) ◦ 本API登場前は数ステップ必要だった i. セル内の要素のサイズ取得 ii. セルのサイズ取得 iii. セルの内側の端まで要素をoffset移動 gridCellAnchor(_:) 8
9. ViewAlignedScrollTargetBehavior (limitBehavior:anchor:) • iOS 26.0+ ◦ Anchorなし版はiOS 17.0+ • スクロール要素の端を所定の位置で停止できる ◦ scrollTargetBehavior(_:) に渡して使用 • スクロールする要素の止まる位置をAnchorで指定 9 https://developer.apple.com/documentation/swiftui/view alignedscrolltargetbehavior/init(limitbehavior:anchor:)
10. • スクロール後は一番近い要素の左端で 止まる ◦ anchor: .leading を指定 10 ViewAlignedScrollTargetBehavior (limitBehavior:anchor:)
11. 11 Anchor文脈の .leading などは何者なのか
12. 12 定義を見てみる
13. Anchorで指定できる型はUnitPoint 13
14. 相対的な値で表現されている 14
15. 15 カスタムなUnitPointを渡せば 表現の幅が広がりそう
16. 16 試しに、子要素の幅 ⅔ で スクロールを止めてみる
17. 17 子要素の幅 ⅔ でスクロールを止める
18. 18 子要素の幅 ⅔ でスクロールを止める
19. まとめ • 3つのAnchor関連のAPIを紹介した ◦ rotation3DEffect ◦ gridCellAnchor ◦ ViewAlignedScrollTargetBehavior • Anchorを受け取るAPIが増えている • AnchorはUnitPointで値を指定することでより細やかに 位置系を制御できる 19
20. 20 おわり