【Compose multiplatform教程08】【组件】Text组件

小林爱2024-12-27 14:28

查看全部组件https://blog.csdn.net/b275518834/article/details/144751353

Text

功能说明：用于在界面上显示文本内容，支持设置字体、大小、颜色、样式（如加粗、斜体、下划线）等属性，满足不同的文本展示需求，可传达各种信息给用户。

Kotlin 复制代码

@Composable
fun TextExample() {
    Column {
        // 基本文本显示，设置字体大小、颜色、字体样式
        Text(
            text = "这是一段普通文本",
            fontSize = 16.sp,
            color = Color.Black,
            fontFamily = FontFamily.Serif,
            modifier = Modifier
        )

        // 加粗文本
        Text(
            text = "这是加粗文本",
            fontWeight = FontWeight.Bold,
            fontSize = 18.sp,
            color = Color.DarkGray,
            modifier = Modifier
        )

        // 带有下划线的文本
        Text(
            text = "这是带有下划线的文本",
            textDecoration = TextDecoration.Underline,
            fontSize = 14.sp,
            color = Color.Blue,
            modifier = Modifier
        )

        // 自定义复合样式文本，部分加粗、部分颜色不同
        val annotatedText = buildAnnotatedString {
            append("这段文本中，")
            withStyle(style = SpanStyle(fontWeight = FontWeight.Bold)) {
                append("加粗部分")
            }
            append(" 和其他部分有不同样式，")
            withStyle(style = SpanStyle(color = Color.Green)) {
                append("绿色部分")
            }
            append(" 组合展示。")
        }
        Text(
            text = annotatedText,
            fontSize = 16.sp,
            modifier = Modifier
        )

        // 文本对齐方式设置
        Text(
            text = "这是居中对齐的文本",
            textAlign = TextAlign.Center,
            fontSize = 20.sp,
            color = Color.Red,
            modifier = Modifier
        )

        // 动态设置字体大小单位
        val dynamicSize: TextUnit = 22.sp
        Text(
            text = "根据变量设置字体大小的文本",
            fontSize = dynamicSize,
            color = Color.Magenta,
            modifier = Modifier
        )
    }
}