Set the split size of ArrangementView with splitArrangementLayoutRatio

When ArrangementView splits two views, each one gets half of the screen by default.

If you want one view to be smaller, like a cover next to an article, iOS 27.1 adds a modifier for that: splitArrangementLayoutRatio.

How to use splitArrangementLayoutRatio

Apply it to one of the views inside ArrangementView. The ratio is that view's share of the screen, from 0 to 1.

ArrangementView {
    FirstView()
        .splitArrangementLayoutRatio(idealHorizontal: 1 / 3)
} secondary: {
    SecondaryView()
}

idealHorizontal is for when the views sit side by side. Here, First View takes a third of the width and Secondary View takes the rest.

You can put the modifier on either view. Put it on the secondary view, and the secondary view gets that share instead.

You can easily support sarunw.com by checking out this sponsor.

Screenshot Studio: Create App Store screenshots in seconds not minutes.

Try it for Free

Stacked views

When the screen is taller than it is wide, ArrangementView stacks the views instead. For that, use idealVertical.

FirstView()
    .splitArrangementLayoutRatio(idealVertical: 1 / 3)

Each value only works on its own axis. idealHorizontal does nothing when the views are stacked, and idealVertical does nothing when they are side by side.

One value for both

If you want the same ratio either way, pass a single value.

FirstView()
    .splitArrangementLayoutRatio(1 / 3)

It gave 288 points wide when open and 214 points tall when folded, the same as idealHorizontal and idealVertical at 1/3.

The fold comes first

On a half-open iPhone Duo, the split always sits on the fold. The ratio is ignored.

With or without a ratio, the two views were 455 and 371 points wide, one on each side of the hinge.

They aren't equal because of the status bar, not the split.

You can easily support sarunw.com by checking out this sponsor.

Screenshot Studio: Create App Store screenshots in seconds not minutes.

Try it for Free

Things to know

• It's iOS 27.1. splitArrangementLayoutRatio, and ArrangementView itself, need iOS 27.1.
• The view doesn't grow to fit. If the content needs more space than the ratio gives, it spills out of its area. Pick a ratio that leaves enough room for your content.
• There's more than an ideal value. The full version also takes a minimum and a maximum for each axis: minHorizontal, idealHorizontal, maxHorizontal, and the same for vertical. If you want a size in points instead of a ratio, there's splitArrangementLayoutSize(minWidth:idealWidth:maxWidth:minHeight:idealHeight:maxHeight:).