Windows phone 应用开发[1]-Text To Speech

最近几个月一直在专一Windows phone产品设计和项目开发.在其中团队磨合和产品定位上也出现很多问题.一直难以抽出成块的时间来思考梳理.至此博客更新也今后中断.这两天因病在家休息.上周在微博[Fllow me]上提到本身翻译一些Wiki文档.目前还没有整理完毕.从本篇博客开始将把这些资源逐步迁移到Cnblogs上[在线Wiki资源因服务器不稳定不公开].主要涉及到Windows phone 应用开发技术和Metro设计细节. 以及在开发中碰到一些问题和相对应的解决方案. 这些资源都是咱们设计和开发团队在实际项目操做中对Windows phone 这个新的技术平台理解和逐步积累的过程.可能有些地方给出答案并非最准确 最好的.也走了很多弯路. 可是对于这个探索的过程有必要分享出来.

目前APPBub对国内已经开放.开发者能够经过招行Visa信用卡购买开发者帐号,提交Windows phone 应用.上个月TechEd2011 和最近11月份关于Windows phone培训和线下活动比较多[会在微博动态更新].11月份MS官方推出Windows phone开发训练营活动[免费].包含国内大部分地区 也欢迎各位开发者报名参加. 届时线下交流":

微软Windows phone 开发训练营: [免费] 在线报名活动地址: http://msdn.microsoft.com/zh-cn/windowsphone/hh532262  11月11日北京.

ok.做为开篇章节.第一篇将在以下介绍一些Windows phone比较有意思的东西-Text To Speech[文本到语音转换].  相信你们最近必定对IPhone 4S 的Siri影响深入.其实做为智能Smart Phone一个终极标准之一就是实现人类语言和机器语言的无障碍. 也就是第三次GUI革命-人机智能领域.这个我会稍后几篇提到Siri实现原理和Windows phone 在语音Tellme实现和发展状况.

相信做为手机用户你必定有这样的需求.当你打开手机屏幕看新闻或是其余文字信息时. 有没有想过咱们能以语音的方式读取文字信息,而把咱们眼睛从屏幕中解放出来.特别是针对盲人这样需求就更明显了.Text To Speech已经在IPhone和Android上已经成型的运用.Windows phone上如何来实现?

首先来看看在语音识别领域IPhone的苹果公司采用是语音识别巨头Nuance技术.具体实现做为商业机密.而微软Tellme和Google都是采用本身开发的技术.在QQ2011版本我上周偶然发现QQ在输入法加入语音识别输入的方式.可是效果不太好.

Windows phone中实现的方式大概有三到四种方式.本篇将采用最简单一种使用Bing在云端的服务方式来解决这个问题[因最近一直在看Windows Azure云平台].其余更多关于这方面实现将在后续几篇涉及到.

首先咱们设计UI. 俗话说“工欲善其事必先利其器”那么Windows phone 在UI设计采用什么样设计工具. 这里不得不得不提到.Balsamiq Mockups-是Balsamiq工做室出品的一款手绘风格的产品原型设计工具。它适合于产品经理、产品设计师、用户体验设计师、交互设计师、网站前端设计师等等.

和经常使用的Visio、Axure RP等软件相比最大的特色就是涂鸦风格，而且使用起来很是简单，彻底不须要了解太多技术就能够作出一个可审阅的原型图，很是适合快速设计简单的原型.

Balsamiq Mockups： Download Link：Balsamiq Mockupas Free Try Version  Design GuideLine Support Document：Balsamiq Mockupas Design GuideLine Blogs Design Handler Book: Balsamiq Mockupas Design Hanlder Book Document

设计原型工具[受众人群-UI设计团队]:

相对Balsamiq 收费软件.默认设计面向IPhone内置模板. 那么基于Windows 平台免费UI设计工具-Pencil 则也是手绘设计风格.一样能够用来对Windows phone作原型UI设计 同时支持在Firefox 插件方便使用 开源免费.:

Pencil Project: Download Link:Pencil UI Design Download Link Design User GuideLine:Pencil Design User GuideLine

设计工具界面:

 

 

可能在设计团队沟通时.Product Ower和开发Team 须要对产品进行屡次讨论时. 这时一个统一流程设计工具就很重要.这样避免在讨论时出现不一样设计工具图形元素照成不一样理解而耽误时间.另外保存能够在任什么时候候均可以经过同一工具实现修改目的. 这点很重要. 使用这个工具受众通常是产品经理和开发团队居多-Gliffy:

