Skip to content

SwiftUI: Sheet (Modals)

To present modally (cover up the previous screen) in SwiftUI, you can always opt for Sheet.

Presents a sheet when a given condition is true.

Apple Documentation

In this tutorial, you’ll learn what it takes to build a Sheet in SwiftUI. You’ll learn:

  • How to build a Sheet from scratch.

Prerequisites

To follow along this tutorial, you’ll need some basic knowledge in:

  • A basic familiarity with Swift.
  • At least Xcode 11

Sheet

Sheet can be presented with multiple different condition either through a Bool or an Identifiable. You will be building with an Identifiable.

First, you will create an Identifiable struct to hold the data.

Once you have above created, go ahead and create a State var for the data.

You will then create a new View below the default ContentView. DetailSheet is a new View. Here the DetailSheet shows a Text and a Button which handles the dismiss.

Inside the default view of ContentView, you will now configure to show the Sheet with a button. And this is also the place where you can configure the kind of text you would like it to show.

As a result, you will be able to see a working sheet with Identifiable.

Where to go From Here

If you feel like you are ready to take on more challenges, feel free to check out some other tutorials that we have created:

Published inSwiftUI

One Comment

  1. Dima Dima

    Hi! Thanks for an awesome tut!
    How I can bind values from input in this sheet after selection?

Leave a Reply

Your email address will not be published. Required fields are marked *

Copyright © DaddyCoding 2020.