在 Jetpack Compose Glimmer 中，TitleChip 组件旨在为关联内容（例如卡片）提供简短的非互动式标签。使用标题条状标签可显示简明扼要的信息，例如短标题、名称或状态。由于影视内容块不可聚焦或互动，因此它们在 Jetpack Compose Glimmer 界面中仅起到信息传递作用。例如，您可以在可滚动的成分列表旁边提供一个标记为“成分”的标题 chip。
基本示例：显示简短的标题 chip
您只需编写少量代码即可创建短标题 chip：
TitleChip { Text("Messages") }
详细示例：显示带有卡片的标题 chip
如需将标题 chip 与其他组件搭配使用，请将标题 chip TitleChipDefaults.AssociatedContentSpacing 放置在可组合函数中的其他组件上方。以下代码展示了如何将标题 chip 与卡片搭配使用：
@Composable
fun TitleChipExample() {
Column(horizontalAlignment = Alignment.CenterHorizontally) {
TitleChip { Text("Title Chip") }
Spacer(Modifier.height(TitleChipDefaults.AssociatedContentSpacing))
Card(
title = { Text("Title") },
subtitle = { Text("Subtitle") },
leadingIcon = { Icon(FavoriteIcon, "Localized description") },
) {
Text("Card Content")
}
}
}
代码要点
Spacer的高度固定，可提供正确的垂直间距（由TitleChipDefaults.AssociatedContentSpacing定义），确保两个组件之间有适当的间距。