SwiftUI Academy · Pelajaran

Membuat Tombol yang Dapat Diketuk

Buat Button dengan label dan tindakan.

Membuat Tombol yang Dapat Diketuk adalah pelajaran SwiftUI Academy gratis di CoddyKit. Ini adalah pelajaran 1 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar SwiftUI Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus SwiftUI Academy mencakup 4 pelajaran total.

Bagian dari pelajaran ini belum diterjemahkan dan ditampilkan dalam bahasa Inggris.

Why Buttons Matter

Most apps come alive when you tap something. A Button is the simplest way to let people trigger an action in SwiftUI. 👆

The Button View

A Button is just a view, like Text or Image. You place it in your body and SwiftUI draws a tappable control for you.

Button("Tap me") {
    print("Tapped!")
}

Two Parts of a Button

Every button has two parts: a label that you see, and an action that runs when you tap it. Both are required.

The Simple Title Form

The quickest button takes a title string first and the action closure second. SwiftUI turns the string into a Text label for you.

Button("Save") {
    saveDocument()
}

The Action Closure

The braces hold the action closure. Whatever code you write inside runs once each time the button is tapped, and not before.

Button("Greet") {
    print("Hello there")
}

A Custom Label

Need more than text? Use the label form: pass an action, then a closure that returns any view you like for the look.

Button {
    likePost()
} label: {
    Image(systemName: "heart")
}

Labels Can Be Rich

Because the label is a view, you can combine an icon and text together inside a stack for a friendlier, clearer tappable area.

Button {
    addItem()
} label: {
    Label("Add", systemImage: "plus")
}

Buttons Live in the Body

A button goes inside your view's body, just like any other view. SwiftUI handles drawing it and listening for taps automatically.

var body: some View {
    Button("Continue") {
        goNext()
    }
}

The Tap Target

The whole label area is tappable, so a bigger label is easier to hit. Apple suggests a comfortable tap target of about 44 points.

Calling a Function on Tap

Keep the closure tidy by calling a function instead of cramming logic inline. The action just points to the work you defined elsewhere.

Button("Refresh") {
    reloadData()
}

No Tap, No Action

The action does not run when the screen loads. It waits patiently and only fires on tap, which keeps your view predictable.

Quick Check

Let's make sure the button basics clicked.

Recap

Nice work! A Button pairs a label you see with an action that runs on tap. Use the simple title form or a custom label view. ✨

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Membuat Tombol yang Dapat Diketuk” gratis?

Ya — teks lengkap “Membuat Tombol yang Dapat Diketuk” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus SwiftUI Academy, upgrade ke CoddyKit PRO. Kursus SwiftUI Academy mencakup 4 pelajaran total.

Apa yang akan aku pelajari di “Membuat Tombol yang Dapat Diketuk”?

Buat Button dengan label dan tindakan. Kamu berlatih SwiftUI Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.

Apakah aku perlu pengalaman untuk memulai SwiftUI Academy?

Tidak diperlukan pengalaman sebelumnya. SwiftUI Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 1 dari 4.

Berapa lama pelajaran “Membuat Tombol yang Dapat Diketuk” memakan waktu?

Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.

Bisakah aku menulis dan menjalankan kode dalam pelajaran SwiftUI Academy ini?

Ya. Setiap pelajaran SwiftUI Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.

Semua pelajaran dalam kursus ini

← Kembali ke SwiftUI Academy