Jetpack Compose UI组件 —— TextField


前言

如今Jetpack成为Android的主流,为了不被淘汰,我也要开始Jetpack的学习了,先从最常用的Compose开始。在这里用文章写一个总结,以后忘了还能扒出来再看一看


一、TextField是什么?

TextField是Compose中代替EditText的组件,在Compose中绝大多数是使用Material Design的,所以不熟悉的同学可以先去看看这一块

二、常用API

@OptIn(ExperimentalComposeUiApi::class)
@Composable
fun Greeting() {
    Row(horizontalArrangement = Arrangement.Center,
        modifier = Modifier.fillMaxWidth(1.0f)){
        var text = remember { mutableStateOf("") } //mutable对象代表赋予该ui动态更新,此mutable变化则ui也会随之刷新
        var isError1 = remember { mutableStateOf(false) } //使搜索框的错误状态改变
        TextField(
            value = text.value, //显示的值
            onValueChange = {text.value = it}, //当数值改变时
            placeholder = { Text("搜索") }, //hint属性,输入框内容为空时显示的提示符
            modifier = Modifier.fillMaxWidth(0.8f), //宽度为父组件的百分之八十
            isError = isError1.value,
            leadingIcon = { //前导图片
                Icon(painter = painterResource(com.jz.jetpack2.R.drawable.img_search),contentDescription = null)
            },
            trailingIcon = { //后导图片
                IconButton(
                    onClick = { //点击清空搜索框
                        text.value = "" //当属性改变时被赋予该属性的UI将会更新
                        isError1.value = false
                    },
                    content = { //图标按钮的内容 可以继续叠加
                        Row (verticalAlignment = Alignment.CenterVertically){
                            Icon(Icons.Rounded.Close,null)
                            Text("点击我")
                        }

                    }
                )
            },
            shape = RoundedCornerShape(15.dp), //搜索框圆角度

            colors = TextFieldDefaults.textFieldColors(//可在此处更改搜索框的所有属性颜色,字体,边框,下划线等
                backgroundColor = Color.White, //背景色
                textColor = Color.Black, //字体颜色
                placeholderColor = Color.Green, //提示颜色
                trailingIconColor = Color.Red, //后导背景色
            ),
            keyboardActions = KeyboardActions(
                onDone = {//在用户点击完成操作时
                    LocalSoftwareKeyboardController.current?.hide() //隐藏软键盘
                }
            )
        )
    }
}

总结

此文章单纯用来记录学习情况和做的一些总结

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值