Windows Phone 8初学者开发—第19部分:设置RecordAudio.xaml页面
原文 Windows Phone 8初学者开发—第19部分:设置RecordAudio.xaml页面
系列地址: http://channel9.msdn.com/Series/Windows-Phone-8-Development-for-Absolute-Beginners
源代码: http://aka.ms/absbeginnerdevwp8
PDF版本: http://aka.ms/absbeginnerdevwp8pdf
现在我们已经可以导航到新的RecordAudio.xaml页面,让我们把注意力放在该页的布局上。如果您回想一下用户界面的草图,我们设想了一个卷盘图像,它会进行旋转以指示应用程序正在录音。会有一个按钮启动录音,一个按钮进行回放。最后,会有一个应用程序栏负责保存声音并对声音命名。在本课中,我们将讨论页面的布局,声音录制功能和动画将在后续课程中进行讨论。
所以本简短课程的计划非常明确:
- 我们将通过绑定到本地资源对品牌进行更改。
- 我们将添加按钮和椭圆(ellipse),然后在椭圆上添加一些形状以使它看上去像一个老式的卷盘。
- 我们将添加一个应用程序栏,在前面课程中我们已经学会了这方面技能。
1. 执行简单的品牌更改
我将从修改应用程序顶部的文本开始:

- 我们将通过之前已经多次使用并已熟悉的语法从LocalResources.resx文件获取应用程序的名称。
- 目前我将文本属性硬编码为"record audio"。
这将产生以下结果:

2. 执行主控件的基本布局
我将在名称为ContentPanel的Grid中添加以 下XAML:

- 我们将使用StackPanel以垂直方式堆叠控件。
- 我们将使用ToggleButton(切换按钮),它有两个状态:选中和取消选中。我们的想法是希望能够打开和关闭录音。当ToggleButton切换状态时,我们希望能够处理引发开始或结束录音过程的事件。
- 我们将创建一个用于定位Ellipse的Grid。我们将设置Ellipse的颜色为内置的PhoneAccentBrush颜色,它指当前手机中设定的主磁贴的颜色。
- 我们将添加最后一个按钮,它用于播放最近录制的声音。
这将产生以下结果:

这里的Ellipse控件还不完整,我们希望它看上去像一个老式的盘式录音机。我们可以通过在XAML中使用几个较小的形状(一个位于中心的小椭圆以及与位于外部主椭圆的不同位置对齐的四个小矩形)完成这项工作。

上述大部分代码是自我解释的。我们使用一系列对齐和边距以在主椭圆上定位这些形状。
如果一切顺利,结果应如下所示:

3. 添加应用程序栏
我们将取消由文件模板提供的代码的注释以启用页面上的应用程序栏。在RecordAudio.xaml.cs文件中:

