SwiftUI on Mike Gopsill

SwiftUI Stacks (HStack, VStack, ZStack)

Thu, 19 Jun 2025 00:00:00 +0000

SwiftUI provides three basic containers for arranging views: HStack, VStack, and ZStack. These stacks are used for creating simple and complex user interfaces. Let’s see how they work.

VStack: Arranging Views Vertically

A VStack (Vertical Stack) arranges its child views in a vertical line, one on top of the other.

Example:

VStack {
    Text("Top Item")
    Text("Middle Item")
    Text("Bottom Item")
}

This will display three text views stacked vertically.

By default, views within a VStack are centered horizontally. You can control the alignment using the alignment parameter:

SwiftUI Text View

Sun, 15 Jun 2025 00:00:00 +0000

The role of Text view in SwiftUI is to display text (funny that). It can support simple labels, rich content or dynamic text. It is the SwiftUI equivalent to UILabel. Let’s get look at it in more detail.

Creating Basic Text

Simply pass a string to the Text initialiser:

Text("Hello, SwiftUI!")

You can also use string interpolation to create dynamic text:

let userName = "Mike"
Text("Welcome back, \(userName)!")

Searchable Folders in SwiftUI

Sat, 31 May 2025 00:00:00 +0000

If you haven’t met OutlineGroup in SwiftUI yet, picture Finder’s sidebar rendered in SwiftUI: click a chevron, folder children appear. I recently tried to get this working with search. I wanted folders to open and close depending on whether the contained valid results…

After much wrestling and many coffees I gave up on OutlineGroup in favour of a tiny Node model, a ExplorerStore viewmodel, and some recursion.

The result? A searchable file‑browser that behaves at least as my mental model thinks it should.

Using Context Menu with Previews in SwiftUI

Sun, 11 May 2025 08:00:00 +0000

SwiftUI’s contextMenu modifier is a simple API that does a lot for us.

I wrote about building context menus in both UIKit and SwiftUI recently. I did not go into detail about support for the custom previews that landed in iOS 16, iPadOS 16 and macOS 13. Let us fill that gap.

Recap: Context menus in SwiftUI

A context menu is equivalent of a right-click on touch devices. Using long‑press (or Control‑click on the Mac) on a view reveals a menu of options exactly where the user needs it. In pure SwiftUI we use .contextMenu to create these menus:

How to use Context Menus in SwiftUI

Thu, 08 May 2025 00:00:00 +0000

The aim for this post to build a very simple List view. When you long-press a row you will see a classic iOS context menu. It will look a little like this:

Why Context Menus?

Context menus give users an easy way to discover secondary actions right where they’re looking. They:

Keep the primary UI clean.
Surface actions only when they’re relevant.
Feel familiar thanks to the long-press gesture we already use across iOS.

What We’ll Build

We’ll create a simple list of fruit. A long-press on any row reveals three actions: