原文 Windows Phone 8初学者开发—第19部分:设置RecordAudio.xaml页面

原文地址:  http://channel9.msdn.com/Series/Windows-Phone-8-Development-for-Absolute-Beginners/Part-19-Setting-up-the-RecordAudioxaml-Page

系列地址: http://channel9.msdn.com/Series/Windows-Phone-8-Development-for-Absolute-Beginners

源代码: http://aka.ms/absbeginnerdevwp8

PDF版本: http://aka.ms/absbeginnerdevwp8pdf

现在我们已经可以导航到新的RecordAudio.xaml页面,让我们把注意力放在该页的布局上。如果您回想一下用户界面的草图,我们设想了一个卷盘图像,它会进行旋转以指示应用程序正在录音。会有一个按钮启动录音,一个按钮进行回放。最后,会有一个应用程序栏负责保存声音并对声音命名。在本课中,我们将讨论页面的布局,声音录制功能和动画将在后续课程中进行讨论。

所以本简短课程的计划非常明确:

  1. 我们将通过绑定到本地资源对品牌进行更改。
  2. 我们将添加按钮和椭圆(ellipse),然后在椭圆上添加一些形状以使它看上去像一个老式的卷盘。
  3. 我们将添加一个应用程序栏,在前面课程中我们已经学会了这方面技能。

1. 执行简单的品牌更改

我将从修改应用程序顶部的文本开始:

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

这将产生以下结果:

2. 执行主控件的基本布局

我将在名称为ContentPanel的Grid中添加以 下XAML:

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

这将产生以下结果:

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

上述大部分代码是自我解释的。我们使用一系列对齐和边距以在主椭圆上定位这些形状。

如果一切顺利,结果应如下所示:

3. 添加应用程序栏

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

