

When SwiftUI lays out the HStack it does so by dividing the available space, minus the spacing, by the number of children. infinity which means the frame wants to be as big as possible. In my example I’ve set a maximum width of. All of these parameters have default values. A flexible frame takes a long list of parameters to set a minimum, ideal and maximum width and height. This was not obvious to me, perhaps because using a frame was always something to avoid with Auto Layout. When the preferredContentSizeCategory changes to an accessibility size I switch the axis of the horizontal stack views to vertical and adjust the alignment and distribution:įor stackView in rowStackViews To adapt the layout when the content text size increases I implemented the traitCollectionDidChange method in the view controller. I embedded the vertical stack view in a scroll view pinned to the root view.I embedded the horizontal stack views in a vertical stack view that has a center alignment and fill distribution.Importantly it uses a fill equally distribution which centers the two labels in the view. Each row has a horizontal stack view that contains the two labels.

A couple of stack views make short work of this layout: As the text size increases the whole view has to scroll. On the right, the layout has adapted to a larger text size by arranging each row vertically. Each row has a field label and value positioned to the left or right of the view center. On the left, the layout is at the default large text size and arranged as a vertical stack of horizontal rows. Here’s a layout that I thought would be easy showing some details about a country. This has been somewhat random as I didn’t have the experience to know what would be easy and what would be difficult with SwiftUI. I’ve been practising with SwiftUI by rebuilding layouts that I’ve already built with UIKit. The layout must also adapt for accessibility text sizes. Here’s an example where I wanted the equivalent of a UIKit stack view with an equal distribution to give views equal width. Getting to grips with SwiftUI view layout, when you’re used to UIKit, requires thinking a little different.
