presentation title goes heredownload.microsoft.com/download/a/9/9/a9908a42... · cordova create...
TRANSCRIPT
![Page 1: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/1.jpg)
卢建晖 Microsoft Windows Platform Development MVP
DEV-B308
![Page 2: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/2.jpg)
Who am I
• 卢建晖
• 华南师范大学网络教育学院 程序开发总监
• 专注于跨平台移动开发,如Xamarin,Cordova,C++
• Blog : http://blog.csdn.net/kinfey
• Weibo : @Kinfey
![Page 3: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/3.jpg)
一. 谈谈移动应用
![Page 4: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/4.jpg)
一 . 谈谈移动应用
![Page 5: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/5.jpg)
![Page 6: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/6.jpg)
![Page 7: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/7.jpg)
![Page 8: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/8.jpg)
![Page 9: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/9.jpg)
![Page 10: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/10.jpg)
![Page 11: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/11.jpg)
针对平台
基于特定的开发工具Xcode/AndroidStudio/VisualStudio
耗费时间长
高昂的开发成本
![Page 12: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/12.jpg)
与平台无关
统一的技术HTML5,CSS 3 & JS
快速的开发效率
通过Cordova 框架可以访问原生的API
![Page 13: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/13.jpg)
二 . Cordova
![Page 14: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/14.jpg)
![Page 15: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/15.jpg)
Cordova
在使用Cordova API时,应用程序的构建可以无需本地代码(如Java或对
象C等),使用的是Web技术。
由于这些JavaScript API在多个设备平台上是一致的,而且是基于Web标
准创建的,因此应用程序的移植很方便,基本不做什么改变。
使用Cordova的应用使用平台SDK打包成应用程序,可以从每种设备的应
用程序商店下载安装。
Cordova提供了一套统一的JavaScript库供调用,它支持iOS、Android、
Blackberry、Windows Phone、Palm WebOS、Bada和Symbian。
![Page 16: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/16.jpg)
• 丰富的对硬件操作的接口
Battery
Status Camera Contacts
Device
Orientation
Dialogs File Transfer Geolocation Media
Capture
Network
Information
Splashscreen Statusbar Vibration
![Page 17: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/17.jpg)
![Page 18: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/18.jpg)
sudo npm install -g cordova 2. 创建 Cordova 项目 cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add ios $ cordova platform add amazon-fireos $ cordova platform add android $ cordova platform add blackberry10 $ cordova platform add firefoxos
![Page 19: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/19.jpg)
cordova build
![Page 20: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/20.jpg)
![Page 21: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/21.jpg)
![Page 22: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/22.jpg)
去看看
![Page 23: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/23.jpg)
三 . 如何构建Cordova项目
![Page 24: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/24.jpg)
如何构建Cordova项目
+ + =
![Page 25: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/25.jpg)
如何构建Cordova项目
JavaScript是地上最灵活的语言,在Cordova中,JS是一种控制逻辑,控制界面的重要语言。 也由此决定了,你可以把任意的JavaScript的框架和库放到Cordova中去。
![Page 26: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/26.jpg)
如何构建Cordova项目
1. MVC 的框架
2. Google 出品,社区维护
3. 和TypeScript 无缝链接
![Page 27: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/27.jpg)
如何构建Cordova项目
+
1. Html 5和CSS 3是最佳的界面设计语言
2. 基于Web界面的呈现形式,令到Cordova的开发 更像Web开发,降低了Mobile App的开发门槛
3. 有不少模拟移动体验的界面框架,如KendoUI, Ionic Framework, SenchaTouch,JqueryMobile
![Page 28: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/28.jpg)
如何构建Cordova项目
IONIC 是目前最有潜力的一款 HTML5 手机应用开发框架。通过 SASS 构建应用程序,它 提供了很多 UI 组件来帮助开发者开发强大的应用。 它使用 JavaScript MVVM 框架和 AngularJS 来增强应用。提供数据的双向绑定,使用它成为 Web 和移动开发者的共同选择。
![Page 29: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/29.jpg)
如何构建Cordova项目
![Page 30: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/30.jpg)
去看看
![Page 31: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/31.jpg)
四 . Cordova+Mobile Service
+
![Page 32: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/32.jpg)
去看看 https://github.com/Azure/mobile-services-samples/tree/master/CordovaNotificationsArticle
![Page 33: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/33.jpg)
Q & A
![Page 34: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/34.jpg)
课后提醒
![Page 35: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/35.jpg)
https://channel9.msdn.com/Events/Ignite/Microsoft-Ignite-China-2015
http://aka.ms/IgniteChina2015
![Page 36: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/36.jpg)
![Page 37: Presentation title goes heredownload.microsoft.com/download/A/9/9/A9908A42... · cordova create hello com.luk HelloWorld 3. 为你的项目添加支持平台 $ cordova platform add](https://reader030.vdocuments.net/reader030/viewer/2022040106/5ec65becce7e467dd94e7e2d/html5/thumbnails/37.jpg)