how to make cursor on BasicTextField be centered on jetpack compose?

Question

I have a problem, where I need a BasicTextField to customize the TextField as I want.

Here I have tried to do a custom, but there is a problem with the cursor in the BasicTextField, it doesn't center align, what I need is center alignment

Screen Created.

Expectation:

i code like this

BasicTextField(
    value = value,
    onValueChange = onValueChange,
    decorationBox = { innerTextField ->
        Column(
            modifier = Modifier
                .fillMaxWidth(),
            horizontalAlignment = Alignment.CenterHorizontally
        ) {
            innerTextField()

            Space(height = 8.dp)

            Divider()
        }
    }
)

Answer 1

You can apply textAlign = TextAlign.Center to the textStyle attribute in the BasicTextField.

Something like:

BasicTextField(
        value = text,
        onValueChange = { text = it },
        textStyle = LocalTextStyle.current.copy(textAlign = TextAlign.Center),
        decorationBox = { innerTextField ->
            Column(
                modifier = Modifier
                    .fillMaxWidth(),
                horizontalAlignment = Alignment.CenterHorizontally
            ) {
                innerTextField()
                Spacer(modifier = Modifier.height(8.dp))
                Divider()
            }
        }
    )