phonegap------angularjs+ionic高大上的webApp

谁借莪１个温暖的怀抱￠ 2022-08-21 14:40 166阅读 0赞

最近在公司用跨平台技术开发了一款APP.记录一下自己学习过程。

1. Phonegap介绍  
PhoneGap是一个用基于HTML，CSS和JavaScript的，创建移动跨平台移动应用程序的快速开发平台。它使开发者能够利用iPhone，Android，Palm，Symbian,WP7,WP8,Bada和Blackberry智能手机的核心功能——包括地理定位，加速器，联系人，声音和振动等，此外PhoneGap拥有丰富的插件，可以调用。  
http://baike.baidu.com/view/4157600.htm

3. Phonegap安装教程  
PhoneGap2.9安装视频教程地址：  
http://bbs.phonegap100.com/thread-174-1-1.html PhoneGap3.4安装视频教程地址：  
http://bbs.phonegap100.com/thread-668-1-1.html

3. Angularjs介绍 AngularJS诞生于2009年，由Misko Hevery 等人创建，后被Google收购。是一款优秀的前端JS框架，已用于Google的多款产品当中 如Gmail、Maps、Calender 等。AngularJS有着诸多特性，最为核心的是：MVVM、模块化、自动化双向数据绑定、语义化标签、依赖注入，等等。 http://baike.baidu.com/view/9604951.htm  
Angularjs号称 下一代web应用 主要特性如下： 1.MVC 2.模块化与依赖注入 3.双向数据绑定 4.指令与UI控件

4. Ionic介绍 以及学习ionic前为什么要学Angularjs  
Ionic 是一个强大的 HTML5 应用程序开发框架，号称Advanced HTML5 Hybrid Mobile App Framework 是AngularJS 移动端解决方案 可以帮助您使用 Web 技术，比如 HTML、CSS 和 Javascript 构建接近原生体验的移动应用程序。Ionic 主要关注外观和体验，以及和你的应用程序的 UI 交互，特别适合用于基于 Hybird 模式的 HTML5 移动应用程序开发。 Ionic是一个轻量的手机UI库，具有速度快，界面现代化、美观等特点。为了解决其他一些UI库在手机上运行缓慢的问题。  
官网：http://ionicframework.com/ 学习ionic前为什么要学Angularjs  
1. Ionic 整合（AngularJs integrate）AngularJs  
2. Ionic Url routing，use AngularUI Router Ionic url路由使用AngularUI Router，可以指定不同的路由，方便开发和集成 3 . Ionic扩展了 AngularJS指令 （AngularJS Extensions & Directives） ion-tab, ion-content, ion-nav-view, ion-header $ionicPopup,$ionicLoading, $ionicModal… 遗憾：ionic直接放弃了IOS6和Android4.1以下的版本支持，来获取更好的使用体验。

5.创建运行项目  
Ios创建安装运行 ionic start myproject cd myproject ionic platform add ios ionic build ios ionic emulate ios Android创建安装运行 ionic start myproject cd myproject ionic platform add android ionic build android ionic emulate android (模拟器运行) ionic run android (连接上手机运行)

![Image 1][]

第一天

[Image 1]: