SwiftUI extend or recalculate VStack height when children views extend

474 Views Asked by At

I have a scrollview that holds "cards" with weather details of locations and the cards extend to show more information when tapped.

I have to use a LegacyScrollView so that the bottomsheet that encompasses the scrollview gets dragged down when the the scroll is at the top.

I can't figure out how to extend the VStack when one of the cards extend. Is there a way to make a GeometryReader or VStack recalculate the needed height to hold all of the views?

I start off with the minHeight set to the window size so when the 1st card is extended, it all shows, but 2 or more extend past the LazyVStack window and get cut off.

If the minHeight on the LaxyVStack isn't set to 0, the cells expand from the middle and their tops get cut off. When it's set to 0, the cells expand downward as desired.

GeometryReader { proxy in
  LegacyScrollView(.vertical, showsIndicators: false) {
    Spacer(minLength: 40)
    LazyVStack(spacing: 0) {
      ForEach(mapsViewModel.placedMarkers, id: \.id) { _placeObject1 in

        InfoCell(placeObject: _placeObject1)
          .environmentObject(mapsViewModel)
          .frame(alignment: .top)

        Divider().foregroundColor(.white)
      }
    }
    .cornerRadius(25)
    .frame(minHeight: 0, alignment: .top) 
    }
    .onGestureShouldBegin{ pan, scrollView in
      scrollView.contentOffset.y > 0 || pan.translation(in: scrollView).y < 0
    }
    .onScroll{ test in
      print(test.contentOffset.y)
    }
    .padding(.top, 30) //padding for top of list                  
}

and the cell's code is :

struct InfoCell: View {
    @StateObject var placeObject: PlaceInfo

    @State var expandCell = false

    var body: some View {
        VStack(alignment: .center, spacing: 0) {

            //blahblah
            
            if expandCell {
                CellExpanded(placeObject: placeObject, isFirstInList: true)   
            }
        }
        .frame(maxWidth: .infinity)
        .onTapGesture {
            withAnimation { expandCell.toggle() }
        }  
    }
}

and the expand code:

struct InfoCellExpanded: View {
    @State var forecast = "Daily"
    var placeObject: PlaceInfo
    var isFirstInList: Bool
    
    var body: some View {
        VStack {
           //blah
        }
        .padding(.horizontal, 10)
        .padding(.bottom, 20)
    }
}
0

There are 0 best solutions below