Jetpack ComposeでImeActionを設定する

テキストフィールドにフォーカスがあるときのアクションボタンにDoneやNextなどを設定し、アクションボタンが押されたときに処理を実行する方法について。

アクションボタンの表示は、TextFieldのkeyboardOptionsで指定します。
ボタンが押されたときの処理は、keyboardActionsで指定します。

TextField(
    keyboardOptions = ...
    keyboardActions = ...
)

Doneボタンを使用するときはkeyboardOptionsにImeAction.Doneを使用し、
KeyboardActionsのonDoneでボタンが押されたときの処理を指定します。

TextField(
    value = value,
    onValueChange = { value = it },
    keyboardOptions = KeyboardOptions(
        imeAction = ImeAction.Done,
    ),
    keyboardActions = KeyboardActions(onDone = {
        value = value.uppercase()
    })
)

フォーカスを移動するときは、keyboardOptionsにImeAction.NextやImeAction.Previousを使用します。
ボタンが押されたときの処理は、onNextやonPreviousで指定します。

val focusManager = LocalFocusManager.current

TextField(
    value = value,
    onValueChange = { value = it },
    keyboardOptions = KeyboardOptions(
        imeAction = ImeAction.Next,
    ),
    keyboardActions = KeyboardActions(onNext = {
        focusManager.moveFocus(FocusDirection.Down)
    })
)
TextField(
    value = value, onValueChange = { value = it },
    keyboardOptions = KeyboardOptions(imeAction = ImeAction.Previous),
    keyboardActions = KeyboardActions(onPrevious = {
        focusManager.moveFocus(FocusDirection.Up)
    })
)

コメントを残す

メールアドレスが公開されることはありません。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください