SwiftUI Basics

ခဏလေး ဒီလိုပဲ စဉ်းစားကြည့်

အရင်တုန်းက iOS UI ကို UIKit (imperative, 'ဒီ view ကို ဒီလို update လုပ်ပါ' ဆိုတဲ့ ပုံစံ) ဒါမှမဟုတ် Storyboard (visual drag-and-drop) နဲ့ ရေးရပါတယ်။ SwiftUI ကတော့ declarative UI framework ပါ — `View` protocol ကို conform လုပ်ထားတဲ့ struct ထဲမှာ 'UI ဘယ်လို ပုံစံ ဖြစ်စေချင်တယ်' ဆိုတာကို Swift code နဲ့ တိုက်ရိုက် ရေးပါတယ်, data ပြောင်းလဲတိုင်း SwiftUI က UI ကို automatic re-render ပေးပါတယ် — Android ရဲ့ Jetpack Compose concept နဲ့ တူညီပါတယ် (ဒီ site ရဲ့ Android tutorial ဖတ်ဖူးရင် ချက်ချင်း ရင်းနှီးမှာပါ).

လက်တွေ့ scenario နဲ့ ချိတ်ကြည့်မယ်

`struct Greeting: View { let name: String; var body: some View { Text("Hello, \(name)!") } }` လို့ ရေးလိုက်ရင်, `Greeting(name: "Aye Aye")` ကို ခေါ်တာနဲ့ 'Hello, Aye Aye!' ဆိုတဲ့ text ကို screen ပေါ် ပြပေးပါတယ်။ Xcode ရဲ့ `#Preview` macro ကို ထည့်ရင် Simulator run စရာ မလိုဘဲ UI ကို ချက်ချင်း ကြည့်လို့ရပါတယ်.

• SwiftUI = Apple ရဲ့ modern declarative UI framework (UIKit imperative style မလို)
• View protocol = UI component ကို describe လုပ်သော struct
• Data ပြောင်းရင် SwiftUI က UI ကို automatic re-render ပေး

အတူတူ ကြည့်မယ်

import SwiftUI

struct Greeting: View {
    let name: String

    var body: some View {
        Text("Hello, \(name)!")
    }
}

#Preview {
    Greeting(name: "Aye Aye")
}

Xcode Preview panel ထဲမှာ 'Hello, Aye Aye!' ဆိုတဲ့ text ကို Simulator run စရာမလိုဘဲ ချက်ချင်း တွေ့ရမည်။