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