Persisting scroll position when changing segment control in swiftUI

Question

Created Mar ’23

Replies 3

Boosts 0

Participants 2

I am using segment control in my home page. When ever I am changing segment it is reloading scroll view. I am looking something like addChild or removeChild in UIKit option so that my scroll position will not change.

struct HomeListView:View {
  @State private var favoriteColor = 0
  var body: some View {
    VStack {
      Picker("What is your favorite color?", selection: $favoriteColor) {
        Text("Red").tag(0)
        Text("Green").tag(1)
        Text("Blue").tag(2)
      }
      .pickerStyle(.segmented)
      .padding(EdgeInsets(top: 8, leading: 8, bottom: 8, trailing: 8))
      selectedView
    }
    .navigationBarTitleDisplayMode(.inline)
    .toolbar{
      ToolbarItem(placement: .navigationBarTrailing){
        CustomNavigationBar()
      }
      ToolbarItem(placement: .navigationBarLeading){
        Image(systemName: "magnifyingglass")
      }
       
    }
  }
   
  @ViewBuilder var selectedView: some View {
    switch favoriteColor {
    case 0:
       HomeViewListing()
    default:
      MostPopularView()
    }
  }
   
   
}


struct HomeViewListing:View {
  @StateObject private var viewModel = HomeViewModel()
  var body: some View {
    ScrollView {
       LazyVStack {
         ForEach(viewModel.storyItems) { item in
           StoryCell(model: item)
         }
       }
     }
     .scrollIndicators(.hidden)
  }
}

Boost

Answer 1

Claude31 OP

Mar ’23

Scroll position of what ? Picker is segmented, so no scroll… Do you mean you want to keep the selected value of the Picker ? Please show complete code (CustomNavigationBar) so that we can test.

0

Answer 2

ishteyaque OP

Mar ’23

Scroll Position of HomeViewListing after changing segment to MostPopularView. If scroll HomeViewListing to end and changing segment to MostPopularView and then again to changing to HomeViewListing so this time HomeViewListing should be end of page but it is not

0

Answer 3

ishteyaque OP

Mar ’23

struct HomeListView:View {
    @State private var favoriteColor = 0
    var body: some View {
        VStack {
            Picker("What is your favorite color?", selection: $favoriteColor) {
                Text("Red").tag(0)
                Text("Green").tag(1)
            }
            .pickerStyle(.segmented)
            .padding(EdgeInsets(top: 8, leading: 8, bottom: 8, trailing: 8))
            selectedView
        }
        .navigationBarTitleDisplayMode(.inline)
    }
    
    @ViewBuilder var selectedView: some View {
        switch favoriteColor {
        case 0:
            HomeViewListing()
        default:
            TestListingView()
        }
    }
    
    
}


struct HomeViewListing:View {
    var body: some View {
        ScrollView {
             LazyVStack {
                 ForEach(0..&lt;100) { item in
                     Text("\(item)")
                 }
             }
         }
         .scrollIndicators(.hidden)
    }
}
struct TestListingView:View {
    var body: some View {
        ScrollView {
             LazyVStack {
                 ForEach(0..&lt;100) { item in
                     Text("\(item)")
                 }
             }
         }
         .scrollIndicators(.hidden)
    }
}

Steps to reproduce

1)Scroll HomeListingView item to 98

2)Change segment control( to TestListingView)

3)Change segment control again(to HomeListingView)

Scroll position is changed now to 0 but it should be at position 98(step 1 )

0