这篇文章主要介绍Android Compose自定义TextField如何实现自定义的输入框，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！
简单自定义BasicTextField示例
代码
var text by remember { mutableStateOf("简单的TextField") } BasicTextField( value = text, onValueChange = { text = it }, modifier = Modifier .height(40.dp) .width(300.dp) .background(Color.Green) )效果
实现自定义样式的BasicTextField
我们知道BasicTextField提供了基础的输入框，只包含文字输入，光标等简单功能，如果我们需要增加样式就需要自己实现decorationBox参数，来添加样式。
本例中我们实现一个带蓝色边框，内部填充绿色，左侧有图标的自定义BasicTextField。
代码
@Composablefun DecorateTextField() { var text by rememberSaveable { mutableStateOf("init") } Box( Modifier .fillMaxWidth() .fillMaxHeight(), contentAlignment = Alignment.Center ) { BasicTextField( value = text, onValueChange = { text = it }, textStyle = TextStyle(color = Color.White), cursorBrush = SolidColor(Color.Blue), decorationBox = { innerTextField ->//decorationBox内部负责编写输入框样式 Row( Modifier .padding(2.dp) .fillMaxWidth() .background(Color.Blue, RoundedCornerShape(percent = 30)) .padding(1.dp) .background(Color.Green, RoundedCornerShape(percent = 29)), verticalAlignment = Alignment.CenterVertically ) { Icon(Icons.Default.Star, tint = Color.White, contentDescription = null) Spacer(Modifier.width(5.dp)) Box(modifier = Modifier.padding(top = 7.dp, bottom = 7.dp, end = 7.dp)) { innerTextField()//自定义样式这行代码是关键，没有这一行输入文字后无法展示，光标也看不到 } } } ) }}效果
使用BasicTextField自定义百度输入框
代码
@Composablefun BaiduTextField() { var text by remember { mutableStateOf("安安安安卓") } BasicTextField(value = text, onValueChange = { text = it }, decorationBox = { innerTextField -> val iconModifier = Modifier.padding(start = 5.dp) Row( modifier = Modifier .padding(horizontal = 5.dp, vertical = 3.dp) .fillMaxWidth() .height(50.dp) .padding(start = 5.dp) .border(width = 1.dp, color = Color.Blue, shape = RoundedCornerShape(8.dp)) ) { Box( modifier = Modifier .padding(start = 8.dp) .weight(1f) .fillMaxHeight() , contentAlignment = Alignment.CenterStart ) { innerTextField() } Row( modifier = Modifier.fillMaxHeight(), verticalAlignment = Alignment.CenterVertically ) { Icon( painter = painterResource(id = R.drawable.cha), "", modifier = iconModifier.size(20.dp), tint = Color.Gray ) Icon( painter = painterResource(id = R.drawable.record), "", modifier = iconModifier.size(20.dp), tint = Color.Gray ) Icon( painter = painterResource(id = R.drawable.takepic), "", modifier = iconModifier.padding(end = 8.dp).size(20.dp), tint = Color.Gray ) Box( modifier = Modifier .width(120.dp) .fillMaxHeight() .background( color = Color.Blue, shape = RoundedCornerShape(topEnd = 8.dp, bottomEnd = 8.dp) ).clickable { }, contentAlignment = Alignment.Center ) { Text( text = "百度一下", color = Color.White ) } } } })}效果
以上是“Android Compose自定义TextField如何实现自定义的输入框”这篇文章的所有内容，感谢各位的阅读！希望分享的内容对大家有帮助，更多相关知识，欢迎关注编程网行业资讯频道！
