Jetpack Compose 组件TextField自动获取焦点并且弹出软键盘

可以通过在TextField中设置focused属性为true来实现自动获取焦点，然后在onFocusChanged回调中使用IME（Input Method Editor）来弹出软键盘。如下所示：

TextField(
    value = text,
    onValueChange = { text = it },
    label = { Text("Label") },
    modifier = Modifier
        .fillMaxWidth()
        .focusRequester(focusRequester)
        .onFocusChanged {
            if (it.isFocused) {
                keyboardController?.showSoftwareKeyboard()
            }
        }
)

val focusRequester = remember { FocusRequester() }
val keyboardController = LocalSoftwareKeyboardController.current

相关问题

Jetpack Compose 组件TextField自动获取焦点并且弹出软键盘 ，按钮取消焦点，关闭软键盘

对于Jetpack Compose组件TextField自动获取焦点并弹出软键盘，您可以使用Android中的InputMethodManager类来手动打开软键盘并使得TextField获取焦点。但是更简单的方法是使用Modifier.requestFocus()函数，如下所示：

TextField(
value = text,
onValueChange = { newText -> text = newText },
label = { Text("Label") },
modifier = Modifier
.fillMaxWidth()
.onFocusChanged { focusState -> if (focusState.isFocused) {
// 打开软键盘
val inputMethodManager = LocalContext.current.getSystemService(Context.INPUT_METHOD_SERVICE) as InputMethodManager
inputMethodManager.showSoftInput(ImeOptions.SHOW_IMPLICIT, 0)
} }
)

要关闭软键盘并移除TextField的焦点，您可以在“取消”按钮被点击时，手动关闭软键盘并使用Modifier.focusRequester(FocusRequester())函数将焦点移到需要的其他元素上，例如另一个按钮上，如下所示：

val focusRequester = remember { FocusRequester() }

TextField(
value = text,
onValueChange = { newText -> text = newText },
label = { Text("Label") },
modifier = Modifier
.fillMaxWidth()
.focusRequester(focusRequester)
)

Button(
onClick = {
// 关闭软键盘
val inputMethodManager = LocalContext.current.getSystemService(Context.INPUT_METHOD_SERVICE) as InputMethodManager
inputMethodManager.hideSoftInputFromWindow(windowToken, 0)
focusRequester.requestFocus()
},
modifier = Modifier
.height(48.dp)
.fillMaxWidth()
.padding(16.dp)
) {
Text("取消")
}

Jetpack Compose帮我封装一个TextField自动获取焦点并且弹出软键盘的函数

好的，可以尝试以下代码实现：

@Composable
fun AutoFocusTextField(
    value: String,
    onValueChange: (String) -> Unit,
    modifier: Modifier = Modifier
) {
    TextField(
        value = value,
        onValueChange = onValueChange,
        modifier = modifier
            .focusRequester(FocusRequester())
            .onFocusEvent {
                if (it.isFocused) {
                    LocalSoftwareKeyboardManager.current?.showSoftwareKeyboard()
                }
            },
        singleLine = true
    )
    LaunchedEffect(Unit) {
        withTimeout(100) {
            // Wait for layout & measurement passes to occur
            frameworkViewRef.await().requestFocus()
        }
    }
    AndroidView(
        factory = { ctx ->
            EditText(ctx).apply {
                setTextColor(Color.Transparent.toAndroidColor())
                setBackgroundColor(Color.Transparent.toAndroidColor())
            }
        },
        update = { editText ->
            editText.setText(value)
            editText.hideKeyboardOnIme(false)
            frameworkViewRef = WeakReference(editText)
        },
        modifier = Modifier
            .fillMaxSize()
            .focusable(true)
            .focusRequester(focusRequester)
            .onFocusEvent {
                if (it.isFocused) {
                    LocalSoftwareKeyboardManager.current?.showSoftwareKeyboard()
                }
            }
    )
}

private var frameworkViewRef = WeakReference<View>(null)
private val focusRequester = FocusRequester()

这里我们使用Jetpack Compose的TextField来实现输入框的UI，同时使用AndroidView来实现EditText的实际输入框。我们通过使用FocusRequester和软键盘管理来实现输入框自动获取焦点和弹出软键盘的功能。