Criando um contador de toques
Atualize o estado ao tocar e observe a interface ser atualizada.
Criando um contador de toques é uma aula grátis de SwiftUI Academy no CoddyKit. Esta é a aula 3 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de SwiftUI Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de SwiftUI Academy inclui 4 aulas no total.
Partes desta aula ainda não foram traduzidas e aparecem em inglês.
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. 🎉
Aprenda Swift com um tutor de IA — grátis
Escreva e execute código real no seu navegador, obtenha ajuda instantânea de um tutor de IA 24/7 e continue de onde parou na web ou no app.
- Cursos
- 30
- Aulas
- 120
Perguntas Frequentes
A aula “Criando um contador de toques” é grátis?
Sim — o texto completo de “Criando um contador de toques” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de SwiftUI Academy, atualize para CoddyKit PRO. O curso de SwiftUI Academy inclui 4 aulas no total.
O que vou aprender em “Criando um contador de toques”?
Atualize o estado ao tocar e observe a interface ser atualizada. Você pratica SwiftUI Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.
Preciso ter experiência prévia para começar SwiftUI Academy?
Nenhuma experiência prévia é necessária. SwiftUI Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 3 de 4.
Quanto tempo leva a aula “Criando um contador de toques”?
A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.
Posso escrever e executar código nesta aula de SwiftUI Academy?
Sim. Cada aula de SwiftUI Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.
Todas as aulas deste curso
- Por que as visualizações precisam de estado
- Declarando propriedades @State
- Criando um contador de toques
- Alternando a visibilidade com estado