Creare un contatore dei tocchi
Aggiornare lo stato al tocco e osservare l'aggiornamento dell'interfaccia.
Creare un contatore dei tocchi è una lezione SwiftUI Academy gratuita su CoddyKit. Questa è la lezione 3 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento SwiftUI Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso SwiftUI Academy include 4 lezioni in totale.
Parti di questa lezione non sono ancora state tradotte e vengono mostrate in inglese.
The Goal: A Live Counter
Let's build a button that counts your taps and shows the total on screen. It is the classic first taste of reactive state. 👆
Start with State
Begin with a single @State property to hold the running total. We name it count and start it at zero.
@State private var count = 0Show the Count
Display the value with a Text view. Using string interpolation, the label always mirrors the current count.
Text("Taps: \(count)")Add the Button
Place a Button whose action increases the count by one. The closure runs each time you tap it.
Button("Tap me") {
count += 1
}Stack Them Together
Group the label and button in a VStack so they sit neatly one above the other. Now you have a complete tiny screen.
VStack {
Text("Taps: \(count)")
Button("Tap me") { count += 1 }
}Watch the Loop
Tap, count changes, SwiftUI re-runs body, the Text updates. This tight cycle is the heart of every reactive SwiftUI screen.
The Full View
Here is everything wired together: state, a label, and a button living inside one view.
struct CounterView: View {
@State private var count = 0
var body: some View {
VStack {
Text("Taps: \(count)")
Button("Tap me") { count += 1 }
}
}
}Add a Reset
A second button can set count back to zero. Resetting state is just another assignment, and the UI follows instantly.
Button("Reset") { count = 0 }Format the Label
You can pluralize or style the text based on count. The label is a function of state, so any logic you add stays in sync.
Text(count == 1 ? "1 tap" : "\(count) taps")Decrement Too
Add a minus button to count down. Just remember to keep the value sensible, for example never letting it drop below zero.
Button("-") { if count > 0 { count -= 1 } }No Manual Refresh
Notice you never call any refresh method. Changing count is all it takes; SwiftUI handles the redraw for you every single time.
Quick Check
In the tap counter, what makes the Text update after a tap?
Recap
You built a tap counter with one @State value, a Text that reads it, and a Button that mutates it. Change the data and the UI updates itself. 🎉
Domande Frequenti
La lezione «Creare un contatore dei tocchi» è gratuita?
Sì — il testo completo di «Creare un contatore dei tocchi» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso SwiftUI Academy, passa a CoddyKit PRO. Il corso SwiftUI Academy include 4 lezioni in totale.
Cosa imparerò in «Creare un contatore dei tocchi»?
Aggiornare lo stato al tocco e osservare l'aggiornamento dell'interfaccia. Eserciti SwiftUI Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.
Ho bisogno di esperienza per iniziare SwiftUI Academy?
Non è richiesta alcuna esperienza precedente. SwiftUI Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 3 di 4.
Quanto tempo richiede la lezione «Creare un contatore dei tocchi»?
La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.
Posso scrivere ed eseguire codice in questa lezione SwiftUI Academy?
Sì. Ogni lezione SwiftUI Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.
Tutte le lezioni di questo corso
- Perché le view hanno bisogno dello stato
- Dichiarare proprietà @State
- Creare un contatore dei tocchi
- Mostrare e nascondere con lo stato