LazyVGrid and ScrollViewReader

Question

4develop OP

Created Jun ’21

Replies 2

Boosts 1

Views 2.2k

Participants 3

Is there a way to combine ScrollViewReader and LazyVGrid in order to scroll to a selected item?

It looks like ScrollViewReader only works with ONE column designs like list.

Ideally, something like this would be ideal, but does not work currently.

ScrollViewReader { scroller in        
      LazyVGrid(columns: columns) {
           ForEach(viewModel.tileArray, id: \.id) { thisTile in
                  MyTileView(viewModel: thisTile)
             }
       }
       .onAppear {
           scroller.scrollTo(viewModel.selectedTileID, anchor: nil)
         }
}

Boost

Answer 1

eth8180 OP

Sep ’21

Seconded on this question.

Did you ever find a fix? I'm trying to do the same with two rows but it doesn't want to cooperate.

0

Answer 2

mezhnix OP

Dec ’21

It works for me. I use the id modifier to set ids of LazyVGrid children. Here is my code:

ScrollView {
            ScrollViewReader { scroller in
                 LazyVGrid(columns: columns) {
                     ForEach((0..<itemCount), id: \.self) { index in
                         let someText = ...
                         Text(someText)
                             .id(index)
                     }
                 }
                 .onAppear {
                     let targetId = 10
                     scroller.scrollTo(targetId, anchor: .top)
                 }
            }
        }

2