原文地址：http://channel9.msdn.com/Series/Windows-Phone-8-Development-for-Absolute-Beginners/Part-13-Styling-Tiles-in-the-LongListSelector
查看本栏目更多精彩内容：http://www.bianceng.cnhttp://www.bianceng.cn/OS/extra/
系列地址：http://channel9.msdn.com/Series/Windows-Phone-8-Development-for-Absolute-Beginners
源代码: http://aka.ms/absbeginnerdevwp8
PDF版本:http://aka.ms/absbeginnerdevwp8pdf
在上一课，在将新数据模型关联到MainPage.xaml方面我们取得了很多进展，现在我们需要关注LongListSelector的DataTemplate的布局。我们希望调整每个SoundData实例以使他们看上去像磁贴而不是行。所以，如果我们将应用程序用户界面的当前状态与我们的图纸进行比较，当前的布局并不合理。在本课中我们将对它进行改进。
计划：
我们将修改该LongListSelector以利用Grid布局模式。
我们将彻底重新修改每个DataTemplate以使它们更像磁贴。
因为我们需要五到六个PivotItem，每个PivotItem都包含自己的LongListSelector，没有必要为每个PivotItem定义磁贴布局，所以我们会将它们抽象到一个集中的模板中以便MainPage.xaml中的所有LongListSelector均可以使用它。
1. 将LongListSelector的LayoutMode更改为Grid
LongListSelector控件包含一个LayoutMode属性。它接受List(缺省)或Grid两个枚举值。通过将LayoutMode设置为Grid并根据长度和高度设置单元格的大小，我们可以迅速地更改LongListSelector的外观。
通过添加49和50行，LongListSelector的外观如下：
每个DataTemplate的实例看上去像一个磁贴。
2. 修改DataTemplate以创建我们需要的布局
接着我们需要修改DataTemplate以匹配我们希望的布局。我将高亮显示并删除DataTemplate中的内容：
接着我将从仅有一个单元格的Grid开始。在Grid中，我将在磁贴的底部使用TextBlock显示声音的名称。我将使用一个StackPanel将它包围起来，这样我就可以稍后在Grid的单元格中设置它的垂直位置。所以我在DataTemplate中添加以下代码：