这是我参与8月更文挑战的第4天，活动详情查看：8月更文挑战

Text

High level element that displays text and provides semantics / accessibility information. 显示文本并提供语义/可访问性信息的高级元素 (百度翻译) 这是Text组件注释的第一行，相比 TextView 使用起来方便太多了

组件函数

@Composable
fun Text(
    text: String,
    modifier: Modifier = Modifier,
    color: Color = Color.Unspecified,
    fontSize: TextUnit = TextUnit.Unspecified,
    fontStyle: FontStyle? = null,
    fontWeight: FontWeight? = null,
    fontFamily: FontFamily? = null,
    letterSpacing: TextUnit = TextUnit.Unspecified,
    textDecoration: TextDecoration? = null,
    textAlign: TextAlign? = null,
    lineHeight: TextUnit = TextUnit.Unspecified,
    overflow: TextOverflow = TextOverflow.Clip,
    softWrap: Boolean = true,
    maxLines: Int = Int.MAX_VALUE,
    onTextLayout: (TextLayoutResult) -> Unit = {},
    style: TextStyle = LocalTextStyle.current
)

参数介绍

text: String

要显示的文本："Hello World!"

@Composable
fun Greeting(name: String) {
    Text(
        text = "Hello $name!",
    )
}

modifier: Modifier

修改器(后面专门一篇文章介绍)

color: Color

颜色：Color.White Color类自带的颜色 or Color(/*@ColorInt*/ color: Int) 自定义颜色比如 Color(0Xff00ff)ARGB颜色值。如果颜色未指定，并且style中也没有设置颜色，则 color 默认为Color.Black 黑色

@Composable
fun Greeting(name: String) {
    Text(
        text = "Hello $name!",
        color = Color.Green,
    )
}

fontSize: TextUnit

文本大小：30.sp （ sp 是 Compose 包自带的 Float 的扩展函数）

@Composable
fun Greeting(name: String) {
    Text(
        text = "Hello $name!",
        modifier = Modifier.fillMaxWidth(),
        color = Color.Green,
        fontSize = 30.sp,
    )
}

fontStyle: FontStyle?

文本样式：FontStyle.Italic 斜体 or FontStyle.Normal 普通，两种样式，默认为普通

@Composable
fun Greeting(name: String) {
    Text(
        text = "Hello $name!",
        fontSize = 30.sp,
        fontStyle = FontStyle.Italic
    )
}

fontWeight: FontWeight?

文本粗细：FontWeight.Bold or FontWeight.W200 or FontWeight(weight: Int) (取值范围0-1000,越高越粗，越低越细)

@Composable
fun Greeting(name: String) {
    Text(
        text = "Hello $name!",
        fontSize = 30.sp,
        fontWeight = FontWeight.Bold
    )
}

• FontWeight.Bold or FontWeight(700)
• FontWeight.Black or FontWeight(900)
• FontWeight.Thin or FontWeight(100)
• 其他的值自行尝试

fontFamily: FontFamily?

字体：默认为 FontFamily.Default，

@Composable
fun Greeting(name: String) {
    Text(
        text = "Hello $name!",
        fontSize = 30.sp,
        fontFamily = FontFamily.Default,
    )
}

还有其他自带4中字体分别是：

• FontFamily.SansSerif 好像没什么变化和 FontFamily.Default相比

• FontFamily.Serif

• FontFamily.Monospace

• FontFamily.Cursive

letterSpacing: TextUnit

文字间距：默认为0

@Composable
fun Greeting(name: String) {
    val text = "你好 $name!"
    Text(
        text = "$text $text $text $text $text $text $text",
        letterSpacing = TextUnit.Unspecified
    )
}

• letterSpacing: = 5.sp

• letterSpacing: = 10.sp

textDecoration: TextDecoration?

文本装饰：默认为TextDecoration.None

@Composable
fun Greeting(name: String) {
    Text(
        text = "你好 $name!",
        textDecoration = TextDecoration.None
    )
}

• TextDecoration.None
• TextDecoration.Underline
• TextDecoration.LineThrough

textAlign: TextAlign?

文本对齐：默认 TextAlign.Left 左对齐

@Composable
fun Greeting(name: String) {
    Text(
        text = "你好 $name!",
        modifier = Modifier
            .fillMaxWidth()
            .background(Color.Gray),
        textAlign = TextAlign.Left
    )
}

• TextAlign.Center

• TextAlign.Right

• TextAlign.Center

• TextAlign.Start

• TextAlign.End

lineHeight: TextUnit

行高

• lineHeight = 10.sp

@Composable
fun Greeting(name: String) {
    Text(
        text = "你好 $name!你好 $name!你好 $name!你好 $name!你好 $name!你好 $name!你好 $name!你好 $name!你好 $name!",
        lineHeight = 10.sp
    )
}

• lineHeight = 30.sp

overflow: TextOverflow

溢出的文本处理方式：TextOverflow.Clip 剪切掉 or TextOverflow.Ellipsis 用省略号表示 TextOverflow.Clip不指定宽高或最大行数时没有效果 TextOverflow.Ellipsis 配合 maxLines: Int 最大行数使用

@Composable
fun Greeting(name: String) {
    Text(
        text = "你好 $name!",
        overflow = TextOverflow.Clip
    )
}

• TextOverflow.Clip 限定宽高

@Composable
fun Greeting(name: String) {
    Text(
        text = "你好 $name!",
        modifier = Modifier.width(10.dp).height(20.dp).background(Color.Gray),
        overflow = TextOverflow.Clip
    )
}

• TextOverflow.Clip 限定行数

@Composable
fun Greeting(name: String) {
    Text(
        text = "你好 $name!你好 $name!你好 $name!你好 $name!你好 $name!你好 $name!你好 $name!你好 $name!",
        overflow = TextOverflow.Clip,
        maxLines = 1
    )
}

• TextOverflow.Ellipsis 限定行数

@Composable
fun Greeting(name: String) {
    Text(
        text = "你好 $name!你好 $name!你好 $name!你好 $name!你好 $name!你好 $name!你好 $name!你好 $name!",
        overflow = TextOverflow.Ellipsis,
        maxLines = 1
    )
}

softWrap: Boolean

文本是否应该在软换行符处换行：true 换行 or false 不换行，默认为 true

@Composable
fun Greeting(name: String) {
    Text(
        text = "softWrap Whether the text should break at soft line breaks. If false, the glyphs in the text will be positioned as if there was unlimited horizontal space. If [softWrap] is false, [overflow] and TextAlign may have unexpected effects.",
        softWrap = true
    )
}

• softWrap = true
• softWrap = false

onTextLayout: (TextLayoutResult) -> Unit

计算新文本布局时执行的回调。

@Composable
fun Greeting(name: String) {
    Text(
        text = "你好 $name!",
        onTextLayout = {
            Log.e("onTextLayout", "$it")
        }
    )
}

style: TextStyle

文本的样式配置，如颜色、字体、行高等 可以对以上基本配置进行封装，类似xml的style