构建Windows Phone7 应用程序 有米分享.doc

有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 1 75 构建构建 Windows Phone7 应用程序应用程序 试试 阅阅 默认状态下 designer 会把这个文件用分隔视图显示 一个窗口显示 XAML 标记 另 一个窗口显示了所见即所得的用户界面元素设计视图 模板中显示的是应用程序的名 称和标题 您可以根据需要删除它们 除此之外 XAML 文件还可提供给您一个空白的 类似画布的操作区域 您可以通过添加控件来创建自己的应用程序的用户界面 图表图表 1 XAML 设计工具 designer 展示了应用程序的主用户界面 注释注释 可扩展的应用程序标记语言 XAML 是一种声明性语言 您可以利用声明 XAML 标记来创建可见的用户界面元素 然后再利用一个代码隐藏文件对 XAML 中声明的事 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 2 75 件做出反应 并操作在 XAML 中已经声明的对象 用一种基于 XAML 的声明性语言来创 建接口 从原型到生产整个过程都是非常直观的 特别是对那些有网页设计和技术背 景的人来说更是如此 正正 文文 目录目录 概述概述 3 练习练习 1 利用利用 MICROSOFT VISUAL STUDIO 2010 EXPRESS 为为 WINDOWS PHONE 创创建建 WINDOWS PHONE 应应用程序用程序 6 任务 1 在 Visual Studio 中创建一个 Windows Phone 应用程序工程 6 任务 2 在 Windows Phone Emulator 中构建并测试应用程序 14 任务 3 为主页设计用户界面 19 任务 4 在应用程序中处理错误 23 任务 5 验证 26 练习练习 2 在在 VISUAL STUDIO 中中创创建建拼图拼图板板 28 任务 1 创建用户界面 29 任务 2 编程实现应用程序逻辑 34 任务 3 增加 Multi Touch 支持 43 任务 4 创建动画效果 52 任务 5 验证 56 练习练习 3 使用使用独独立的存立的存储储保存游保存游戏戏的的状态状态 58 任务 1 添加程序集引用以及其他 Assets 58 任务 2 更新 Puzzle UI 60 任务 3 验证 65 总结总结 68 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 3 75 概述 本实验手册向您介绍为 Windows Phone 应用程序构建和测试一个 Silverlight 所需要的工 具和过程 实验手册通过一个简单的益智游戏开发的全过程以及其不同阶段 开始一 个新的项目 添加控件 代码隐藏 测试和调试 来向您展示开发 Windows Phone 应 用程序的基本原则 这个实验涵盖了 Windows Phone 平台几个关键的特性 包括 导航功能 多点触摸和 独立存储 目目标标 这个实验的对象是那些对 Microsoft 工具 例如 Visual Studio 了解较少 且对 Silverlight 非常陌生的开发人员 如果您对 Silverlight 的编程模型感到很适应 且已经开始利用 Visual Studio 和 Microsoft Expression 套件进行工作 那么您可以考虑略过本实验 从另 一方面讲 如果您完全对 Silverlight 不了解 我们强烈建议您查阅一些与 Silverlight 相 关的实验来丰富您的 Silverlight 技能 这些实验的内容可以从下面这个站点找到 在这个实验手册中 您将会学到 Windows Phone 开发人员使用的工具更加熟悉 针对 Windows Phone 的 Microsoft Visual Studio 2010 Express 版本和 Windows Phone Emulator 这些就是 您创建和测试任何可被管理的 Windows Phone 应用程序所需要的工具 学习针对 Windows Phone 应用程序的 Silverlight 的基础结构 同时学到 Silverlight 和针对 Windows Phone 的 Silverlight 之间的不同 利用针对 Windows Phone 的 Microsoft Visual Studio 2010 Express 和 Windows Phone Emulator 编写 测试 部署和调试 Windows Phone 应用程序的 先决条件先决条件 要完成本动手实验 您需要以下工具 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 4 75 用于 Windows Phone 的 Microsoft Visual Studio 2010 Express 或者是 Microsoft Visual Studio 2010Windows Phone Developer Tools Windows Phone 开发者工具 注释注释 您可从该网址下载工具 安装安装 为了方便 本实验手册中的大部分代码以 Visual Studio 代码段的形式提供 要安装代码 段 在 lab s 下的 Source Setup 文件夹 执行 vsi 安装程序 注释注释 如果你在执行代码片段的安装程序时遇到问题 你可以通过拷贝 Source Setup CodeSnippets 文件夹下的所有 snippet 文件到目录 My Documents Visual Studio 2010 Code Snippets Visual C My Code Snippets 来进行手动安装代码段 使用代码段使用代码段 利用这些代码段 您实际上已经获得了编程操作所会用到的所有代码 这个实验文档 将会准确的告诉您何时使用这些代码 例如 图表图表 2 使用Visual Studio代码段把代码插入到你的工程里 为了把代码段添加到 Visual Studio 中 你只要把光标放在你想插入的代码上 开始输入 段的名字 没有空格和连字号 看到 IntelliSense 显示的段名 然后当你想要的段名 被选中时 敲击 Tab 键两次 代码将会被插入到光标的位置 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 5 75 图表图表 3 开始输入段名 图表图表 4 敲击Tab键来选中高亮的段 图表图表 5 再次敲击Tab键来展开段 使用鼠标而不是键盘来插入代码段 在你想插入代码段的地方点右键 选择 My Code Snippets 下的 InsertSnippet 然后从列表中挑选相关的代码段 想学习更多的 Visual Studio 代码段 包括如何创建自己的代码段 请参考 练习练习 本实验手册包含以下练习 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 6 75 1 利用 Microsoft Visual Studio 2010 Express 为 WindowsPhone 创建 Windows Phone 应用程序 2 在 Visual Studio 中创建拼图板 3 利用独立存储来保持游戏状态 完成此实验需耗时 60 分钟 分钟 练习 1 利用 Microsoft Visual Studio 2010 Express 为 Windows Phone 创建 Windows Phone 应用程 序 在这个练习中 您将学会如何创建 测试 部署和运行您的第一个 Windows Phone 应 用程序 您将会学会如何使用 Windows Phone 开发者工具 包括 用于 Windows Phone IDE 的免费工具 Microsoft Visual Studio 2010 Express 和 Windows Phone Emulator 任务包括为 Windows Phone 工程创建一个新的 Silverlight 设计应用程序的起始页面 提供一些基础的容错处理 您同样将会把应用程序运行在工作站的 Windows Phone Emulator 上 注释注释 本次动手实验的步骤阐明了 Windows Phone 上 Microsoft Visual Studio 2010 Express 的使用过程 但是它们同样适用于带 Windows Phone 开发工具的 Microsoft Visual Studio 2010 通常 操作指南里提到的 Visual Studio 对这两个产品都适用 任务任务 1 在在 Visual Studio 中创建一个中创建一个 Windows Phone 应用程序工程应用程序工程 这个任务中 您将会利用针对 Windows Phone 的 Microsoft Visual Studio 2010 Express 工具内嵌的模板来创建一个 Windows Phone 应用程序工程的 Silverlight 可以把这做 为您第一个要开发的 Window Phone 应用程序的起点 1 从操作系统的 Start All Programs Microsoft Visual Studio 2010 Express Microsoft Visual Studio 2010 Express for Windows Phone 中启动用于 Windows Phone 应用程序开发的 Microsoft Visual Studio 2010 Express 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 7 75 Visual Studio 2010 从操作系统的 Start All Programs Microsoft Visual Studio 2010 启动 Visual Studio 2010 2 在 File 菜单 选择 New Project Visual Studio 2010 在 File 菜单 指向 New 然后选择 Project 3 在 New Project 对话框 从安装的模板列表里选择 Silverlight for Windows Phone 类别 然后选择 Windows Phone 应用程序模板 把 name 栏改为 WindowsPhonePuzzle 同时把 location 设为在实验目录下 Source 文 件夹中的 Ex1 CreatingWP7Apps 更改 solution name 为 Begin 然后点击 OK 图表图表 6 在用于Windows Phone的Microsoft Visual Studio2010 Express中创建一个新的 Windows Phone应用程序 注释注释 如果您已经完成培训教材中 Hello Pone 的实验 您可能已经对下面的材 料非常熟悉 可能会直接创建一个 begin 解决方案执行这个练习中任务 3 的操 作 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 8 75 4 在 Solution Explorer 中 查看基于 Windows Phone 应用程序模板产生的解决 方案的结构 Visual Studio 解决方案是该解决方案下所有工程项目的容器 本例中的解决方案只包含了一个名为 WindowsPhonePuzzle 的 Silverlight Windows Phone 工程项目 图表图表 7 Solution Explorer 包含一个名为WindowsPhonePuzzle的应用程序 注释注释 Solution Explorer 允许用户在解决方案或工程项目中查看其包含的项 Item 以及对项进行管理操作 要启动 Solution Explorer 在键盘上按下 CTRL W S 或者在 View 菜单 选择 Other Windows Solution Explorer WindowsPhonePuzzle 项目包含以下项 Item 项项描述描述 App xaml App xaml cs定义应用程序的入口点 初始化应用程序范围内的资源 显示 应用程序用户界面 MainPage xaml MainPage xaml cs 定义应用程序中的程序页面 带有用户界面的页面 ApplicationIcon png一种带有图标的图像文件 代表了手机应用程序列表中应用程 序的图标 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 9 75 Background png一种带有图标的图像文件 代表了在开始页面上应用程序的图 表 SplashScreenImage jpg这个图片会在应用程序第一次被启动时显示 启动画面会给用 户一个即时的反馈 告诉用户应用程序正在启动直到成功跳转 到应用程序的第一个页面 用户的启动画面可以和应用程序的 一个页面设计的非常相似 这样能给使用这一个应用程序被快 速加载的感觉 Properties AppManifest xml一个生成应用程序包所必需的应用程序清单文件 Properties AssemblyInfo cs包含名称和版本的元数据 这些元数据将被嵌入到生成的程序 集 Properties WMAppManifest x ml 一个包含与Windows Phone Silverlight应用程序相关的特定元 数据的清单文件 且包含了用于Windows Phone的Silverlight所 具有的特定功能 References folder一些库文件 集 的列表 为应用程序的工作提供功能和服务 5 首先 在 Solution Explorer 中右键单击 App xaml 并选择 View Designer 注 意这个文件的 XAML 标记 它有一个叫 Application 的根元素 在这个根元 素中有一个叫 Application Resources 的段 此处 您可以定义应用程序级别 的资源 例如整个应用程序使用的颜色 画笔以及样式对象 这段 XAML 代码初始化了 Application 的 ApplicationLifetimeObjects 属性 创建 了一个 PhoneApplicationService 对象 PhoneApplicationService 类提供了应用程 序不同生命阶段的访问功能 包含了对应用程序处于空闲状态的管理 也包含 了当应用程序处于有效或无效状态时的管理 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 10 75 图表图表 8 基于Windows Phone应用程序模板产生的缺省App xaml文件 注释注释 App xaml 文件 连同其代码隐藏文件 App xaml cs 共同定义了 Application 类的实例 这个类封装了用于 Windows Phone 的 Silverlight 并提 供了一个入口点 6 现在 在 Solution Explorer 中右键单击 App xaml 并选择 View Code 来打开一 个代码隐藏文件 请注意 在 Application 的派生类的构造函数中已经有一 个针对 UnhandledException 事件的句柄 在后面的实验中 您将会更新模 板生成的句柄来实现跳转到一个错误页面及显示错误信息的功能 Application 类的 RootFrame 属性标识了应用程序的启动页面 所有的 Windows Phone 应用程序都有一个最顶层的容器元素 它的数据类型是 PhoneApplicationFrame 这个框架承载了一个或多个用来标识应用程序内容的 PhoneApplicationPage 元素 同时它还被用来处理不同页面之间的导航切换 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 11 75 图表图表 9 应用程序的代码隐藏文件展示了全局事件句柄 注释注释 以 Windows Phone 应用程序模板为基础的 Silverlight 所生成 Application 类 除了对上述事件的句柄外 还包含了对 Launching 和 Closing 事件的句柄 您可以通过更新这些方法的代码来实现当 Windows Phone 应用程序启动和关 闭过程中执行自己定制过的代码 7 新生成的工程项目包含一个缺省的文件 该文件里包含了用来定义应用程序 主用户界面的 XAML 标记 用户如果要在 designer 中查看这个文件 则需在 Solution Explorer 中右键单击 MainPage xaml 默认状态下 designer 会把这个文件用分隔视图显示 一个窗口显示 XAML 标 记 另一个窗口显示了所见即所得的用户界面元素设计视图 模板中显示的是 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 12 75 应用程序的名称和标题 您可以根据需要删除它们 除此之外 XAML 文件还 可提供给您一个空白的类似画布的操作区域 您可以通过添加控件来创建自己 的应用程序的用户界面 图表图表 10 XAML 设计工具 designer 展示了应用程序的主用户界面 注释注释 可扩展的应用程序标记语言 XAML 是一种声明性语言 您可以利用声 明 XAML 标记来创建可见的用户界面元素 然后再利用一个代码隐藏文件对 XAML 中声明的事件做出反应 并操作在 XAML 中已经声明的对象 用一种基 于 XAML 的声明性语言来创建接口 从原型到生产整个过程都是非常直观的 特别是对那些有网页设计和技术背景的人来说更是如此 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 13 75 8 ApplicationIcon png 文件包含的图标文件 就是那些在电话设备上快速启动 页面中代表应用程序的图标 您可以在 Solution Explorer 上右键单击该项 用在你机器上注册的图像编辑应用程序来打开它 例如 Paint exe 注释注释 Visual Studio 2010 中 在 Solution Explorer 上右键单击图标文件 该文件 会在内嵌的图像编辑器中打开 9 一个 Windows Phone 应用程序通常需要用到基础平台或者其他类库来提供 服务 要先使用这个优势功能 应用程序需要首先引用实现这些服务的程序 集 要显示一个项目工程引用的程序集 在 Solution Explorer 中展开 References 节点 然后查看程序集列表 它包含了 Silverlight 一般的程序集 以及具体到 Windows Phone 平台的程序集 图表图表 11 Solution Explorer 展示了被项目工程引用的程序集合 10 项目工程的 Properties 视窗是编辑 WP 清单文件的唯一方式 正如下表所示 想打开这个窗口 在 Solution Explorer 中右键单击 WindowsPhonePuzzle 项 目然后选择 Properties 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 14 75 图表图表 12 项目属性窗口 注释注释 Windows Phone 项目属性窗口允许您更改一些电话程序专用的属性 这 些属性关系到应用程序在电话设备上的部署和外观效果 所有相关参数被存 储在 WMAppManifest xml 文件中 即使您试图手动更改过这个 XML 文件 只 要在这个对话框中对您的项目进行更改设置并保存 其结果都会自动覆盖您 之前的手动更改 任务任务 2 在在 Windows Phone Emulator 中构建并测试应用程序中构建并测试应用程序 此时 应用程序并不能做什么 但是它已经做好第一次测试运行的准备 在这个任务 中 您会构建一个应用程序 并把它部署到 Windows Phone Emulator 然后执行它 通 过这些您就能了解一个典型的开发过程 1 在 Debug 菜单 指向 Windows 然后通过选择 Output 来打开 Output 窗口 2 在 Debug 菜单选择 Build Solution 或者按键盘上的 SHIFT F6 组合键来编译 解决方案中的项目工程 Visual Studio 2010 在 Debug 菜单选择 Build Solution 或者按键盘上的 CTRL SHIFT B 组合键来编译解决方案中的项目工程 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 15 75 3 查看 Output 窗口查看构建编译过程中产生的每条消息记录 包括最后输出 的结果信息 图表图表 13 在Visual Studio中构建 Build 应用程序 4 眼下您应该不会发现任何错误 但是如果项目包含编译错误 那么这些错误 信息将会出现在 Output 窗口中 要处理这些类型的错误 您可以利用 Error List 视窗 这个视窗能够以列表的形式显示错误 警告以及编译器产生的信 息 您可以根据错误的严重性来排序或者过滤 此外 你可以通过双击列表 中的条目来自动打开相关源代码文件并切换到错误的源点 要打开 Error List 视窗 在 View 菜单 指向 Other Windows 然后选择 Error List Visual Studio 2010 点击 View 菜单 选择 Error List 来打开 Error List 视窗 图表图表 14 Error List 视窗显示构建过程中的错误 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 16 75 5 验证部署的目标是 Windows Phone Emulator 要做到这样 确保在工具栏上 Start Debugging 按钮旁的 Select Target 下拉框中的值是 Windows Phone 7 Emulator 图表图表 15 选择目标设备来部署应用程序 注释注释 当您从 Visual Studio 中部署您开发的应用程序时 您既可以选择一个真 实的设备或者是 Windows Phone Emulator 6 在 Windows Phone Emulator 上按 F5 来启动应用程序 注意设备模拟器窗口 的出现 同时在 Visual Studio 建立模拟器环境和部署应用程序镜像时会出现 一个停顿 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 17 75 图表图表 16 部署一个应用程序镜像到 Windows Phone Emulator 7 一旦准备就绪 模拟器会显示开始页面 不久之后 您的应用程序也将会出 现在模拟器的窗口中 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 18 75 图表图表 17 在 Windows Phone Emulator中运行应用程序 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 19 75 8 直到您完成了创建用户界面以及应用程序逻辑的编程设计 否则您在当前应 用程序的页面基本上什么都不能做 按下 SHIFT F5 或者工具栏上的 Stop 按钮来分离调试器并终止调试会话 不要关闭模拟器视窗 图表图表 18 终止调试会话 提示提示 当您启动一个调试会话时 它将会花费一些时间来搭建模拟器环境以及 启动应用程序 为使您的调试过程简单而有效 当您在用 Visual Studio 编写源 代码的时候 请避免关闭模拟器避免关闭模拟器 如果模拟器一直处于运行状态 它只会用 很少的时间来完成停止当前会话 编辑源代码 构建应用程序 部署新应用 程序镜像 重新启动调试会话这一整个过程 任务任务 3 为主页设计用户界面为主页设计用户界面 在这个任务中您将会为应用程序的主页面创建用户界面 这个页面显示一个版权页 它包含一个代表应用程序的图片以及离开版权页导航进入到游戏页面的按钮 1 首先 在工程里新建一个文件夹来保存应用程序中所使用的图片 在 Solution Explorer 窗口中 右键单击 WindowsPhonePuzzle 工程节点 指向 Add 并选择 New Folder 为创建好的文件夹命名为 Assets 注释注释 当您添加了一个新的文件夹 Solution Explorer 窗口中将会显示一个以占 位符命名的文件夹 您可以通过输入一个新的名称来替换占位符 如果您意 外的放弃编辑模式 您可以按 F2 重新回到编辑模式 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 20 75 图表图表 19 Solution Explorer窗口展示了新 Assets文件夹 2 现在 向工程中添加应用程序所需的图片 在 Solution Explorer 窗口上 右 键点击 Assets 选中 Add 然后选择 Existing Item 在 Add Existing Item 对话 框 点击 browse 并定位到实验目录下 Source 文件夹中的 Assets 然后按住 CTRL 键不放 鼠标点击 SplashImage jpg 和 Puzzle jpg 选中这两个文件后点 击 Add 注释注释 在 Visual Studio 中 您可以为自己在 Windows Phone 工程中创建的 Silverlight 添加资源文件 然后可以通过设置 Build Action 的值来完成对这些文 件的部署 项目工程中每个被添加的图片 Build Action 值都要被设为 Resource 这些图片在进行工程汇编时会被嵌入文件中 3 试图查看某个图片 您可以在 Solution Explorer 上右键单击该项 用在你机 器上注册的图像编辑应用程序来打开它 例如 Paint exe 注释注释 Visual Studio 2010 中 在 Solution Explorer 上右键单击图标文件 该文件 会在内嵌的图像编辑器中打开 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 21 75 图表图表 20 应用程序包中的图像嵌入资源 4 打开应用程序的主页面 在 Solution Explorer 窗口 右键单击 MainPage xaml 将其加载到 designer 中 5 在 Design 视图 选择 TextBlock 并将其命名为 ApplicationTitle 然后按 F4 在 Properties 窗口 更改 Text 属性 将所有属性按照类排序后 其位置在 Common 分类中 为其添加值 WINDOWS PHONE PUZZLE 图表图表 21 在Properties窗口配置UI 元素 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 22 75 注释注释 您可以通过点击 Properties 窗口工具条上的图标来为所有属性进行按照 类别或者属性排序 6 接下来 选择名为 PageTitle 的 TextBlock 并替换其 Text 属性值为 start 7 在由 Windows Phone 应用模板产生的 XAML 标记程序中 定位名为 LayoutRoot 的 Grid 容器元素 它是用来布置页面上的元素 注意 root Grid 元素包含其他嵌入的元素 这些元素通过定义一个 Grid Row 属性被分配到 外部 Grid 里的不同行 找到名为 ContentPanel 的 Grid 元素并将其 Grid Row 设为 1 并插入下面高亮的 XAML 标记代码 XAML 注释注释 上面的 XAML 标记代码创建了一个两行的页面布局 第一行包含了版权 页所需的图片 第二行包含了一个用来退出当前页面并导航切换到智力游戏 主页面的按钮 8 切换编辑模式到 Design 视图 要把 Design 视图最大化到视图区域 双击设 计工具视窗右边缘上 Design 标签 如果您不方便找到正确的标签 可以 把鼠标停留在每个标签上显示提示信息 从而找到正确的标签 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 23 75 注释注释 如果您的实际工具视窗选择的是水平分隔视图 则标签将会被自动放置 到视窗的下边缘 9 为按钮创建一个事件句柄 为实现这一目的 双击设计工具表面上的 START 按钮 这样做就创建了一个 Click 事件句柄并且会自动打开代码隐藏文件 此时光标会定位到 StartButton Click 事件句柄的方法代码中 把以下 高亮 代码段粘贴到方法代码中 代码段 YourFirstWP7App 练习1 任务3 步骤9 StartButton Click 事件句 柄 C privatevoid StartButton Click object sender RoutedEventArgs e navigate this NavigationService Navigate newUri PuzzlePage xaml UriKind Relative 注释注释 PhoneApplicationPage 类通过它的 NavigationService 属性提供了切换到 其他页面的方法和属性 您可以调用 NavigationService 的 Navigate 方法并把 页面的 URL 做为传参 您还可以使用 GoBack 和 GoForward 方法在导航历史 中向前或向后导航 硬件设备的后退按键通过应用程序也提供了向后翻页导 航的功能 上面的事件句柄显示了使用 NavigationService 跳转到 PuzzlePage xaml 页面 任务任务 4 在应用程序中处理错误在应用程序中处理错误 在这个任务中 您将会通过升级应用程序来显示异常不能被处理的错误页面 要管理 不能被处理的异常操作 您首先需要在应用程序中增加一个新的页面来显示错误的信 息 然后 您需要创建一个事件句柄来处理 UnhandledException 事件 无论何时当应 用程序不能捕捉一个异常的时候 都将触发该事件在句柄程序中 您导航切换到一个 错误页面并将异常的错误信息传递给该页面 注释注释 不去考虑如何实现一个未处理异常的句柄 您的应用程序应该包含您所能处理 的任何异常的操作 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 24 75 1 首先 添加一个新的页面到项目工程中 在 Solution Explorer 视图 右键单 击 WindowsPhonePuzzle 工程节点 指向 Add 并选择 New Item 在 Add New Item 对话框 从模板列表里选择 Windows Phone Portrait Page 把 name 设 为 ErrorPage xaml 然后点击 Add 图表图表 22 为工程添加一个新的页面 2 在 ErrorPage xaml 文件中 找到名为 LayoutRoot 的 Grid 元素 并用下面的 蓝色高亮 XAML 标记代码替换它的子控件 这个 XAML 定义了一个应用程序 标题和页面标题 两个标题都被命名为 error 它同样定义了一个 TextBlock 对象并被指定为 x Name ErrorText 样式 用来保存任何未来异常的错误文 本 XAML 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 25 75 3 现在 按下 F7 来打开一个新页面的代码隐藏文件 或者 作为另一种选择 在 Solution Explorer 视窗上右键单击 ErrorPage xaml 然后选择 View Code 在文件的最上层插入下面的命名空间 C using System Windows Navigation 4 然后 把下面代码段中高亮的部分插入到 ErrorPag 类中 这样做就建立了 一个 Exception 对象 当跳转切换到这个页面的时候会自动挂接到 ErrorText Text 代码段 YourFirstWP7App 练习1任务4步骤4 错误页面 OnNavigatedTo C publicpartialclassErrorPage PhoneApplicationPage 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 26 75 public ErrorPage InitializeComponent publicstaticException Exception Executes when the user navigates to this page protectedoverridevoid OnNavigatedTo NavigationEventArgs e ErrorText Text Exception ToString 5 当这个页面完成后 无论何时 当一个不能被处理的异常出现 此类事件的 句柄会使程序切换到错误的页面 并显示错误的信息 在 Solution Explorer 视图上 右键单击 App xaml 并选择 View Code 来打开 Application 类的代码 隐藏类 6 在 App 类中 找到 Application UnhandledException 事件句柄并用下面的代码 高亮部分 替换句柄方法的程序体 代码段 YourFirstWP7App 练习 1任务 4 步骤6 Application UnhandledException C Code to execute on Unhandled Exceptions privatevoid Application UnhandledException object sender ApplicationUnhandledExceptionEventArgs e if System Diagnostics Debugger IsAttached An unhandled exception has occurred break in the debugger System Diagnostics Debugger Break 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 27 75 e Handled true ErrorPage Exception e ExceptionObject RootVisual as Microsoft Phone Controls PhoneApplicationFrame Source newUri ErrorPage xaml UriKind Relative 注释注释 这个 Application UnhandledException 就像一张安全网 您应用程序中所 有的不能被处理的异常都在这里终止 UnhandledException 事件句柄处理完 成后 它把所有的 Handled 属性都设置为 true 这样做是为了阻止对异常的 进一步处理 然后它把未处理异常的信息保存到 ErrorPage 类的静态成员中 并设置帧的 Source 属性来显示错误页面 当您设置 Source 属性的值与显示内 容不同时 那么显示帧将会切换到一个新的内容 当您导航切换到错误的页 面后 它将会返回异常对象的文本值 Exception ToString 并以此显示到页 面中 一旦您开始在真正设备上调试您的应用程序 这将会非常有用 任务任务 5 验证验证 在这个任务中 你开始构建这个应用程序 并将其部署到 Windows Phone Emulator 执行该应用成来验证你之前的操作是否正确 1 在 Visual Studio 中 按 CTRL F5 把应用程序部署到 Windows Phone Emulator 并运行它 不是调试 等待应用程序启动并显示其主页面 它将会显示版 权页 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 28 75 图表图表 23 运行在模拟上的应用程序的版权页 2 点击 START 按钮 注意应用程序显示了您之前定义的不能处理异常的错误 页面 请记住这是所期望得到的结果 因为按钮点击事件的句柄是将会切换 屏幕到 PuzzlePage xaml 页面 这是一个当前还没有定义的页面 您将会在 后面的实验中定义该页面 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 39341996 Fax Fax 020020 3934089239340892 29 75 图表图表 24 未处理异常错误页面 3 双击 Back 按钮回到电话的主页面 到目前位置 除非为应用程序增加新的 功能 否则您所能做的非常有限 请不要关闭模拟器窗口 练习 2 在 Visual Studio 中创建拼图 板 在这个任务中 您将会创建一个页面来显示拼图板和玩游戏 这个页面显示了一个图 片 当点击它是 图片会碎成多片同时会在拼图板中随机排列 这个游戏的逻辑已经包含在了 PuzzleGame 类中 您可以使用实验提供的资源包添加这 个类到项目工程中 在这个练习中 您会创建页面上控件的布局 添加必需的应用程 有米手机应用广告 优蜜信息科技 有米手机应用广告 优蜜信息科技 广州优蜜信息科技有限公司广州优蜜信息科技有限公司 Tel Tel 020 39341996020 3