The SwiftUI Field Guide
We built this website to visually explain how the SwiftUI layout system works, and we hope you find it useful.
To make the examples work, we ported large parts of SwiftUI’s layout system to TypeScript. While we’ve tested our implementation extensively, there might still be discrepancies between SwiftUI’s behavior and what you see here.
As a resource to learn, the approximations are more than good enough. They are excellent and by virtue of being interactive, they are also much better to get a feeling for everything than the SwiftUI documentation’s images can ever be. There’s only so much an API documentation can teach you before you need to observe how it really behaves.
Since it’s in a browser, the preview is of course even faster than Xcode Previews would be, and without the crashes. (Oh, the crashes …)
Update (2024-02-20): Chris Eidhof:
There are so many little fun details in there: the site changes color when you’re in dark mode (and the “SwiftUI” colors change, too). The code is formatted using a pretty printer, making it responsive on mobile (this isn’t perfect, but in most examples it is better than doing nothing). The more complex animations are done in “SwiftUI”.
Update (2024-03-07): Helge Heß:
I think it is still worth mentioning “The SwiftUI Lab” site, which also has a great set of articles about SwiftUI. E.g. alignment guides.
4 Comments RSS · Twitter · Mastodon
@someone
"Which makes me wonder again why people would be using Swift and SwiftUI instead of Electron to develop apps for iOS."
Because Electron apps are not allowed on iOS? Or did I miss something?
@rawbob Indeed. I confused all the apps on iOS which are basically just a WebKit view with Electron apps.
I like SwiftUI, I really appreciate the concept and where it's headed. One day it will be the defacto way to make x-plat apps.
The problem with SwiftUI is Apple's lack of care, makes it a hot dumpster fire. For instance text input in macOS apps appears to be broken for the entire Ventura release. It's great that SwiftUI can auto handle Undo for you, but changing text fields creates an Undo, even if the text doesn't change.
Things like this and the lack of urgency to do anything about them, really give SwiftUI a bad reputation. Before I decided to learn Swift & SwiftUI, every Swift dev I asked, told me to ignore SwiftUI as it was garbage.
There's a bug in one of the examples:
Application error: a client-side exception has occurred (see the browser console for more information).
but otherwise it works pretty well
It just feels like a CSS/HTML(or Java/Swing) tutorial. Which makes me wonder again why people would be using Swift and SwiftUI instead of Electron to develop apps for iOS.