Jetpack Composeの自動入力サンプル

LoginForm.kt

@OptIn(ExperimentalMaterial3Api::class, ExperimentalComposeUiApi::class)
@Composable
fun LoginForm() {
    var loginId by remember { mutableStateOf("") }
    var password by remember { mutableStateOf("") }
    val loginIdAutofillNode = AutofillNode(
        autofillTypes = listOf(AutofillType.Username, AutofillType.EmailAddress),
        onFill = { loginId = it }
    )
    val passwordAutofillNode = AutofillNode(
        autofillTypes = listOf(AutofillType.Password),
        onFill = { password = it }
    )
    val autofill = LocalAutofill.current
    val autofillTree = LocalAutofillTree.current
    autofillTree += loginIdAutofillNode
    autofillTree += passwordAutofillNode
    Column(
        modifier = Modifier
            .wrapContentHeight()
    ) {
        OutlinedTextField(
            placeholder = { Text("ログインID") },
            value = loginId,
            onValueChange = {
                loginId = it
            },
            keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Email),
            modifier = Modifier
                .onGloballyPositioned {
                    loginIdAutofillNode.boundingBox = it.boundsInWindow()
                }
                .onFocusChanged { focusState ->
                    if (focusState.isFocused) {
                        autofill?.requestAutofillForNode(loginIdAutofillNode)
                    } else {
                        autofill?.cancelAutofillForNode(loginIdAutofillNode)
                    }
                },
        )
        OutlinedTextField(
            placeholder = { Text("パスワード") },
            value = password,
            onValueChange = {
                password = it
            },
            visualTransformation = PasswordVisualTransformation(),
            keyboardOptions = KeyboardOptions(
                keyboardType = KeyboardType.Password,
            ),
            modifier = Modifier
                .onGloballyPositioned {
                    passwordAutofillNode.boundingBox = it.boundsInWindow()
                }
                .onFocusChanged { focusState ->
                    if (focusState.isFocused) {
                        autofill?.requestAutofillForNode(passwordAutofillNode)
                    } else {
                        autofill?.cancelAutofillForNode(passwordAutofillNode)
                    }
                },
        )
    }
}