#Win8# 开发你的第一个App《Dota宝典》

　　上一篇中我们以“拆分布局应用程序”模板给大家大致介绍了一下Win8 App的开发流程，这一篇我们将尝试修改该模板来创建我们的第一个Win8 App——《Dota宝典》。

　　首先我们先创建一个“拆分布局应用程序”的项目工程模板，工程名为“Dota宝典_Pra”。



　　

　　打开项目工程菜单的DataModel文件夹中的SampleDataSource.cs文件（上一篇中提到过该类文件为整个App的默认绑定数据源），找到如下XML标注

　　/// <summary>
　　/// 创建包含硬编码内容的组和项的集合。
　　///
　　/// SampleDataSource 用占位符数据而不是实时生产数据
　　/// 初始化，因此在设计时和运行时均需提供示例数据。
　　/// </summary>

　　其下类中的SampleDataSource()方法就封装了该项目工程的所有数据集合，其中SampleDataGroup类绑定为ItemsPage页面中的数据源，其包含成员有：

　　UniqueId：标记每个组的特定ID

　　Title：每个组的大标题

　　SubTitle：每个组的小标题

　　ImagePath：每个组的封面图片路径

　　Description：每个组的描述　　

　　SampleDataItem类绑定为SplitPage页面中的数据源，类成员与上面类似。Group类与Item类为集合与集合项的关系。

　　在这里我们将第一组数据源修改为

var group1 = new SampleDataGroup("Group-1",
"曙光酒馆",
"效力于近卫军团的智力型英雄酒馆",
"Images_Shuguang/Shuguang.png",
"");
group1.Items.Add(new SampleDataItem("Group-1-Item-1",
"水晶室女",
"Rylai Crestfall 简称:CM",
"Images_Shuguang/1.jpg",
"经过寒冰泉巨魔冰冻魔法师Raishali的长年训练，Rylai善于运用令人叹为观止的禁制魔法，她的绝技是异常强大的范围杀伤技能。Rylai称得上是近卫军团所拥有的最为强大的法师之一。",
"       作为一个辅助型英雄，辉煌光环是冰女的核心技能，全屏的的回魔能够为队友提供更强的续航能力，所以7级必须升满；而冰霜新星的减速和冰封禁锢能够帮助和支援队友的gank，关键时还能救命，所以前期都要升，不过由于冰封禁锢的控制时间会随等级上升，而冰霜新星的减速为固定的5秒，所以冰封禁锢要第二个升满；大招极寒领域的AOE伤害非常可观，可以用于清兵和团战，不过由于需要持续施法和冰女过于脆弱，因此作用不太明显，16级升满级可；前期黄点能够撑一些属性。",
group1));
group1.Items.Add(new SampleDataItem("Group-1-Item-2",
"魅惑魔女",
"Aiushtha 简称:AS",
"Images_Shuguang/2.jpg",
"虽然所有森林女神都是赛那留斯的女儿，但Aiushtha却是赛那留斯的第一个女儿，也是他最疼爱的一个。因为这层关系，Aiushtha能从赛那留斯那里借取更多的力量。之所以这么说，一是因为她能控制那些害羞的小精灵去医治自己的盟军，二是因为她能够让一个敌人服从近卫军团的意愿。",
"       自然之助作为小鹿的核心技能应该在前期优先升满，首先升一级魅诱在出门时能够找到不错的野怪能够在前期提供不少帮助，不过如果非打野流前期一级足矣；不可侵犯技能等级高后基本能对物理攻击免疫，配合自然之助使小鹿有肉的资本，因此自然之助满后可优先升级不可侵犯；大招推进是小鹿作为前中期DPS和Ganker的最大资本！",
group1));

　　

　　在项目工程中创建Images_Shuguang文件夹，并将其中导入Shuguang.png || 1.jpg || 2.jpg三张图片，这时按F6进行编译，大家是否发现ItemsPage页面和Splitpage页面中发生了变化呢？





　　接下来我们可以继续修改该数据模版，补充更多的Dota英雄数据和图片。

　　数据源修改完成后，我们将当前页面切换到ItemsPage.xaml页面，在Images_Shuguang文件夹中导入一张背景图片，重命名为background.png，在当前窗口右侧xaml代码中的首起Grid布局下添加代码

<Grid.Background>
<ImageBrush Stretch="UniformToFill" ImageSource="./Images_Shuguang/background.png"/>
</Grid.Background>

　　按F6进行编译，我们会发现左侧的模拟器中已经添加上了背景图片。按F5运行，运行截图如下所示





　　怎么样？第一个Win8 App——《Dota宝典》已经初步完成了，还挺有成就感的吧？PS：为了让UI更好看一些，ItemsPage页面的pageTitle我已经将它隐藏了，改为在背景图中显示Titile，SplitPage页面中也加入了背景图片。

　　下一篇将为大家介绍如何在Win8 App中使用Secondary Tile。