Upgrade to Pro — share decks privately, control downloads, hide ads and more …

iOS17のScrollViewはちょっとできる子

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
Avatar for toya108 toya108
September 06, 2024
19

 iOS17のScrollViewはちょっとできる子

Avatar for toya108

toya108

September 06, 2024
Tweet

Transcript

  1. こんにちは 👋 • クックパッド 所属の • ボルダリング が好きな • 1児の父(もうすぐ

    2児) として覚えてもらえると嬉しいです toya108 / Toya Niibori
  2. ScrollView { LazyVStack { ForEach(items) { item in ItemView(item: item)

    } } } .ignoresSafeArea() 子Viewのサイズを ScrollViewのコンテナサイズにしたい iOS16まではGeometryReaderなしで子Viewに対し 親Viewのサイズに依存したサイズを指定する術がなかった
  3. ScrollView { LazyVStack(spacing: 0) { ForEach(items) { item in ItemView(item:

    item) .containerRelativeFrame([.horizontal, .vertical]) } } } containerRelativeFrame(_:alignment:) GeometryReaderなしでコンテナのサイズを指定可能に👍 ※GeometryReaderの使用を否定したいわけではない。今回の要件ではより 簡単に使用できるcontainerRelativeFrame(_:alignment:)に軍杯が上がると思う。
  4. scrollTargetLayout(isEnabled:) ScrollView { LazyVStack { ... } .scrollTargetLayout() } .scrollTargetBehavior(.viewAligned(limitBehavior:

    .always)) viewAlignedを使う場合は基準となるViewを指定する必要がある。 .scrollTargetLayout(isEnabled:)で指定することができる。
  5. @State var scrollPosition: Int? = 0 var body: some View

    { ScrollView { ... } .scrollPosition(id: $scrollPosition) } scrollPosition(id:anchor:) スクロールによって表示されるViewのIDをbindできる。