本文是“Windows Phone 7 开发 31 日谈”系列的第16日。
昨天，我们讨论了独立存储以及如何在程序中将数据保存至设备上。今天，我将完全变换视角，来介绍一个我们可以使用的相对较新的（但十分强大的）控件：全景视图控件。
什么是全景视图控件？
如果你看过Windows Phone 7“HUB”的视频或是截图，全景视图是被广泛运用的。简而言之，它就是选项，导航和数据的多屏幕滚动菜单。下面是一些示例：
好了，现在我们知道全景视图长什么样了，来看看如何实现吧。
创建一个全景视图项目
在这个系列的前15日中，每个项目都是基于默认的Windows Phone Application模板的。对于全景视图来说，如果你喜欢，可以使用Windows Phone Panorama Application模板。它在下面的列表中：
然而，很重要的一点是你不是只能使用这个模板来创建一个全景视图。这个项目模板利用了MVVM框架（一种很好的方法），为你预先写好了很多内容。如果想简单一些，全景视图控件是我们可以使用的另一种控件，我们可以将它添加到任意的页面中去。这正是本文想要向你展示的内容。
从工具箱中添加一个全景视图
添加全景视图到你的页面中的第一件事就是它不是可用的默认控件（这就是它没有显示在你的Visual Studio 2010工具箱中的原因）。在使用之前你必须在页面中添加特定的名称空间。简单的做法是将它添加到工具箱中，然后从中重用它。
首先打开你的工具箱，右击“Windows Phone controls”标签。从列表中选择“Choose Items…”。
在出现的对话框中，它自动载入并为你打开Windows Phone Components标签。你会看到有很多已经被勾选的控件，这些就是当前在你工具箱中的。向下滚动直到找到Panorama，并添加它（明天我们会讲解枢轴控件，所以你也可以将它一并添加进来）。
一旦你在工具箱中添加了这些，你就可以很简单地在页面中加入全景视图控件了。
在页面中添加全景视图
做完前面的步骤会让你在后面更加轻松。删除掉页面中的所有XAML元素，然后添加你的全景视图。通过从工具箱中拖拽一个全景视图控件，一切就都被设置好了。默认的语法看起来如下：
哈，开始时的内容不多。你还应该注意，在页面中添加一个新的XML名称空间：
既然我们在页面中使用了最少量的代码，让我们来看看现在这个全景视图控件长什么样。下图展示了全景视图控件每个不同部分的样子：
设置全景视图的背景和标题
全景视图控件最酷的一个特色就是可以用一张很大的图片当做背景，它比其余的内容滚动的要慢。找一张绚丽的，有代表性的图片用在程序中。这是我的图片（我的应用程序是用于你在饭馆等吃的时消磨时间的。哦，这是在bowling Green的Corner Grill餐馆）：
想将它用于全景视图控件的背景，我需要将图片添加到项目中，然后创建一个ImageBrush，用此图作为源。你会注意到我将图片的透明度设为了50%。这是因为白色文字在这种亮图上显示的效果不太好。
<controls:Panorama.Background>
<ImageBrush ImageSource="PanoramaBackground.jpg" Opacity=".5" />
</controls:Panorama.Background>
</controls:Panorama>
在电话上看起来像这样：
好了，现在有背景图了。让我们来添加一些内容吧。
创建PanoramaItem（全景视图的项）
现在，我们的程序还不能很好的工作。它仅仅显示了背景图片，还不能滚动，或者显示任何东西。通过添加PanoramaItem，我们可以创建全景视图中独立的项，在这些PanoramaItem中，我们可以添加XAML来显示这些项。
每个PanoramaItem是完全独立于另一个的，所以你可以从技术上让每个项完全不同。我会向你展示PanoramaItem的代码，并且我们会在下一节讨论自定义内容。你会在下面注意到我定义了3个PanoramaItem，并为每一个都设置了标题。这样在截图中可以更好地显示，所以我在代码中包含了它们。
<controls:Panorama.Background>
<ImageBrush ImageSource="PanoramaBackground.jpg" Opacity=".5" />
</controls:Panorama.Background>
<controls:PanoramaItem Header="learn">
</controls:PanoramaItem>
<controls:PanoramaItem Header="play">
</controls:PanoramaItem>
<controls:PanoramaItem Header="all">
</controls:PanoramaItem>
</controls:Panorama>