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