Page 1 of 1

Der Cursor bewegt sich nicht nach dem Filtern von Text Jetpack komponieren

Posted: 16 Feb 2025, 12:11
by Guest
Ich verwende InputTransformation In JetPack komponieren Sie die Benutzereingabe in einem BasicTextField . Die Transformation funktioniert korrekt, aber der Cursor bleibt in derselben Position, nachdem sie Text eingeben, anstatt sich rückwärts zu bewegen. < /P>

Code: Select all

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.enableEdgeToEdge
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.text.BasicTextField
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.foundation.text.input.InputTransformation
import androidx.compose.foundation.text.input.TextFieldBuffer
import androidx.compose.foundation.text.input.TextFieldLineLimits
import androidx.compose.foundation.text.input.TextFieldState
import androidx.compose.foundation.text.input.maxLength
import androidx.compose.foundation.text.input.rememberTextFieldState
import androidx.compose.foundation.text.input.then
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Text
import androidx.compose.material3.TextFieldDefaults
import androidx.compose.runtime.Composable
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.text.input.KeyboardType
import androidx.compose.ui.unit.dp

class MainActivity : ComponentActivity() {

override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
enableEdgeToEdge()
setContent {
val stateOne = rememberTextFieldState(initialText = "Hellow")
val stateTwo = rememberTextFieldState()
BasicTextFieldExamples(
stateTwo,
remember { MutableInteractionSource() },
)
}
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun BasicTextFieldExamples(
stateOTwo: TextFieldState,
secondInteractionSource: MutableInteractionSource,
) {
Column(
Modifier
.fillMaxSize()
.padding(50.dp)
) {
BasicTextField(
state = stateOTwo,
modifier = Modifier
.padding(top = 100.dp)
.fillMaxWidth()
.height(56.dp),
inputTransformation = InputTransformation.maxLength(6)
.then(LetterOnlyTransformation()),
interactionSource = secondInteractionSource,
decorator = TextFieldDefaults.decorator(
state = stateOTwo,
enabled = true,
label = {
Text("Last Name")
},
placeholder = {
Text("Example 2")
},
lineLimits = TextFieldLineLimits.Default,
interactionSource = secondInteractionSource,
outputTransformation = null
)
)
}
}
}

class LetterOnlyTransformation : InputTransformation {
override val keyboardOptions: KeyboardOptions?
get() = KeyboardOptions(keyboardType = KeyboardType.Text)

override fun TextFieldBuffer.transformInput() {
val filteredValue = asCharSequence().filter { it.isLetter() }
if (filteredValue != asCharSequence()) {
replace(0, length, filteredValue)
}
}
}
Frage:
Wie kann ich sicherstellen, dass sich der Cursor nach der Filterung der Eingabe in inputTransformation richtig bewegt? Gibt es eine bessere Möglichkeit, dieses Szenario in Jetpack komponieren zu können?>