compose 跟EditText一样的TextField

compose的TextField有很多问题,特别是默认高度问题,习惯EditText的安卓开发极其痛苦,并且不宜满足UI需求,所以给大家一个封装好的,即取即用

先贴使用的代码

  val searchKey = remember {
        mutableStateOf("")
   }

 CommonEditText(searchKey, "请输入关键词", R.mipmap.icon_home_search)

下面是根据自己的UI和需求进行封装的部分

@Composable
fun CommonEditText(
    strState: MutableState<String>,
    placeHolderStr: String,
    leadingIcon: Int? = null,
    onclick: (() -> Unit)? = null
) {
    EditText(
        value = strState.value,
        onValueChange = {
            strState.value = it
        },
        placeholder = { Text(text = placeHolderStr, color = Text999999, fontSize = 12.sp) },
        modifier = Modifier
            .height(30.dp)
            .clip(RoundedCornerShape(4.dp))
            .border(0.5.dp, color = ColorD1D1D1, shape = RoundedCornerShape(4.dp))
            .clickable {
                onclick?.invoke()
            },
        paddingValues = PaddingValues(4.dp),
        colors = TextFieldDefaults.textFieldColors(
            textColor = Text333333,
            backgroundColor = ColorBackground,
            focusedIndicatorColor = Color.Transparent,
            unfocusedIndicatorColor = Color.Transparent,
            disabledIndicatorColor = Color.Transparent
        ),
        leadingIcon = {
            leadingIcon?.let {
                Image(
                    painter = painterResource(id = leadingIcon),
                    contentDescription = "A description for the image",
                    Modifier
                        .height(18.dp)
                        .width(18.dp)
                )
            }
        },
        singleLine = true, textStyle = TextStyle(fontSize = 12.sp), enabled = onclick == null
    )
}

最后是最终要的部分,EditText的实现

@Composable
fun EditText(
    value: String,
    onValueChange: (String) -> Unit,
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    readOnly: Boolean = false,
    textStyle: TextStyle = LocalTextStyle.current,
    label: @Composable (() -> Unit)? = null,
    placeholder: @Composable (() -> Unit)? = null,
    leadingIcon: @Composable (() -> Unit)? = null,
    trailingIcon: @Composable (() -> Unit)? = null,
    isError: Boolean = false,
    visualTransformation: VisualTransformation = VisualTransformation.None,
    keyboardOptions: KeyboardOptions = KeyboardOptions.Default,
    keyboardActions: KeyboardActions = KeyboardActions(),
    singleLine: Boolean = false,
    maxLines: Int = Int.MAX_VALUE,
    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
    shape: Shape =
        MaterialTheme.shapes.small.copy(bottomEnd = ZeroCornerSize, bottomStart = ZeroCornerSize),
    colors: TextFieldColors = TextFieldDefaults.textFieldColors(),
    paddingValues: PaddingValues = PaddingValues(0.dp)
) {
    val textColor = textStyle.color.takeOrElse {
        colors.textColor(enabled).value
    }
    val mergedTextStyle = textStyle.merge(TextStyle(color = textColor))

    @OptIn(ExperimentalMaterialApi::class)
    BasicTextField(
        value = value,
        modifier = modifier
            .background(colors.backgroundColor(enabled).value, shape)
            .indicatorLine(enabled, isError, interactionSource, colors)
            .defaultMinSize(
                minWidth = TextFieldDefaults.MinWidth,
                minHeight = TextFieldDefaults.MinHeight
            ),
        onValueChange = onValueChange,
        enabled = enabled,
        readOnly = readOnly,
        textStyle = mergedTextStyle,
        cursorBrush = SolidColor(colors.cursorColor(isError).value),
        visualTransformation = visualTransformation,
        keyboardOptions = keyboardOptions,
        keyboardActions = keyboardActions,
        interactionSource = interactionSource,
        singleLine = singleLine,
        maxLines = maxLines,
        decorationBox = @Composable { innerTextField ->
            TextFieldDefaults.TextFieldDecorationBox(
                value = value,
                visualTransformation = visualTransformation,
                innerTextField = innerTextField,
                placeholder = placeholder,
                label = label,
                leadingIcon = leadingIcon,
                trailingIcon = trailingIcon,
                singleLine = singleLine,
                enabled = enabled,
                isError = isError,
                interactionSource = interactionSource,
                colors = colors,
                contentPadding = paddingValues
            )
        }
    )
}