SwiftUI Academy · Pelajaran

Item Tab dan Lencana

Tambahkan ikon, judul, dan lencana notifikasi.

Item Tab dan Lencana adalah pelajaran SwiftUI Academy gratis di CoddyKit. Ini adalah pelajaran 2 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.

Polishing Each Tab

Now you will make each tab clearer with the right icon, a short title, and a notification badge when needed. 🎨

Icons with SF Symbols

Pass an SF Symbol name to Label so each tab gets a crisp, scalable icon that matches the system style.

Label("Profile", systemImage: "person.crop.circle")

Keep Titles Short

Tab titles sit in a tight space, so keep them to one clear word like Home, Search, or Profile.

Selected vs Unselected

iOS automatically highlights the active tab. Many symbols even swap to a filled variant when selected, with no code from you.

Choosing Good Symbols

Pick symbols whose meaning is obvious. A house for home and a gear for settings need no explanation.

What a Badge Shows

A badge is the small red bubble on a tab that signals unread items, like new messages waiting for you. 🔴

Adding a Number Badge

The badge modifier puts a count on a tab. Pass a number and the bubble appears automatically.

InboxScreen()
    .tabItem { Label("Inbox", systemImage: "tray") }
    .badge(3)

Text Badges

You can also pass a string to badge, useful for short markers like "New" instead of a count.

.badge("New")

Hiding a Badge

Set the badge to zero or an empty value and SwiftUI hides the bubble, so it appears only when it matters.

.badge(unreadCount)

Driving Badges from State

Bind the badge to a state value so the count updates live as new items arrive or get read.

Badges Demand Attention

Use badges sparingly. A bubble pulls the eye, so reserve it for things the user truly needs to notice. 👀

Quick Check

Let us check how to show an unread count on a tab.

Recap: Tab Items & Badges

Clear icons and short titles make tabs scannable, and the badge modifier surfaces counts or markers right when users need them. 🎉

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Item Tab dan Lencana” gratis?

Ya — teks lengkap “Item Tab dan Lencana” 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 “Item Tab dan Lencana”?

Tambahkan ikon, judul, dan lencana notifikasi. 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 2 dari 4.

Berapa lama pelajaran “Item Tab dan Lencana” 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