Jetpack Compose中如何修改OutlinedTextField的边框厚度？

Jetpack Compose的OutlinedTextField没有直接提供调整边框厚度的配置项，不过可以通过自定义边框样式来实现需求。

修改后的完整代码 #

@Composable
fun CustomTextField(
    modifier: Modifier = Modifier,
    readOnly: Boolean = false,
    value: String?,
    onValueChange: (String) -> Unit,
    maxLength: Int = 50,
    isValid: ((String) -> Boolean)? = null,
    label: String? = null,
    keyboardType: KeyboardType = KeyboardType.Text,
    imeAction: ImeAction = ImeAction.Done,
    maxLines: Int = 1,
    trailingIcon: @Composable (() -> Unit)? = null,
    shape: Shape = MaterialTheme.shapes.extraLarge,
    labelColor: Color? = null,
    containerColor: Color = MaterialTheme.colorScheme.primary.copy(0.1f),
    focusedBorderColor: Color = MaterialTheme.colorScheme.primary,
    unfocusedBorderColor: Color = MaterialTheme.colorScheme.primary.copy(0.75f),
    placeholder: String? = null,
    // 添加边框厚度参数，默认2dp可按需调整
    borderThickness: Dp = 2.dp
) {
    OutlinedTextField(
        modifier = modifier,
        readOnly = readOnly,
        value = value ?: "",
        onValueChange = { text ->
            if (text.length <= maxLength) {
                onValueChange(text)
            }
        },
        textStyle = MaterialTheme.typography.bodyMedium,
        label = {
            label?.let {
                CustomText(
                    text = label,
                    style = MaterialTheme.typography.labelMedium,
                    color = labelColor,
                    fontSize = 12.sp,
                    fontWeight = FontWeight.Bold
                )
            }
        },
        placeholder = {
            placeholder?.let {
                CustomText(
                    text = placeholder,
                    style = MaterialTheme.typography.bodyMedium.copy(color = Color.Gray),
                    color = Color.Gray
                )
            }
        },
        singleLine = maxLines == 1,
        maxLines = maxLines,
        colors = TextFieldDefaults.outlinedTextFieldColors(
            containerColor = containerColor,
            focusedBorderColor = focusedBorderColor,
            unfocusedBorderColor = unfocusedBorderColor,
        ),
        trailingIcon = trailingIcon,
        shape = shape,
        // 自定义边框样式，设置指定厚度
        border = TextFieldDefaults.outlinedTextFieldBorder(
            focusedBorderStroke = BorderStroke(borderThickness, focusedBorderColor),
            unfocusedBorderStroke = BorderStroke(borderThickness, unfocusedBorderColor)
        )
    )
}

关键修改说明 #

• 新增borderThickness参数，允许灵活设置边框厚度，默认值设为2dp可根据需求调整
• 在OutlinedTextField中添加border参数，通过TextFieldDefaults.outlinedTextFieldBorder创建自定义边框，分别为聚焦和失焦状态配置对应厚度的BorderStroke
• 补上原代码中未使用的shape参数传递，确保你设置的圆角样式生效

内容的提问来源于stack exchange，提问作者Saeed Noshadi