android jetpack compose中文本光标超出可见区域时如何自动向下滚动屏幕

박찬준*_*박찬준 13 android-jetpack-compose

在Android视图系统中,当光标(ScrollView中EditText视图的光标)超出可见区域时,Android会自动向下滚动屏幕以使光标始终可见。

滚动视图中的编辑文本

有没有办法在 android Jetpack Compose 中实现这一点?

LazyColumn 中的 BasicTextField 似乎基本上不支持这种行为。

LazyColumn 中的 BasicTextField

+)

这是一个可以重新生成此问题的可组合代码示例。

@Composable
fun TestScreen() {
    val scaffoldState = rememberScaffoldState()
    var content by remember { mutableStateOf("") }

    Scaffold(
        scaffoldState = scaffoldState,
        floatingActionButtonPosition = FabPosition.Center,
    ) {
        val lazyListState = rememberLazyListState()

        LazyColumn(
            state = lazyListState,
            modifier = Modifier
                .fillMaxSize()
                .padding(horizontal = 15.dp),
            horizontalAlignment = Alignment.CenterHorizontally
        ) {
            item {
                BasicTextField(
                    value = content,
                    onValueChange = { content = it },
                    modifier = Modifier
                        .background(color = Color.Green)
                        .fillMaxWidth()
                        .wrapContentHeight()
                )
            }
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

AndroidManifest.xml 文件中的活动声明

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
        package="com.example.android.test">

    <application
            android:allowBackup="true"
            android:icon="@mipmap/ic_launcher"
            android:label="@string/app_name"
            android:roundIcon="@mipmap/ic_launcher_round"
            android:supportsRtl="true"
            android:theme="@style/Theme.Test">
        <activity
                android:name=".MainActivity"
                android:exported="true"
                android:label="@string/app_name"
                android:theme="@style/Theme.Test"
                android:windowSoftInputMode="adjustResize">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>
Run Code Online (Sandbox Code Playgroud)

Nik*_*ski 0

您可能需要在文本字段中的每次更改时手动滚动。首先,您需要设置垂直滚动修饰符并使用状态向下滚动等于行高的像素量。

@Composable
fun SelfScrollingTextField(
    modifier: Modifier = Modifier,
    value: TextFieldValue,
    textStyle: TextStyle = TextStyle.Default,
    onValueChanged: (TextFieldValue) -> Unit
) {
    val scroll = rememberScrollState()
    BasicTextField(
        modifier = modifier.then(Modifier.verticalScroll(scroll)),
        value = value,
        onValueChange = onValueChanged
    )
    LaunchedEffect(value) {
        scroll.animateScrollTo(textStyle.lineHeight.value.toInt())
    }
}
Run Code Online (Sandbox Code Playgroud)

LaunchEffect一旦输入发生变化就会触发。