标签栏 人机界面指南

发布时间 2023-08-30 10:25:31作者: papering

Tab bars | Apple Developer Documentation https://developer.apple.com/design/human-interf

标签页栏

标签页栏使用栏项目在同一视图中的互斥内容面板之间导航。

标签页栏的风格化表现形式,该栏中包含带名称的四个占位符图标。图像呈红色,以巧妙地反映原始六色 Apple 标志中的红色。

标签页栏可帮助用户理解视图提供的不同类型信息或功能,还可让用户在视图的不同部分之间快速切换,同时保留各个部分中的当前导览状态。

有关在 macOS 中使用类似组件的指南,请参阅标签页视图

最佳实践

使用标签页栏支持导航,而非提供操作。标签页栏可以让用户在 App 的不同区域之间导航,比如“时钟” App 中的“闹钟”、“秒表”和“计时器”标签页。如果你需要提供可操作当前视图中元素的控件,请改用工具栏

确保当用户导航到 App 中的不同区域时,标签页栏可见。但模态视图中的标签页栏是个例外。由于模态视图提供的独立体验可让用户在完成时将其关闭,因此隐藏该视图的标签页栏不会影响 App 导航。

使用最少数量的标签页来帮助用户在你的 App 中导航。每增加一个标签页都会增加 App 的复杂性,让用户更难以定位信息。尽量使用少量含短标题或图标的标签页,以避免造成拥挤并导致标签被截断。一般情况下,在 iOS 中使用最多 5 个标签页,在 visionOS、iPadOS 和 Apple tvOS 中使用最多 6 个标签页。

保持标签页可见,即使其内容不可用。如果标签页在某些情况下可用,但在其他情况下不可用,App 的界面可能会显得不稳定和不可预测。必要时,应解释标签页内容不可用的原因。例如,即使 iOS 设备上没有音乐,“音乐” App 中的“现在就听”标签页仍然可用,并提供下载音乐的建议。

为每个标签页标题使用简明术语。有用的标签页标题通过清晰地描述标签页所包含的内容类型或功能来辅助导航。尽量使用单个字词或很短的短语,例如“音乐”、“共享”、“资料库”或“为你推荐”。考虑避免使用“家庭”这样的通用术语,因为这类术语缺乏特定性且在不同 App 中的含义也有所不同。

使用标记以不引人注目的方式传达信息。你可以在标签页上显示一个标记(包含白色文本和数字或感叹号的红色椭圆),以指示有与该视图或模式相关的新信息可用。有关指南,请参阅通知

ace-guidelines/tab-bars

标签页栏 | Apple Developer Documentation https://developer.apple.com/cn/design/human-interface-guidelines/tab-bars