Android Compose中Text组件多行文本LineHeight占用额外空间问题

在使用Android Compose的Text组件时，多行文本会出现额外高度占用的情况：左侧单行"Hello World!"的Text背景（洋红色）高度贴合文本，而右侧两行文本的Text背景上下会多出明显的空白区域。

复现代码 #

Row(
    modifier = Modifier,
    horizontalArrangement = Arrangement.Center
) {
    Text(
        modifier = Modifier
            .background(
                color = Color.Magenta
            ),
        textAlign = TextAlign.Center,
        text = "Hello World!"
    )

    Spacer(modifier = Modifier.width(16.dp))

    Text(
        modifier = Modifier
            .background(
                color = Color.Magenta
            ),
        textAlign = TextAlign.Center,
        text = "Hello World!\nAnil Adhikary",
        lineHeight = 24.sp
    )
}

问题原因 #

Compose的Text组件默认会包含字体设计时的上下内边距（用于兼容不同字体的上行、下行字符），单行时这个内边距不明显，但多行时结合自定义的lineHeight，会让整体高度超出预期，出现视觉上的额外空白。

解决方案 #

1. 关闭字体默认内边距

给Text添加includeFontPadding = false参数，直接移除字体自带的上下内边距，让Text高度完全贴合文本内容：

Text(
    modifier = Modifier.background(Color.Magenta),
    textAlign = TextAlign.Center,
    text = "Hello World!\nAnil Adhikary",
    lineHeight = 24.sp,
    includeFontPadding = false // 移除字体默认内边距
)

2. 匹配lineHeight与字体大小

如果关闭内边距后仍有问题，可以调整lineHeight值，让它与字体大小（默认或自定义的fontSize）合理匹配。比如字体大小设为16.sp时，lineHeight设为24.sp是合理的行间距，若lineHeight设置过大也会导致额外高度。

内容的提问来源于stack exchange，提问作者Anil Adhikary