Padding added between the two HStacks when text is changed to image? (sample code added)

But when text is changed to image and i suddenly get the unwanted padding between upper and bottom HStack, Anyone know the reason.

Please paste the both code and run, any help is appreciated 🙂 Thank you

Both code samples added below as "Example code 1" and "example code 2"

:: EXAMPLE CODE 1 - with only Text("Hello") in the both HStacks, NO space is added between upper Hstack and bottom HStack :::


import SwiftUI


struct View2: View {

var body: some View {

VStack {

HStack {

Text("Hello")

}

.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity)

.foregroundColor(.white)

.background(Color.orange)

HStack {

Text("Hello")

}

.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity)

.foregroundColor(.white)

.background(Color.gray)

} // END: VStack

}// END: body

} // END: View2


struct View2_Previews: PreviewProvider {

static var previews: some View {

View2()

}

}



:: EXAMPLE CODE 2 - with image insted af text in the bottom Hstack a 10px space is added between forst Hstack and second one, Why? :::


import SwiftUI


struct View2: View {

var body: some View {

VStack {

HStack {

Text("Hello")

}

.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity)

.foregroundColor(.white)

.background(Color.orange)

HStack {

Image("Wood")

.resizable()

.frame(width: 42.0, height: 42.0)

}

.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity)

.foregroundColor(.white)

.background(Color.gray)

} // END: VStack

}// END: body

} // END: View2


struct View2_Previews: PreviewProvider {

static var previews: some View {

View2()

}

}

I could reproduce.


If you grow the image frame large enough,

                   .frame(width: 442.0, height: 442.0)

then the gap is hidden because image overlaps the top.


At first look, it seems that defining 2 frames may be causing the problem


                HStack {
                    Image("Wood")     @// I had to include my own image
                    .resizable()
                    .frame(width: 42.0, height: 42.0)
                }
                .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity)

Anyway, you'd better move your question to SwiftUI section.

Padding added between the two HStacks when text is changed to image? (sample code added)
 
 
Q