Gliffy: Gliffy Draw Software Online Tool

Gliffy 是一款免费的在线流程设计工具.基本包含软件开发中UML 和开发流程 UI全部设计模型.支持在线存储. 方便多个团队沟通和交互工具初始化界面:

 

这个APP称为Text To Speech. 在肯定UI设计以前.设计团队必定确认功能需求和必要UI流程 .原型设计目的产品设计成形以前的一个简单框架. 把这个功能需求拆解以下:

功能需求: [1]：把文本转换成语音输入 [2]: 指出多语言版本:英文和中文语音输出 [3]: 实现对用户文本可选记录存储和删除 [4]：……

 注意在UI设计过程.功能需求优先级最高.是产品原型设计最基本的要点. 这也是区别于效果图版本中最重要因素. 通常状况产品设计原型设计只有一个.也就是陈述这个产品价值和目的标准时统一的.可能在后期最终APP市场-用户群体定位和美化等其余因素考虑状况下.效果图每每会出现2-4版本或是多个版本都正常的.

那么windows phone 整个APP设计和开发Team如何来分工? . 

Windows phone 在基于Silverlight平台构建.MS官方SDK给出Express Bland 设计工具.有人曾屡次问过我.UI效果图实现是否也应该交给开放团队来作?

固然这个问题也看具体团队安排和分工. 固然为了编程效率上考虑. 同时开发Team不可能每一个人都能精通XAML标示语言. 这就须要一个BI角色实现设计团队效果图来和开发团队进行对接.BI 角色核心工做就是把设计团队效果图经过Express Bland 设计工具变成实际XAML code.而后交付给开发Team. 若是与设计效果图出现出入.开发Team只须要BI这个单独角色抽出来来设计Team进行交涉.避免分工致使整个开发团队进度停滞. 这种方式主要目的就是保证Code高效. 使咱们在每次MileStroe里程碑都能持续交付成果.

固然这里谈到效果图:主要作到以下四点：

•UI操做流程和用户行为分析. •肯定页面UI元素.-[BI参与] •美化效果和完善用户体验. •设计团队效果图-做为开发TeamExpress Bland 最终参考

因此BI这个角色不只持续向开发团队交付良好UI界面.同时也彻底屏蔽整个设计团队对开发过程的影响. 效果图是做为APP产品最终UI设计参考.设计团队可能对Windows phone控件元素不熟悉.这就须要BI配合.保证效果图和实际开发不存在脱节. 效果图也是最终定义这个APP设计意图.因此一但制定就是做为开发Team惟一参考. BI就很好的起到这个上下承接的做用.事实证实这种方式确实高效解决很多开发团队与设计Team沟通问题.

 

 

原型图采用Balsamip设计采用枢轴控件方式 效果以下:

 效果图 由UI设计团队完成 此处就略去[略]

 Now 咱们如今经过BI已经拿到效果图.和已经实现的UI.剩下工做则由开发团队接手.如何实现这个Text To Speech. ok. 打开Visual Studio2010创建一个Pivot Windows phone Application. 在解决方案中出现一个Solution. 是否应该当即考虑Code实现. no. 咱们在真正Code前须要好好规划咱们的Solution.

在CodePlex上看到不少Windows phone OpenSource Project开源项目.发如今View种大多都使用MVVM Light框架. 而对UserControl却不多见到.这种现象曾让我这个Silverlight开发者感到困惑奇怪.不知有没有人作过把Silverlight版本Application向windows Phone移植的工做.那个时候你才后悔当初为什么没有使用UserControl来对通用View进行封装.而是采用PhoneApplicationPage替代.若是你想本身写过WP7 View具备在将来项目中可移植 甚至在其余项目不断复用 扩展,. UserControl是一个很好选择.

另一个就是不得不说的Windows phone Library类库.在开发Windows phone应用客户端时.老是会涉及到一些基本数据操做 Json/XML、IsolateStorageFile序列化/反序列化. Task基本调用. 数据列表缓存系统创建等等这些不断可重用的操做.必要模块化封装.是必不可少是.这将为咱们项目开发节省大量时间. 这些封装类库DLL在不一样项目移植就成不断能够重用的代码库.维护这些可重用代码库则将是一笔无形资产. 类库封装则分为System Level 系统级和Customer Level自定义. 关于这些类库封装在后面文章会详细说明封装技巧.