上述代码对您来说并非是新东西。我之前已经解释过其中大部分代码,但是具体到这个应用程序栏:
- 取消对BuildLocalizedApplicationBar()调用的注释。
- 取消BuildLocalizedApplicationBar()方法模板的注释 。
- 创建一个新的ApplicationBarIconButton,并设置其IconUri属性为save.png文件,设置其text属性为AppBarSave,它位于AppResources.resx文件中并在本系列前面被创建。
- 为Click事件创建并关联一个新的事件处理程序方法(见#7),当输入+=字符时,忽略建议的名称而使用自己命名的名称,然后使用悬停于蓝色虚线上的技术显示上下文菜单选项以生成一个方法存根。
- 向应用程序栏添加recordAudioAppBar按钮。
- 使应用程序栏可见。
- 这是您在步骤4中创建的事件处理程序存根。
运行应用程序并导航到该页面时将显示该应用程序栏,在它上面有一个标题为"save"的小磁盘图像。
回顾
综上所述,本课没有十分重要的内容,只是使用我们以前学过的技术来实现页面的特定布局。您见到的唯一新的控件是ToggleButton,它将可以被选中或取消选中而不是像按钮只能被点击/单击。
Windows Phone 8初学者开发—第19部分:设置RecordAudio.xaml页面的更多相关文章
- Windows Phone 8初学者开发—第13部分:设置LongListSelector中磁贴的样式
原文 Windows Phone 8初学者开发—第13部分:设置LongListSelector中磁贴的样式 第13部分:设置LongListSelector中磁贴的样式 原文地址: http://c ...
- Windows Phone 8初学者开发—第6部分:设置应用程序的样式
原文 Windows Phone 8初学者开发—第6部分:设置应用程序的样式 Source Code: http://aka.ms/absbeginnerdevwp8 PDF Version: ht ...
- Windows Phone 8初学者开发—第21部分:永久保存Wav音频文件
原文 Windows Phone 8初学者开发—第21部分:永久保存Wav音频文件 第21部分:永久保存Wav音频文件 原文地址:http://channel9.msdn.com/Series/Win ...
- Windows Phone 8初学者开发的翻译终于过半
从2013年7月19日开始,到2013年12月9日,一共花了143天时间完成了18篇Windows Phone 8初学者开发的翻译,还剩下17篇文章需要翻译,看到了完成的希望! I love Wind ...
- Windows Phone 8初学者开发—第14部分:在运行时绑定到真实的数据
原文 Windows Phone 8初学者开发—第14部分:在运行时绑定到真实的数据 第14部分:在运行时绑定到真实的数据 原文地址: http://channel9.msdn.com/Series/ ...
- Windows Phone 8初学者开发—第12部分:改进视图模型和示例数据
原文 Windows Phone 8初学者开发—第12部分:改进视图模型和示例数据 第12部分:改进视图模型和示例数据 原文地址:http://channel9.msdn.com/Series/Win ...
- Windows Phone 8初学者开发—第11部分:设置SounBoard应用程序
原文 Windows Phone 8初学者开发—第11部分:设置SounBoard应用程序 原文地址: http://channel9.msdn.com/Series/Windows-Phone-8- ...
- Windows Phone 8初学者开发—第10部分:数据绑定应用程序和透视应用程序项目模板简介
原文 Windows Phone 8初学者开发—第10部分:数据绑定应用程序和透视应用程序项目模板简介 原文地址: http://channel9.msdn.com/Series/Windows-Ph ...
- Windows Phone 8初学者开发—第9部分:Windows Phone 8模拟器概述
原文 Windows Phone 8初学者开发—第9部分:Windows Phone 8模拟器概述 第9部分:Windows Phone 8模拟器概述 原文地址: http://channel9.ms ...
随机推荐
- 一个Sqrt函数引发的血案(转)
作者: 码农1946 来源: 博客园 发布时间: 2013-10-09 11:37 阅读: 4556 次 推荐: 41 原文链接 [收藏] 好吧,我承认我标题党了,不过既然你来了, ...
- UUID Gen
https://github.com/twitter/snowflake/releases/tag/snowflake-2010 http://boundary.com/blog/2012/01/12 ...
- AOP 面向切面编程、拦截器
AOP(Aspect-Oriented Programming,面向切面的编程),它是可以通过预编译方式和运行期动态代理实现在不修改源代码的情况下给程序动态统一添加功能的一种技术.它是一种新的方法论, ...
- SQL server 数据库视频总结
用了半个多月的时间把,浙江大学耿建玲老师 数据库视频看了一遍.在看视频之前,曾经接收了一个学生信息管理系统,在学习 学生信息管理系统的时候,对于数据库的部分,总是那么一知半解.带着疑惑来看耿建玲老师 ...
- CTreeCtrl 控件使用总结
一 基础操作 1 插入节点 1)插入根节点 [cpp] view plaincopy //插入根节点 HTREEITEM hRoot; CString str=L"ROOT" h ...
- Leetcode 动态规划 Unique Paths
本文为senlie原创.转载请保留此地址:http://blog.csdn.net/zhengsenlie Unique Paths Total Accepted: 17915 Total Submi ...
- 如何判断一个变量是数组Array类型
在很多时候,我们都需要对一个变量进行数组类型的判断.JavaScript中如何判断一个变量是数组Array类型呢?我最近研究了一下,并分享给大家,希望能对大家有所帮助. JavaScript中检测对象 ...
- 微信二维码扫描下载APK
前几天给客户制作的app需要上线,生成二维码扫描进行下载,把生成好的apk挂在服务器端,将地址复制下来,通过草料二维码(http://cli.im/)生成一个二维码 也许你会看到有个app的选项,为什 ...
- C++设计模式之状态模式(四)
4.状态模式总结 状态模式将一个对象在不同状态下的不同行为封装在一个个状态类中,通过设置不同的状态对象能够让环境对象拥有不同的行为.而状态转换的细节对于client而言是透明的.client不直接操作 ...
- vue开发体验
*:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !important; } /* ...