Ionic,Cordova 移动应用

程序猿 JS Ionic Cordova 移动应用... (shuke.2016-09-22 05:19)

1、Ionic 是什么？

好吧，我们看 Ionic 能给我们提供什么?  一个样式库，你可以使用它 来 装饰你的 HTML 网页 ，看起来 想 移动程序的 界面，什么 header 、content、footer、grid、list。这貌似没什么 实质性的东西， sencha touch ，jq 都能提供 。

一个用 angularjs 写的 工具库，姑且叫它 组件库吧。Ionic的 grid 设计的比较合理，比 bootstrap的 更强大。

当然它 还包含 了angular-animate、angular-resource、angular-sanitize、angular-ui-router，适应移动平台的模块库。

2、Apache Cordova 是什么？

Apache Cordova 提供用 Javascript 访问 移动平台  的 API 。

其内部是用每个 平台下的  web view 组件，运行 程序，然后实现了 每个平台下的 一套 CordovaLib  供你写的程序调用，然后你就可以 调用 摄像头、磁盘等 重api。

接下来 动手玩玩。首先安装nodejs，和平台的 （ios || android）sdk，这里不在 累述 

1、先安装 cordova

npm install -g cordova

2、安装 Ionic

npm install -g ionic

3、创建项目

ionic start todo blank

4、配置平台

ionic platform add android

然后 在IDE中打开 项目：

www是主目录

index.html 是 主页面

刚才我们配置 平台的时候 ，工具帮我们做了一件事，创建 了一个 安卓 应用，

创建一个 CordovaApp 类，继承自 CordovaActivity ， Activity 是 安卓的4大组件，表示可以看到 了一块窗口。

它做了一个 引导，就是loadUrl，这里不做过多的 介绍，有兴趣 我们以后深入研究，这里我们只是 发散性的引导。

现在，你就可以使用 ionic 和 Apache Cordova 提供的 api 来 开发 跨平台的应用了。

来改我们的inde.html

这个todo 我们没有用到 Apache Cordova 的api，所以，这个项目在浏览器中 也可以运行。

使用 

$ ionic serve

最后编译，

$ cordova build --release android

2 楼 shuke[2016-09-22 17:27]

1 安装Ionic和Cordova

官网 http://ionicframework.com/

国内 http://www.ionic.wang/

命令行安装ionic

$ npm install -g cordova ionic

2 新建一个Ionic项目

$ ionic start myApp tabs

3 运行我们刚才创建的Ionic项目

$ cd myApp
$ ionic platform add android
$ ionic build android
$ ionic emulate android

4 在浏览器预览并实时刷新

$ ionic serve

我们选择localhost，并把浏览器调成mobile模式；

然后我们进入编辑器修改项目文件夹www中的代码，看到，浏览器已经可以跟着我们的保存实时刷新，非常好用！！！

进度：100% 返回程序猿

解决织梦图集中上传图片时跳出302错误

js阿拉伯数字转中文大写

图片新热点

导航

• 模块
• 服务器应用
• 软件应用
• 设计师
• 程序猿
• 推广课程
• 制作
• 分享
• 原创
• 黑板报
• 运营与帮助
• 微平台
• 生活小百科