固然还有其余的注意是否作UnitTest. 以及自动化测试等.都在考虑行列……如上只是略作举例说明.项目规划必要性,.

做为本次则无需类库封装.Pivot APPlication则足以. 在使用Bing在云端服务器 来作Text To Speech 咱们须要先申请一个ApplicationId. 而后经过该ApplicationId调用Ms云端的Translate翻译服务并保存可播放的语音文件wav在客户端播放.实现Text文本转换成语音效果.

打开Bing Developer Bing API： http://www.bing.com/toolbox/bingdeveloper/

找到Sign in-bing Search API 建立一个Application:

 建立成功后能够看到该Application的ApplicationId:

 有了ApplicationID.向Application程序添加云端的Translate服务引用:

Add Microsoft Translator Service: http://api.microsofttranslator.com/V2/Soap.svc

添加服务引用:

 引用成功后:

 在页面加载中首先得到支持语言类型.经过Translate Service服务中获取Client:

private void MainPage_Loaded(object sender, RoutedEventArgs e)
{
    var transalteServiceRef = new TranslatorService.LanguageServiceClient();
    transalteServiceRef.GetLanguagesForSpeakCompleted += new EventHandler
    <TranslatorService.GetLanguagesForSpeakCompletedEventArgs>(transalteServiceRef_GetLanguagesForSpeakCompleted);
    transalteServiceRef.GetLanguagesForSpeakAsync(applictionid,transalteServiceRef);
}

void transalteServiceRef_GetLanguagesForSpeakCompleted(object sender,                                                                TranslatorService.GetLanguagesForSpeakCompletedEventArgs e)
 {
      //Get Service Client
      var transalateClient = e.UserState as TranslatorService.LanguageServiceClient;
      transalateClient.GetLanguageNamesCompleted += new EventHandler
      <TranslatorService.GetLanguageNamesCompletedEventArgs>(transalateClient_GetLanguageNamesCompleted);
      transalateClient.GetLanguageNamesAsync(applictionid, "en", e.Result, e.Result);
 }

获取支持语言列表:

Deployment.Current.Dispatcher.BeginInvoke(() =>
 {
     var CodeCols = e.UserState as ObservableCollection<string>;
     if (CodeCols != null)
     {
         var languageNames = e.Result;
         var languagesData = (from code in CodeCols
                              let cindex = CodeCols.IndexOf(code)
                              from name in languageNames
                                  let nindex = languageNames.IndexOf(name)
                              where cindex == nindex
                              select new TranslatorLanguage()
                                        {
                                  Name = name,
                                  Code = code
                              }).ToArray();

         //Update UI Element
         this.LanguageList_LB.ItemsSource = languagesData;
            }

当用户输入文本内容后.点击Speech按钮把这段文本以语音方式播放出来，在点击事件内. 经过请求云端服务获取播放WAV文件Stream:数据. 并在客户端播放出来: 

private void SpeechTxt_BT_Click(object sender, RoutedEventArgs e)
 {
     var languageCode = "en";
     var language = this.LanguageList_LB.SelectedItem as TranslatorLanguage;
     if (language != null)
        {
            languageCode = language.Code;
         }
       var objTranslator = new TranslatorService.LanguageServiceClient();
        objTranslator.SpeakCompleted += translator_SpeakCompleted;
        objTranslator.SpeakAsync(applictionid, this.TextToSpeech_TB.Text, languageCode, "audio/wav",string.Empty);
   }

  void translator_SpeakCompleted(object sender, TranslatorService.SpeakCompletedEventArgs e)
   {
      var client = new WebClient();
      client.OpenReadCompleted += ((s, args) =>
       {
           SoundEffect se = SoundEffect.FromStream(args.Result);
            se.Play();
       });
      client.OpenReadAsync(new Uri(e.Result));
   }

ok.这种方式很好经过云端的服务来解决了把文本转换成语音输出.这样咱们可以Azure封装致使一个瘦客户端.客户端只须要作不多的事.这须要在线链接网络.这也是初步看到云端.处理方式.

 固然这是处理文本语音最简单的方式.应该可以从这篇文章看出重点讲述Windows phone 从设计到开发完成中一些大概的细节. 以及主要流程.采用云端服务的方式来处理客户端.编程方式. 稍后几篇会介绍Windows phone Metro设计.编程技巧.

 源代码下载见附件。