Zhenyi Tan And a Dinosaur

A silhouette of a T. rex A silhouette of a person running

My SwiftUI Wishlist for WWDC

These are some SwiftUI weirdness I discovered while making History Book. I hope they get fixed at WWDC.

This list is incomplete. I only include things that seem straightforward to fix.

1. View modifiers that work as expected

I wish it is possible to change the background of a List with a .background() modifier. Xcode next to a simulator: a List with a .background(.red) modifier that has no effect on the list’s background. Yes, I’m aware of the UIKit workaround.

I also wish it is possible to change the height and width of a .sheet with a .frame(height:width:) modifier. Xcode next to an iPad simulator: a sheet with .frame(width: 100, height: 100) still filling most of the screen, with only the red text view resized. No, I’m not aware any workaround… unless you want to reimplement your own sheet.

2. Some control over the default spacing

Here’s the toolbar of the Notes app: The bottom toolbar of the Notes app, with a new-folder button on the left and a compose button on the right.

Here’s the SwiftUI replica: The SwiftUI replica of the same toolbar, which looks almost identical.

The alignment of the toolbar buttons are slightly off: The two toolbars superimposed, showing that the replica’s buttons sit slightly off from the originals.

Why? I don’t know. But if you set the maxHeight and maxWidth of the button to .infinity, you’ll notice some non-removable spacing around the button: The same toolbar with the compose button’s background in red, showing the non-removable padding around it. And no, .ignoresSafeArea() doesn’t work in this case.

Similarly, it happens to views inside NavigationLink as well: A list of navigation links with red backgrounds, each inset from the edges by spacing that can’t be removed.

I wish it is possible to ignore the spacing.

3. Miscellaneous improvements to edit mode in List

  1. The Done text should be semibold in an EditButton.

  2. The chevrons in NavigationLinks should be hidden in edit mode. (It would be even better if we have some control over the accessoryType.) Note the whacky animation of the chevrons.

  3. The items in a List should be clickable (e.g. to rename the items) in edit mode.

  4. The state of the highlighted item is buggy in a multiple-selectable List when the List enters/leaves edit mode.

  5. If the items in a List have rounded corners, the .swipeActions buttons should have rounded corners as well.

  6. Make it possible to attach a .confirmationDialog to a .swipeActions button. Compare it with the confirmation dialog in the Notes app: Notice how the delete button expands instead of disappears when the confirmation dialog shows up.