JetBrains / compose-multiplatform

Compose Multiplatform, a modern UI framework for Kotlin that makes building performant and beautiful user interfaces easy and enjoyable.
https://jetbrains.com/lp/compose-multiplatform
Apache License 2.0
16.12k stars 1.17k forks source link

Cursor position is displayed on the left edge when textAlign is set to center in BasicTextField #4611

Closed y-sugitani closed 4 months ago

y-sugitani commented 6 months ago

Describe the bug When setting textAlign to TextAlign.Center in BasicTextField (and TextField) on iOS, the cursor position is displayed on the left edge when focused. On Android, it is displayed in the center as expected.

Affected platforms

Versions

To Reproduce

  1. Create a new Compose Multiplatform project
  2. Add the following code:

    @Composable
    @Preview
    fun App() {
    var text by remember { mutableStateOf("") }
    
    MaterialTheme {
        BasicTextField(
            value = text,
            onValueChange = { text = it },
            modifier = Modifier
                .fillMaxWidth()
                .background(Color.LightGray)
                .padding(18.dp),
            maxLines = Int.MAX_VALUE,
            textStyle = TextStyle.Default.copy(
                textAlign = TextAlign.Center,
            ),
        )
    }
    }
  3. Run the app on an iOS Simulator
  4. Tap the BasicTextField to focus it
  5. The cursor is displayed on the left edge

Expected behavior Since textAlign in BasicTextField is set to TextAlign.Center, the cursor should be displayed in the center of the text field on iOS, just like on Android.

Screenshots

Android https://github.com/JetBrains/compose-multiplatform/assets/32157797/a968c4a8-57a9-4962-8170-a5d4f115a6af

iOS https://github.com/JetBrains/compose-multiplatform/assets/32157797/27ef6fd2-bb40-4714-99b9-3b6c510301d9

Additional context The same behavior was observed when using TextField. Regardless of the textAlign value, the cursor is always displayed on the left edge on iOS.

A reproducible project is available at https://github.com/blackcat-carnival/compose-bugreport-202404-01

terrakok commented 6 months ago

I reproduced it on a JVM as well CursorIssue-all.zip

okushnikov commented 1 month ago

Please check the following ticket on YouTrack for follow-ups to this issue. GitHub issues will be closed in the coming weeks.