Text & Input (TextField, Button)

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

TextField က user ကနေ text input လက်ခံဖို့ composable ပါ — `value`/`onValueChange` parameter ၂ ခုကို State (ယခင် lesson) နဲ့ တွဲသုံးရပါတယ် (Compose မှာ TextField က internal state မထားပါ, parent ကနေ control ရပါတယ် — controlled component pattern, React နဲ့ ဆင်တူပါတယ်)။ Button ကတော့ `onClick` lambda ကို trigger ပေးတဲ့ composable ပါ.

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

`var email by remember { mutableStateOf("") }` ရေးထားပြီး, `TextField(value = email, onValueChange = { email = it })` လို့ ရေးရင် — user ရိုက်တာနဲ့ `email` state ချက်ချင်း update ဖြစ်ပြီး, TextField ကလည်း screen ပေါ်မှာ user ရိုက်ထားတဲ့ text ကို ပြပေးပါတယ်။ 'Submit' Button ကို click ရင် `email` value ကို validate/submit လုပ်နိုင်ပါတယ်.

• TextField = user text input လက်ခံသော composable (value/onValueChange ဖြင့် state ချိတ်ဆက်)
• Button = onClick lambda ကို trigger ပေးသော composable
• TextField သည် controlled component ပါ — internal state မထား, parent ကနေ control

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

@Composable
fun LoginForm() {
    var email by remember { mutableStateOf("") }
    var password by remember { mutableStateOf("") }

    Column(modifier = Modifier.padding(16.dp)) {
        TextField(
            value = email,
            onValueChange = { email = it },
            label = { Text("Email") }
        )
        TextField(
            value = password,
            onValueChange = { password = it },
            label = { Text("Password") },
            visualTransformation = PasswordVisualTransformation()
        )
        Button(onClick = { println("Login: $email") }) {
            Text("Login")
        }
    }
}

TextField ၂ ခုမှာ ရိုက်ထည့်ပြီး Login button ကို click ရင် Logcat ထဲမှာ 'Login: <email>' ကို ပြပါလိမ့်မယ်။