你有冇試過，想做一個 App，但一打開 Xcode 就覺得「哇，咁多掣」？
其實入門唔一定要先啃完整個開發環境。用 Swift Playgrounds，你可以用 iPad 或者 Mac，喺一個乾淨嘅畫面入面，寫出第一個會動嘅小小 App。
呢篇會帶你做兩個例子：
- 基礎：一個計數器——撳掣，數字就加一
- 生活實用：抽籤今晚食咩——幾個選項，撳掣隨機抽一個顯示出嚟
呢篇係獨立入門文，唔使上過課都可以跟。如果你之後想再進一步，用 AI 幫手出碼、再自己改一處，可以留意我哋嘅「Swift Playgrounds × AI 寫 Apps」五節課（會做到一個叫「今日三件事」嘅小 App）。但而家，我哋先專心——讓畫面動起來。
你需要咩設備？
- iPad（建議較新嘅型號）或 Mac
- 免費的 Swift Playgrounds App（App Store 下載）
- 唔使有編程經驗；有鍵盤會舒服啲，但唔係必須
小提醒：Swift Playgrounds 入面可以開「App」類型專案，用 SwiftUI 寫介面。呢篇例子會用 SwiftUI，唔會用 UIKit。
入門步驟（先跑得通，再慢慢明白）
1. 打開 Swift Playgrounds，開一個 App 專案
打開 App 之後，揀建立新的 App（唔係舊式 Playground 頁面嗰種）。見到空白畫面同程式碼區，就啱晒。
2. 認得兩個區域
- 左邊／中間：你寫嘅 Swift 程式
- 右邊或者 Preview：App 畫面預覽
你改咗程式之後，通常會即時睇到畫面變化。如果冇更新，撳 Run（執行）一次。
3. 先貼一段完整程式，唔使一次過讀懂每一行
入門最常見嘅卡關，唔係「唔識寫」，而係「唔知邊度開始」。所以每個例子都會俾你完整可貼嘅程式：貼上 → 執行 → 睇畫面 → 再只改一處。
記住一個原則：唔使全明白，先搵錨點——邊度顯示文字、邊度有掣、邊度記住會變嘅資料。
基本操作示範：改字、執行、睇 Preview
無論你貼邊個例子，都試吓做呢三樣：
- 搵到標題嗰行 Text，改幾個字，睇 Preview 有冇變。
- 搵到掣上面嘅文字，改成你鍾意嘅說法。
- 真係撳掣／輸入，睇畫面會唔會跟住郁。
如果你改完冇反應：檢查有冇漏咗括號、有冇刪多咗行，或者重新 Run 一次。好正常，大家都係咁嚟 ^_^
例子一（基礎）：一個計數器（@State ＋ Button）
核心只有兩樣：
@State：記住「而家個數字係幾多」（好似一塊記分板）Button：撳一下，就改記分板；畫面跟住更新
把 App 專案入面嘅內容換成下面呢段完整程式（可以直接貼上）：
import SwiftUI
@main
struct CounterApp: App {
var body: some Scene {
WindowGroup {
ContentView()
}
}
}
struct ContentView: View {
// 記分板：記住目前數字
@State private var count = 0
var body: some View {
VStack(spacing: 24) {
Text("My Tiny Counter")
.font(.largeTitle)
.bold()
Text("Count: \(count)")
.font(.title)
Button("Add 1") {
count += 1
}
.buttonStyle(.borderedProminent)
}
.padding()
}
}讀碼：三個錨點
@State private var count = 0——數字記喺呢度。Button("Add 1") { count += 1 }——撳掣就令數字 +1。Text("Count: \(count)")——畫面顯示而家嘅數字。
只改一處（建議）
揀下面其中一項就得：
- 把初始數字改成
3 - 把掣文字改成
Tap me - 把
count += 1改成count -= 1（變成減一）
改完再 Run。如果你講得出「邊行負責更新」，你已經踏入寫 App 嘅門口。
想再玩多一點：加第二個掣 Reset（count = 0），或者數字到 10 就顯示 Nice!。
例子二（生活實用）：抽籤今晚食咩（Button ＋ 隨機）
計數器練熟「狀態會變」之後，試一個晚餐猶豫症真係用得着嘅小程式：預先寫好幾個選項，撳掣就隨機抽一個顯示出嚟。想睇晒有咩得揀，下面亦可列出全部選項。
呢度會用到：
@State：記住選項清單，同埋「而家抽中邊樣」Button：撳一下就隨機揀Text：顯示抽中結果- （可選）再列出全部選項，方便你知個「籤筒」入面有咩
同樣換成下面呢段完整程式：
import SwiftUI
@main
struct DinnerPickerApp: App {
var body: some Scene {
WindowGroup {
ContentView()
}
}
}
struct ContentView: View {
@State private var options = [
"🍜 拉麵",
"🍣 壽司",
"🍕 Pizza",
"🥗 沙律",
"🍛 咖喱飯"
]
@State private var picked: String? = nil
var body: some View {
NavigationStack {
VStack(spacing: 24) {
Text(picked ?? "今晚食咩好？")
.font(.title)
.bold()
.multilineTextAlignment(.center)
.padding()
Button("抽籤！") {
picked = options.randomElement()
}
.buttonStyle(.borderedProminent)
// 可選：顯示全部選項，睇吓籤筒入面有咩
List(options, id: \.self) { option in
Text(option)
}
}
.padding()
.navigationTitle("今晚食咩")
}
}
}讀碼：四個錨點
options——籤筒入面有邊幾樣（一個字串陣列）。picked——而家抽中邊樣；一開始係nil，所以先顯示提示句。Button("抽籤！")——撳完用randomElement()隨機揀一個，寫入picked。List(options…)——（可選）把全部選項列出嚟；唔想顯示可以整段刪走。
只改一處（建議）
- 改
options入面幾樣（例如改成你屋企真係會食嘅） - 改掣文字做
幫我決定！ - 改提示句
今晚食咩好？做今日午餐抽籤
想再玩多一點：加第二個掣「再抽一次」（其實同一個 randomElement() 就得）；或者抽中之後，用顏色／字級再強調結果。同一套「記住狀態 → 撳掣改狀態 → 畫面更新」，就係計數器嘅生活版。
小重點： picked 用可選型（String?），係因為一開始仲未抽。畫面用 picked ?? "今晚食咩好？"——有結果就顯示結果，冇就顯示提示。之後做抽獎、隨機温習題、隨機播放清單，都係呢條思路。
常見問題 FAQ
Q：一定要用 Mac 嗎？ A：唔一定。iPad 裝 Swift Playgrounds 就可以跟呢篇。Mac 亦得。之後如果要正式上架 App Store，先至主要用 Xcode；入門階段 Playgrounds 已經好夠。
Q：同 Xcode 有咩分別？ A：Xcode 功能齊、適合正式專案；Swift Playgrounds 介面簡單、適合學 SwiftUI 同快速試想法。你而家學到嘅 @State、Button、陣列同隨機，之後去 Xcode 都用得着。
Q：兩個例子要兩個專案嗎？ A：初學建議開一個 App 專案，先跑通計數器；想試抽籤今晚食咩就換走 ContentView（或成個檔）再貼第二段。熟咗之後，可以自己開兩個專案分開保存。
Q：點解程式要寫得咁「完整」？ A：因為 Swift Playgrounds 嘅 App 專案需要完整結構先跑得動。省略 import 或者 @main，好易一貼就紅字。入門寧願貼完整檔，再慢慢認得每一塊。
Q：我可唔可以用 AI 幫手寫？ A：可以。之後如果你上「Swift Playgrounds × AI 寫 Apps」五節課，會練習：寫清楚提示詞 → AI 出完整 SwiftUI 碼 → 你讀關鍵幾行 → 只改一處。呢篇先唔靠 AI，係想你親手感受「畫面點樣因為狀態而改變」。
Q：出現紅色錯誤點算？ A：先對吓有冇漏括號、有冇中英標點混用、有冇改爛 struct 名。仍唔得就還原返上面完整例子，再只改一處。一步一步嚟，完全 OK。
Q：抽籤今晚食咩之後可以變成咩？ A：同一條思路——「記住一啲選項，撳掣隨機改『而家結果』，畫面跟住更新」——可以變成隨機温習題、抽誰洗碗、簡易抽獎。課堂入面嘅「今日三件事」，則係另一條路：輸入＋清單；你學識狀態之後，兩條路都砌得到。
結語
寫 App 唔係一開始就要好大好靚。你今日只要做到兩件事其中一件就好：撳掣，數字會變；或者 撳掣，今晚食咩就決定咗。
從計數器到抽籤今晚食咩，你已經用真嘅 SwiftUI 概念喺度玩。有興趣再深造，就去睇「Swift Playgrounds × AI 寫 Apps」；想自己繼續摸，就把選項改成你在意嘅小事——午餐、週末去邊、隨機播邊首歌，都得。
慢慢來，我都在。你已經開始了 ^_^ 喵～