How to fix padding in ZStack

Question

I have ZStack with two views one of which can be shown due to the condition:

ZStack{
            VStack{
                ...
            }.padding(.all,17)
            
            if handler.bottomVisible {
                BottomSheetView(handler: handler, player: true)
            }
        }

but when I uncomment these lines:

if handler.bottomVisible {
    BottomSheetView(handler: handler, player: true)
}

my .padding(.all,17) for VStack becomes damaged. Without this view, everything looks ok, but after adding the second child view for ZStack UI doesn't see paddings for VStack. Maybe I did smth wrong?

Example without bottom sheet:

and with the activated condition:

@Asperi, which details do you need? I thought that this info is enough :( — Andrew, Sep 30 '21 at 06:43
seems like your `BottomSheetView` which is on top, covers the padding area of your VStack. add a minimal reproducible example. — YodagamaHeshan, Sep 30 '21 at 07:31
As a minimal reproducible example, in this case, you can provide different images of the layouts, so that the differences can be seen visually. — cedricbahirwe, Sep 30 '21 at 07:32
@cedricbahirwe, thank you for your response, I couldn't understand what I needed to add :) — Andrew, Sep 30 '21 at 07:35
@Yodagama, first one, I need to save paddings but also need to have bottom view too. Together I can't unite them — Andrew, Sep 30 '21 at 07:43
You should look into your `BottomSheetView` size (frame), It looks like It might have a bigger size than the parent's available space. — cedricbahirwe, Sep 30 '21 at 08:30

score 1 · Accepted Answer · answered Sep 30 '21 at 11:47

Well hard to answer your question because there is not so much code but you can try...

VStack(alignment: .leading) {

....
} .padding()

or you add the padding (.all, 17) information to all your textfields like

VStack{
    Text("Hello Stackoverflow")
    .padding(.all,17)
}

How to fix padding in ZStack

1 Answers1