Compose讲解-TextField组件

一.基础讲解

代码

@Composable
fun InitComposeView() {
    val phone = remember {
        mutableStateOf("")
    }

    TextField(
        value = phone.value,//内容
        onValueChange = {
            phone.value = it
            Log.d("输入变化", "value:$it")
        },//内容变化
        modifier = Modifier.size(400.dp, 80.dp),//控件大小
    )
}

输入监听

打印日志

输入变化                    com.example.newdemo                  D  value:a

输入变化                    com.example.newdemo                  D  value:ab

输入变化                    com.example.newdemo                  D  value:abc

二.全属性讲解

1.设置编辑状态

属性

enabled: Boolean = true, //是否可用

readOnly: Boolean = false, //是否只读。当为true时，文本不可被修改，但可以聚焦它并复制其中的文本。

代码

@Composable
fun InitComposeView() {
    val phone = remember {
        mutableStateOf("abc")
    }

    TextField(
        value = phone.value,//内容
        onValueChange = {
            phone.value = it
            Log.d("输入变化", "value:$it")
        },//内容变化
        modifier = Modifier.size(400.dp, 80.dp),//控件大小
        enabled = true,//是否可编辑
        readOnly = true,//是否只能读 当为true时，文本字段不可被修改，但用户可以聚焦它并复制其中的文本。
    )
}

结果

2.设置占位符

属性

placeholder: @Composable (() -> Unit)? = null,

代码

@Composable
fun InitComposeView() {
    val phone = remember {
        mutableStateOf("")
    }

    TextField(
        value = phone.value,//内容
        onValueChange = {
            phone.value = it
            Log.d("输入变化", "value:$it")
        },//内容变化
        modifier = Modifier.size(400.dp, 80.dp),//控件大小
        placeholder = {//占位符
            Text("请输入手机号")
        }
    )
}

结果

3.设置textStyle

属性

constructor(
    color: Color = Color.Unspecified,
    fontSize: TextUnit = TextUnit.Unspecified,
    fontWeight: FontWeight? = null,
    fontStyle: FontStyle? = null,
    fontSynthesis: FontSynthesis? = null,
    fontFamily: FontFamily? = null,
    fontFeatureSettings: String? = null,
    letterSpacing: TextUnit = TextUnit.Unspecified,
    baselineShift: BaselineShift? = null,