JetCompose TextFieldをコピペで使う

テキストフィールドってどうやって記載するんだっけ？って時に

コピペで使えるシリーズの記事を書いてみようかと、思ったので投稿しました。

まず、画像を確認して、下にコードがあるのでコピペ

@Composable
fun TextFieldExample() {
    var text by remember { mutableStateOf("") }

    TextField(
        value = text,
        onValueChange = { newText ->
            text = newText
        },
        label = { Text("メールアドレス") }, // フローティングラベル
        placeholder = { Text("例: [e-mail]") }, // プレースホルダー
        leadingIcon = { // 先頭のアイコン
            Icon(Icons.Filled.Email, contentDescription = "メールアイコン")
        },
        modifier = Modifier.padding(16.dp)
    )
}

@Composable
fun OutlinedTextFieldExample() {
    var text by remember { mutableStateOf("") }

    OutlinedTextField(
        value = text,
        onValueChange = { newText ->
            text = newText
        },
        label = { Text("パスワード") }, // フローティングラベル
        trailingIcon = { // 末尾のアイコン (例: パスワード表示切り替えアイコンなど)
            // ここにアイコンを追加
        },
        modifier = Modifier.padding(16.dp)
    )
}