Building Expandable List with OutlineGroup & DisclosureGroup in SwiftUI 2.0

Alfian Losari
7 min readJul 22, 2020
Expandable List with OutlineGroup & DisclosureGroup in SwiftUI 2.0

Building an expandable list with nested items is quite a complex and error prone task to implement when using UITableView in UIKit. Luckily with SwiftUI 2.0, Apple introduced OutlineGroup and DisclosureGroup. With the views in our arsenal, we can build a hierarchical expandable and collapsible list with minimal lines of code using declarative syntax and reactive state management.

What We Will Build

We’re going to explore about OutlineGroup and DisclosureGroup, and how we can use them in practice to build List that represent hierarchical data in the UI by building three different kind of screens:

  1. Using List to render hierarchical data.
  2. Using OutlineGroup in List to handle multiple kind of views.
  3. Using DisclosureGroup for expandable/collapsible behavior to group of views with state binding.

You can download the completed project from the GitHub Repository.

--

--

Alfian Losari

Mobile Developer and Lifelong Learner. Currently building super app @ Go-Jek. Xcoding with Alfian at https://alfianlosari.com