Removing default padding from TextField in version 1.2.0 includeFontPadding

Question

compose_version = 1.2.0
kotlin 1.7.0

I am trying to remove the TextField. As I am using it with a trailing icon. So I can't use the BasicTextField as it doesn't have the trailing icon.

I am using version 1.2.0 and I was thinking that the includeFontPadding was false by default. However, that didn't work. So I tried to explicitly try and set it as follows:

textStyle = TextStyle(
                    platformStyle = PlatformTextStyle(
                        includeFontPadding = true
                    ))

However, this didn't work either. So just wondering about the version 1.2.0 and removing the default padding.

    Column(modifier = Modifier
        .fillMaxWidth()
        .background(color = Color.White)
        .border(width = 2.dp, shape = RoundedCornerShape(4.dp), color = Color.LightGray)
        .height(56.dp)) {

        Text(
            modifier = Modifier
                .fillMaxWidth()
                .padding(start = 16.dp),
            text = "Gender (optional)")

        TextField(
            textStyle = TextStyle(
                platformStyle = PlatformTextStyle(
                    includeFontPadding = true
                )),
            colors = TextFieldDefaults.textFieldColors(backgroundColor = Color.White),
            modifier = Modifier
                .fillMaxWidth(),
            value = rememberMobileCode,
            onValueChange = { newMobileCode ->
                rememberMobileCode = newMobileCode
            },
            trailingIcon = {
                Icon(dropdownIcon, contentDescription = "dropdown icon", modifier = Modifier.clickable {
                    rememberIsExpanded = !rememberIsExpanded
                })
            },
            singleLine = true,
            readOnly = true
        )
}

Answer 1

Starting with 1.2.0 you can use the BasicTextField + TextFieldDecorationBox.
You can set the trailingIcon and you can use the contentPadding attribute to change the paddings:

val colors = TextFieldDefaults.textFieldColors()

BasicTextField(
    value = text,
    onValueChange = { text = it },
    modifier = Modifier
        .fillMaxWidth()
        .background(
            color = colors.backgroundColor(enabled).value,
            shape = RoundedCornerShape(8.dp)
        ),
    interactionSource = interactionSource,
    enabled = enabled,
    singleLine = singleLine
) {
    TextFieldDefaults.TextFieldDecorationBox(
        value =text,
        innerTextField = it,
        singleLine = singleLine,
        enabled = enabled,
        visualTransformation = VisualTransformation.None,
        label = { Text(text = "label") },
        trailingIcon = {
            IconButton(onClick = {  }) {
                Icon(imageVector = Icons.Filled.Clear, contentDescription = "Clear")
            }
        },
        placeholder = { /* ... */ },
        interactionSource = interactionSource,
        // change the padding
        contentPadding = TextFieldDefaults.textFieldWithoutLabelPadding(
            top = 2.dp, bottom = 2.dp
        )
    )
}