Intro 简介
面包屑导航(Breadcrumb 或 breadcrumb trail)是一种辅助导航,用于显示当前页面在其应用层次结构中的位置。它通常用于向下钻取挖掘的场景,用户在其中浏览相关对象页面、表格和图表。
Usage 用法
在以下情况下使用面包屑:
- 您希望在对象页面上显示辅助导航
- 您希望在表格中显示导航
- 您希望在图表中显示导航
仅当向下钻取的场景指向相关对象页面时才使用面包屑:父对象页面 / 子对象页面 1 / 子对象页面 2 / 子对象页面 3。
如果出现以下情况,请勿使用面包屑:
- 您的层次结构仅包含一个层级
面包屑路径中不应包含以下元素:
- 其他 floorplan,例如概览页面和列表报告
- 跨应用导航至其他对象页面
- 独立的对象页面,例如情况说明书
SAPFiori 2.0 的全局导航概念将介绍这些情况。
Responsiveness and Adaptiveness 响应性和适应性
面包屑是响应的。如果水平空间不足,面包屑路径中的链接可折叠放在下拉菜单中:
- 面包屑中的第一个链接(起点)首先折叠,然后是层次结构中的下一个链接。
- 面包屑中的最后一个元素始终是可见的,并且永远都不会被折叠进下拉菜单中。
- 如果水平空间不足,则截断显示最后一个元素。
Layout 布局
面包屑的水平布局永远保持不变。链接总是紧挨着显示。
Types 类型
面包屑有两种类型:
- 标准面包屑
标准的面包屑将当前页面作为最后一项显示。最后一项只包含纯文本,而不是链接。 - 不包含当前页面的面包屑
仅在对象页面中使用此面包屑。面包屑显示了对象页面在应用中的位置,不显示当前页面。面包屑中的所有项目都是链接。
Components 组件
面包屑可包含链接和文本(标准面包屑),或者只包含链接(不包含当前页面的面包屑)。
Behavior and Interaction 行为与交互
导航
面包屑的目的是触发导航。当用户点击面包屑路径中的链接时,将触发此操作。
有关链接的行为和交互,请参阅 链接。
Styles 样式
要了解不同的链接样式,请参阅 链接。
Guidelines 指南
在桌面和平板设备的下拉菜单中,仅显示面包屑路径中不可见的链接。
在智能手机的下拉菜单中,按层级顺序显示面包屑路径中的所有链接。
原文:Breadcrumb | SAP Fiori Design Guidelines
备注:文章内容翻译自 SAP - Fiori Design Guidelines。翻译包含个人理解,仅作为个人学习笔记使用。如有错误,求指正呀,非常感谢 ^^
网友评论