在版本 1.2.0 includeFontPadding 中删除 TextField 的默认填充

Question

compose_version = 1.2.0
kotlin 1.7.0

我正在尝试删除TextField. 因为我将它与尾随图标一起使用。所以我不能使用它，BasicTextField因为它没有尾随图标。

我正在使用版本1.2.0，我认为includeFontPadding默认情况下是错误的。然而，这没有用。所以我尝试明确地尝试将其设置如下：

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

然而，这也不起作用。所以只是想知道 1.2.0 版本并删除默认填充。

    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

首先1.2.0您可以使用BasicTextField+ TextFieldDecorationBox。
您可以设置trailingIcon并且可以使用该contentPadding属性来更改填充：

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
        )
    )
}