Button and action handling in iOS Swift - UI Render Trace

Component - Button and action handling

This UI component shows a button that the user can tap. When tapped, it changes the text on the screen. It teaches how to connect a button to an action in Swift for iOS apps.

Widget Tree

UIViewController
└── UIView (main view)
    ├── UILabel
    └── UIButton

The main screen is a UIViewController with a main UIView. Inside this view, there is a UILabel at the top showing text, and below it a UIButton that the user can tap.

Render Trace - 3 Steps

Step 1: UIViewController

Step 2: UILabel

Step 3: UIButton

State Change - Re-render

Trigger:User taps the 'Press me' button

Before

UILabel text is 'Tap the button'

→

After

UILabel text changes to 'Button was pressed!'

Re-renders:UILabel updates its text; UIButton remains the same

UI Quiz - 3 Questions

What happens when the button is tapped?

A The button disappears

B The screen background changes color

C The label text changes to 'Button was pressed!'

D Nothing happens

Key Insight

In iOS Swift development, buttons use target-action pattern to handle taps. Connecting a button to a method lets the app respond immediately to user input by updating UI elements like labels.