Panoramic 控件设计举例

英文原版博客：http://windowsteamblog.com/windows_phone/b/wpdev/archive/2011/03/15/designing-hubs-good-examples-using-the-panoramic-control.aspx

 

        在开发者社区，我被问的最多的一个问题就是“你能给我们一个关于Panoramas的例子吗？”在之前的一些帖子中，我们称呼“Panoramic 控件”为“hub”,或者简单的称之为卷轴视图，该控件使用一个水平的且长度超出屏幕大小限制画布来呈现内容，非常独特。这个形象化模型是WP平台的标志性元素，因此所有的应用程序都能用到它。事实上，在大多数情况下，panorama控件是用户进入应用程序的时候首先看到的地方，这也赋予了这个控件更多的意义。

    首先，我们可以把panorama想象成杂志的封面。同样的，panorama允许用户浏览那些突出显示的，相对重要的内容，并且，那些突出的内容应该是进一步操作的入口。Panorama应该聚焦于一些为数不大的新鲜的，动态 的并且是引人瞩目的任务。在你的应用程序中，panorama既不应该是单独交互的，也不应该是铺天盖地，密密麻麻，无所不包。

    基于上述内容，我将给大家展示一些遵循上述规范的例子。

   Facebook展示了一种很好的混合格式，该格式把用户感兴趣 的几种内容混合在了一起。Twitter也是这样，尽管在其上显示的内容只是一些简单的列表。

 

使用背景图片

   Panoramas可以有一个背景图片（固定的或者是可更新的），这个背景帮助使应用程序强调主题，或者添加一个良好 的触感去增加屏幕感染力。你可以使用一个包含应用程序图标或者相关照片的纹理或者图片来实现这个效果。在这两种情况下要确保背景图片有足够的对比度，以便于文字或其他内容能够很容易被识别出来，而不至于和背景图片混在一起，无法识别。背景图片也应该淡化处理，不应该比内容更加吸引用户。

   下面是几个非常恰当的使用背景图片的例子。

 

瓷砖格式

   大多数情况下Hub包含一些能链接到相关内容的瓷砖，那些内容可能是照片，名片，新闻或者电影。在你的panorama里使用瓷砖没有太多的限制。几乎只要符合网格布局的要求就能使用。矩形适合于电影海报，正方形适合于画像，全景视图可以作为新闻标题或者风景投影，甚至作为不同尺寸的图形的混合物也能很好工作，就像是一个拼贴画风格的壁纸(请查看本文开头部分的Facebook Hub)。

下面是一些使用了不同尺寸和风格的瓷砖的例子。

 

 

 

如何在不同格式的部分使用滚动功能？

    注意上面的一些例子中在滚动部分混合使用了不同的方法，图片的滚动只能是水平进行的，文字列表的滚动只能是垂直进行的。

    同一部分内容不能使用两种滚动方式，在一些Hub中我们常见的一种错误是在包含瓷砖的部分既能水平移动，也能垂直移动，以至于迫使用户使用摇动代替了滚动。摇动不是预期的结果，这破坏了用户的心理模型，是他们不能看到本部分的全部内容。

    如果你正在开发一个非常随意的使用panoramic控件的应用程序，你可以通过本章节的例子去获取灵感。如果你有资源或者才能，并且想出了一种合乎要求的并且是非常独特的使用方法，请告诉我。在以后的文章中我们将展示一些更加具有创造性或不合常规的使用panoramic控件的例子。