第19章 导航和布局设计模式

来源:互联网 发布:淘宝创建时间 编辑:程序博客网 时间:2024/05/17 09:27

第19章 导航和布局设计模式

 

导航和布局设计模式可以帮助你以直观和用户熟悉的方式来显示内容到屏幕上,这样可以很容易上手和使用。这些设计模式可以帮助你安排信息与信息间的布局关系。这章会讲到如下这些布局设计模式:

 

1、Stacked galleries

2、Dashboards

3、Workspaces

4、Split view

5、The Expand-in-Context pattern

6、Side navigation

 

使用画廊(Stackedgalleries)

使用画廊可以在屏幕的一个地方展示多个独立的资源,并且很容易在它们之间切换。

 

问题描述

如果一个应用需要展示很多资源或应用有很多不同类型的资源分类,并且需要大概预览不同分类中的资源(特别是很多图片啊之类的)。如果将这些资源分散在不同的页面里,那用户就需要花较多时候在导航切换上面。

 

解决方案

通过以流动展示或分门别类的展示在独立的可滚动的画廊组件上,这样应用就能在显示大量信息和预览所有信息之间做一个平衡。Pulse应用就是利用画廊显示用户数据流的好例子。如图19-1显示了如何分别地显示不同分类的信息,并且可以用水平拖动手势来滚动内容。每次只会水平滚动一组内容。这样用户就可以在一个类别中浏览所有的内容项了。如图19-2显示了用户可以通过上下拖动手势将所有的类别向上或向下滚动。这样用户就可以在所有的类别中概览最新的内容了。

 

结论

当需要设计一上导航的时候,能以简单的方式让在众多复杂的分类资源相互切换是很牛X的。所有的交互都很容易明白,不需要多余的解释。拖拽手势是最好的手势之一,因为它很符合人们的直觉。

 

附加功能

每个分类的画廊还可以使用之前第18章中讲到的下拉刷新(pull-to-refresh)设计模式。只需要改变一下方向就可以了(向右拉)。

 

大屏幕适配

每个分类的画廊都能够容易的适配到大屏幕上。因为使用的组件在垂直和水平方向都做了扩展,都能够完全利用屏幕空间。图19-3显示了Pulse应用在平板上的样子。

 

具体实现

可以很容易的使用安卓标准组件实现画廊。首先就得用一个滚动视图(scrollview)包裹着一个线性布局的画廊组件,一个分类一个画廊。然后要实现所有分类在垂直方向同时滚动和每个分类各自在水平方向上的滚动。

Tip:在实现的时候你可能会遇到滚动视图锁定了滚动模式。想要实现非锁定的,可以在这里找到方案:https://github.com/Cyanogen-Mod/android_packages_apps_Email/blob/ics/src/com/android/email/view/NonLockingScrollView.java.

 

 

此章未完待续。