SwiftUI, ScrollView pushing VStack images up in ZStack

Question

When I apply the scrollview it pushes my whole view up and leaves a white space below the bottom of the ZStack. Not sure why but if someone can please help.

var body: some View { ZStack{ GeometryReader { geometry in Spacer() ScrollView (.vertical, showsIndicators: false) { VStack (spacing : self.Vspacing){ Spacer() ForEach (self.buttons, id: \.self) { row in SportsButtonsRow(screenWidth: geometry.size.width, Hspacing: self.Hspacing, buttons: row, didTapButton: { sportButton in self.displayText = sportButton.title} ) }//end foreach // Spacer () }.background(Color.black)//end of VStack }//end of scroll view }//close geometry reader }//end of ZStack .edgesIgnoringSafeArea(.all) }//end of main some View

}

Asperi · Accepted Answer · 2019-12-19 08:37:11Z

You need to change the order of containers construction. The following scratch demo works:

var body: some View { ZStack{ GeometryReader { geometry in ScrollView (.vertical, showsIndicators: false) { // YOUR CONTENT HERE } .background(Color.black)//end of VStack .frame(height: geometry.size.height) //end of scroll view } //close geometry reader .edgesIgnoringSafeArea(.all) } //end of ZStack } //end of main some View

I edited the question above to have what I currently have in my project, with your recommendations. I also checked that I have Xcode 11.2 which I do have. I am getting this result seen in the picture above.

bain · Accepted Answer · 2019-12-22 22:40:44Z

I figured it out. It seems you need to designate a frame size for the scrollview so I did.

 GeometryReader { geometry in Spacer() VStack{ Text ("fdklafdfa") .foregroundColor(.blue) .frame(width: geometry.size.width, height:geometry.size.height * 0.32 , alignment: .bottom) Spacer() ScrollView (.vertical, showsIndicators: false) { VStack (spacing : self.Vspacing){ Spacer() ForEach (self.buttons, id: \.self) { row in SportsButtonsRow(screenWidth: geometry.size.width, Hspacing: self.Hspacing, buttons: row, didTapButton: { sportButton in self.displayText = sportButton.title} ) }//end foreach // Spacer () }//end of VStack }//end of scroll view .frame(width: geometry.size.width, height:geometry.size.height * 0.68 , alignment: .bottom) .edgesIgnoringSafeArea(.all) .background(Color.black) }//End of main VStack }//close geometry reader

Collectives™ on Stack Overflow

SwiftUI, ScrollView pushing VStack images up in ZStack

2 Answers 2

1 Comment

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Related