IOS 12设计规范(7-2)图标和图像:搜索栏(Search Bars)

7.2      搜索栏(Search Bars)

人们使用搜索栏来搜索⼤量的数据。有两种样式的搜索栏 –  突出(默认)和最小。联系人采用突出的风格,其中包括明显的有⾊背景。照片使用最小的风格,这 有利利于与周围的界面更协调。搜索栏默认是半透明的,但可以使其不透明。适用时,可以将搜索栏配置为⾃动隐藏导航栏。

IOS12设计规范

搜索栏包含单个搜索字段,可以包含占位符文本和清除按钮:     除了搜索字段之外,搜索栏还可以包含用于退出搜索的“取消”按钮。

让用户通过搜索栏而不文本框去搜索: 文本框不具备搜索栏所拥有的外观 特征。

根据搜索的重要性,选择搜索栏样式: 如果搜索是应用程序中的主要功能,请使用默认的突出显示样式的搜索栏。 如果搜索不频繁,请使用最小样式 。

如有必要,请在搜索栏中提供提示和搜索范例: 搜索字段可以包含占位符文本, 例如“搜索服装,鞋⼦子和配件”或简称“搜索”,提醒您正在搜索。 也可以在搜索栏的正上方显示一个简洁的,含有适当标点符号的一行句句⼦子,以提供指导。 例如,股票在搜索字段上方使用⽂字,让人们知道他们可以输入公 司名称或股票代码。

IOS12设计规范

考虑在搜索栏下方提供有用的快捷方式和其他内容:使用搜索栏下的区域来 帮助人们更快地获得内容。 例如,Safari可以在您点击搜索后⽴即显示您的 书签。   选择一个可以直接进⼊,而不用输入任何搜索字词。股票在您输入搜索字段时显示结果列表。  随时点击一个,而不再输入任何字符。开发者指南,请参 阅 UISearchController 和 UISearchBar 。

 

范围栏

范围栏可以添加到搜索栏中,让人们更完善搜索的范围。范围栏采用搜索栏的外观。

IOS12设计规范

倾向于改进包含范围栏的搜索结果:专注于优化搜索结果而不是一味添加范 围栏。当用户想在定义明确的类别中搜索时,范围栏会有很⼤的帮助。但是,更好的做法是优化搜索结果,这样用户就无需通过范围栏进行筛选了。请参阅 UISearchBar 。

文章转载请注明出处,并需展示来源网址!:淘盒子 » IOS 12设计规范(7-2)图标和图像:搜索栏(Search Bars)

赞 (0) 打赏

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