Stack views under a another centered view [duplicate]

2 weeks ago 15
ARTICLE AD BOX

I got something working with a mix of overlay and alignmentGuide (but still not ideal, cf comments below) :

ZStack { Rectangle() .fill(.blue) .frame(width: 100, height: 100) .overlay(alignment: .bottom) { VStack { Text("Title") Text("Subtitle") } .alignmentGuide(.bottom) { dimensions in dimensions[.top] } } }

Xys's user avatar

4 Comments

This only kind-of works, because the size of the overlay is constrained by the size of the view it is applied to, which is the size of the blue rectangle. The blocks in the overlay have a fixed size, so they force the VStack to overflow. But if you give the ZStack a border, you will see that it does not contain the overlay. Still, it might be sufficient as a solution for your purposes.

2026-02-23T16:57:59.897Z+00:00

You're right I had problem with text with this solution.. I had to add .fixedSize to text otherwise they were truncated even if lineLimit at 0. Do you know a better solution otherwise?

2026-02-23T17:32:21.1Z+00:00

If you're looking for a different answer then perhaps change the question, to show a more realistic scenario?

2026-02-23T17:33:28.467Z+00:00

Edited my question with text

2026-02-23T17:36:54.37Z+00:00

Read Entire Article