Buttons

Part of the Introduction to SwiftUI section of Coddy's Swift journey. Lesson 19 of 50.

A Button shows a label and runs an action when it is tapped. The shortest form takes a title and a closure:

Button("Sign in") {
    // runs when the button is tapped
}

For a custom label, pass the action first and build the label in a second closure:

Button {
    // action
} label: {
    Label("Add to cart", systemImage: "cart")
}

.buttonStyle(.borderedProminent) gives a filled button, and role: .destructive marks an action that deletes something, which shows it in red:

Button("Delete", role: .destructive) {
    // delete
}

Challenge

Beginner

Replace the text with a Button titled Order coffee. Its action can stay empty for now. Give it the .borderedProminent button style.

Try it yourself

import SwiftUI

@main
struct CoddyApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

Test yourself

This lesson includes a short quiz. Start the lesson to answer it and track your progress.

All lessons in Introduction to SwiftUI

1Introduction

4Modifiers

7Lists

10Project - Coddy Coffee

2Showing Content

5State & Buttons

8Navigation

11Final Challenges

3Stacks & Layout

6User Input

9Sharing Data

Practice on your own: Swift playground