上述代码对您来说并非是新东西。我之前已经解释过其中大部分代码,但是具体到这个应用程序栏:

  1. 取消对BuildLocalizedApplicationBar()调用的注释。
  2. 取消BuildLocalizedApplicationBar()方法模板的注释 。
  3. 创建一个新的ApplicationBarIconButton,并设置其IconUri属性为save.png文件,设置其text属性为AppBarSave,它位于AppResources.resx文件中并在本系列前面被创建。
  4. 为Click事件创建并关联一个新的事件处理程序方法(见#7),当输入+=字符时,忽略建议的名称而使用自己命名的名称,然后使用悬停于蓝色虚线上的技术显示上下文菜单选项以生成一个方法存根。
  5. 向应用程序栏添加recordAudioAppBar按钮。
  6. 使应用程序栏可见。
  7. 这是您在步骤4中创建的事件处理程序存根。

运行应用程序并导航到该页面时将显示该应用程序栏,在它上面有一个标题为"save"的小磁盘图像。

回顾

综上所述,本课没有十分重要的内容,只是使用我们以前学过的技术来实现页面的特定布局。您见到的唯一新的控件是ToggleButton,它将可以被选中或取消选中而不是像按钮只能被点击/单击。

Windows Phone 8初学者开发—第19部分:设置RecordAudio.xaml页面的更多相关文章

  1. Windows Phone 8初学者开发—第13部分:设置LongListSelector中磁贴的样式

    原文 Windows Phone 8初学者开发—第13部分:设置LongListSelector中磁贴的样式 第13部分:设置LongListSelector中磁贴的样式 原文地址: http://c ...

  2. Windows Phone 8初学者开发—第6部分:设置应用程序的样式

    原文 Windows Phone 8初学者开发—第6部分:设置应用程序的样式 Source Code: http://aka.ms/absbeginnerdevwp8  PDF Version: ht ...

  3. Windows Phone 8初学者开发—第21部分:永久保存Wav音频文件

    原文 Windows Phone 8初学者开发—第21部分:永久保存Wav音频文件 第21部分:永久保存Wav音频文件 原文地址:http://channel9.msdn.com/Series/Win ...

  4. Windows Phone 8初学者开发的翻译终于过半

    从2013年7月19日开始,到2013年12月9日,一共花了143天时间完成了18篇Windows Phone 8初学者开发的翻译,还剩下17篇文章需要翻译,看到了完成的希望! I love Wind ...

  5. Windows Phone 8初学者开发—第14部分:在运行时绑定到真实的数据

    原文 Windows Phone 8初学者开发—第14部分:在运行时绑定到真实的数据 第14部分:在运行时绑定到真实的数据 原文地址: http://channel9.msdn.com/Series/ ...

  6. Windows Phone 8初学者开发—第12部分:改进视图模型和示例数据

    原文 Windows Phone 8初学者开发—第12部分:改进视图模型和示例数据 第12部分:改进视图模型和示例数据 原文地址:http://channel9.msdn.com/Series/Win ...

  7. Windows Phone 8初学者开发—第11部分:设置SounBoard应用程序

    原文 Windows Phone 8初学者开发—第11部分:设置SounBoard应用程序 原文地址: http://channel9.msdn.com/Series/Windows-Phone-8- ...

  8. Windows Phone 8初学者开发—第10部分:数据绑定应用程序和透视应用程序项目模板简介

    原文 Windows Phone 8初学者开发—第10部分:数据绑定应用程序和透视应用程序项目模板简介 原文地址: http://channel9.msdn.com/Series/Windows-Ph ...

  9. Windows Phone 8初学者开发—第9部分:Windows Phone 8模拟器概述

    原文 Windows Phone 8初学者开发—第9部分:Windows Phone 8模拟器概述 第9部分:Windows Phone 8模拟器概述 原文地址: http://channel9.ms ...

随机推荐

  1. (IOS)悬浮按钮Demo

    思路:传入一个底层的view,将悬浮按钮(用view实现)和展开的子按钮列表add在其上,子按钮列表开始将坐标和悬浮按钮对应好后先将其隐藏,悬浮按钮识别到tap手势后触发展示子按钮列表的方法.通过在t ...

  2. Web Api帮助页面或用户手册

    我这么玩Web Api(一):帮助页面或用户手册(Microsoft and Swashbuckle Help Page)   前言 你需要为客户编写Api调用手册?你需要测试你的Api接口?你需要和 ...

  3. 转: 关于viewport的理解

    最近我做了一点儿针对手机的Web开发和相关研究.按说,Web自设计之初,就已经考虑了设备无关性.然而,现实总是不尽如人意. 我们知道大多数网页都是针对桌面显示器开发和测试的,但是手机屏幕通常要比桌面显 ...

  4. 射频识别技术漫谈(27)——CPU卡概述

    智能卡按安全级别可以分为三类:存储器卡.逻辑加密卡和CPU卡,其中CPU卡是安全级别最高的.从“CPU”这个名字可以看出,CPU卡最大的特点就是卡片里面有一个"CPU",有了CPU ...

  5. Protel99SE制作拼板的方法

    制作步骤: 1.在PCB编辑里按快捷键 S/A全选复制源PCB全部内容,再按Ctrl+C看到十字光标.点击左键. 2.打开目标PCB文件,点击Edit菜单,在下拉菜单中点击Paste special( ...

  6. Hbuilder 常用快捷键汇总

    朋友推荐用Hbuilder编辑器,看了下Hbuilder官网和那视频,感觉牛逼哄哄的, 自己也就体验了一下,打开Hbuilder的快捷键列表,每个快捷键都体验了一下,以下展示出来的,每一个都是精华,每 ...

  7. hdoj 5249 KPI(treap)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5249 思路分析:使用queue记录管道中的值并使用treap能够查询第K大的功能查询第floor(m/ ...

  8. Proving Equivalences(加多少边使其强联通)

    Proving Equivalences Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Oth ...

  9. 深度学习 Deep Learning UFLDL 最新 Tutorial 学习笔记 1:Linear Regression

    1 前言 Andrew Ng的UFLDL在2014年9月底更新了. 对于開始研究Deep Learning的童鞋们来说这真的是极大的好消息! 新的Tutorial相比旧的Tutorial添加了Conv ...

  10. HTML之表格与表单

    一.表格(table/tr/td) <table></table>表格 --不设高度 width:宽度.可以用像素或百分比表示. 常用960像素. border:边框,常用值为 ...