标题条状标签

标题 chip 提供一小段信息。

设计元素应锚定到帧的底部。

原则

情境化:标题块的主要目的是为与其关联的内容提供清晰且即时的情境。

简洁:标题 Chip 旨在显示简短信息,通常是简短的标题、名称或状态。

视觉上具有辨识度:虽然沿用了 Jetpack Compose Glimmer 的美学风格,但其外观应具有足够的辨识度,以便被识别为标签而非互动按钮。

使用和放置

默认情况下,标题 chip 是只读组件。

使用标题 chip 来表示静态或装饰性元素,以告知用户并添加标签。
由于标题条状标签没有焦点状态,因此请使用按钮作为可点按的操作提示。

设计元素应锚定到帧的底部。 标题 chip 可以等同于静态移动应用栏。

在布局中

默认情况下,标题 chip 是只读组件。

条状标签随布局滚动
或者,也可以将条状标签固定在布局中。条状标签占据顶部 56 dp。

解剖学

设计元素应锚定到帧的底部。 显示默认标题条状标签和固定标题条状标签。粘性标题块会显示轮廓。

1. 标题块标签

2. 可选的前导图标或实体

自定义

标题 chip 可以显示图标,也可以不显示图标,还可以与其他样式属性一起显示。

属性 自定义 默认值
形状 大,圆形
内边距 16 dp、8 dp
边框 2 dp,#606460
文本 小体型
前置图标 40 dp
深度 0
最大宽度 352 dp
高度下限 56 dp