إنشاء عدّاد للنقرات

Let's build a button that counts your taps and shows the total on screen. It is the classic first taste of reactive state. 👆

Begin with a single @State property to hold the running total. We name it count and start it at zero.

Display the value with a Text view. Using string interpolation, the label always mirrors the current count.

Place a Button whose action increases the count by one. The closure runs each time you tap it.

Group the label and button in a VStack so they sit neatly one above the other. Now you have a complete tiny screen.

Tap, count changes, SwiftUI re-runs body, the Text updates. This tight cycle is the heart of every reactive SwiftUI screen.

Here is everything wired together: state, a label, and a button living inside one view.

A second button can set count back to zero. Resetting state is just another assignment, and the UI follows instantly.

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.

Add a minus button to count down. Just remember to keep the value sensible, for example never letting it drop below zero.

Notice you never call any refresh method. Changing count is all it takes; SwiftUI handles the redraw for you every single time.

In the tap counter, what makes the Text update after a tap?

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. 🎉