I’ve been building a few more complex layouts with nested Auto Layout frames, and I’ve noticed that things can become a little unpredictable when fixed-width elements are combined with Fill Container and Hug Contents. A small change to one element can sometimes cause several other layers to resize or shift in ways that aren’t immediately obvious.
What makes it more confusing is that the same layout can behave differently depending on how deeply the frames are nested. I understand that Auto Layout has a specific sizing logic, but when working with a larger component, it can take quite a bit of trial and error to figure out which setting is actually causing the issue.
I’m wondering how other designers usually structure complex Auto Layout components to keep the sizing predictable. Do you try to avoid mixing fixed and flexible sizing where possible, or is there a better approach for handling these kinds of layouts?