Chip

hero

概览

功能块是紧凑的互动元素,可让用户过滤其下方的内容或触发快速操作。紧凑型组件可显示与内容相关的上下文选项,缩短浏览时间,从而帮助用户在旅途中更高效地完成任务。

为保持视觉清晰度,布局应限制为每行最多 7 个 chip。芯片非常灵活,可与您品牌的视觉语言相匹配。您可以根据所选的界面主题自定义形状、背景颜色和边框颜色。

条状标签可以包含

  • 仅图标
  • 仅限文字标签
  • 图标和标签(任一方向)

乐曲

hero

1. 前导图标或图片

2. 标签文本


用户体验要求

为了确保所有应用都能提供安全一致的体验,请遵循以下设计要求:

要求级别

内容

必须

包含图标或标签。

应当有

使用独特的视觉样式(例如不同的颜色或形状)来传达不同的条状标签状态。

应当有

在整个应用中为所有 chip 实现一致的样式。

应当有

避免在同一组件组中混用有状态和无状态 chip。

应当有

将重要或推荐的 chip 放置在容器的前沿。

应当有

标签文字应简短且具有描述性。避免使用会触发截断的长文本,以免增加认知负荷。