An Accordion View in Swift and UIKit

Involving constraints

Photo by Charlie Solorzano on Unsplash

Difficulty: Beginner | Easy | Normal | Challenging

This article has been developed using Xcode 12.4, and Swift 5.7.2

Prerequisites:

You need to be able to code in Swift, perhaps using Playgrounds

UIKit isn’t dead. Not around these parts at least.

In web design, an accordion is a type of menu that displays a list of headers stacked on top of one another. When clicked on (or triggered by a keyboard interaction or screen reader), these headers will either reveal or hide associated content.

I’m calling this ‘appearing view’ an accordion. I really hope that this doesn’t upset too many readers of this development blog!

Something which looks something like this:

My process

I thought about having an animated view within a UITableView, but once I started to think about it (for the purposes of this blog at least) that felt a little like overkill. A better approach for me would be simply to hide a view and make it appear when the user taps ‘more…