Android应用UI设计模式——1.7　搜索结果屏幕

重新设计主屏幕和信息架构后，下面将注意力转向搜索结果屏幕，因为用户在主屏幕中执行搜索后，会立即显示搜索结果。 1.7.1　重新设计前 总体而言，将AutoTrader应用移植到Android时，也未按Ice Cream Sandwich和Jelly Bean设计指南修改其搜索结果屏幕，如图1-14所示。这个屏幕遵循的主要是iOS标准，只是偶尔遵循了Android标准。这个屏幕包含三个按钮：两个显示的是文本，另一个显示的是图标，都带圆角和斜边。另外，显示每项结果时，都使用了iOS中的右箭头（>）。与前面的主屏幕一样，可轻按设备底部导航栏中的菜单按钮来访问顶级导航菜单。 图1-14　原来的搜索结果屏幕 1.7.2　重新设计后 在搜索结果屏幕中，完全可以不显示顶级导航菜单。如果用户需要访问该菜单，可轻按左上角的图标，返回主屏幕后再轻按这个图标。这就为上下文操作按钮Filter、Map和Share腾出了空间，如图1-15所示。 图1-15　重新设计后的AutoTrader搜索结果屏幕，其中包含标题栏（第1版） 从Ice Cream Sandwich起，分享就比较特殊了，因为有多项内置的分享功能，所以可按Android UI设计标准将Share设计为标准下拉列表。对于余下的按钮Map和Filter，将它们实现为Android风格的图标（平面化单色图标），并放在操作栏右边。这是实现地图列表关系的方式之一，第7章和第8章将讨论众多有效的搜索和筛选模式。 除将操作栏合并到标题栏中外，也可添加一个用于选择多个视图（每种汽车排序方式一个视图）的下拉列表。这样，屏幕标题（汽车制造商和型号）显示在下拉列表上方。建议采用这个版本，因为它充分利用了Android 4.0的功能，如图1-16所示。 图1-16　重新设计后的AutoTrader搜索结果屏幕，其中包含一个用于选择排序方式的 下拉列表（第2版） 需要指出的最后一点是，搜索结果不包含右箭头（>）。前面说过，应允许轻按屏幕的任何地方，且不使用任何视觉指示器。对于在用户看来很重要的操作（如显示结果详情屏幕的操作），应让用户能够通过触摸完成，且不提供任何视觉指示器。既然说到结果详情屏幕，现在该假设用户轻按了搜索结果，看看如何重新设计第三个也是最后一个屏幕——结果详情屏幕。