文档章节

Ionic学习笔记

前端届的科比
 前端届的科比
发布于 2015/09/21 17:18
字数 458
阅读 247
收藏 6

overview

Ionic是一个基于Angular的HTML5应用框架,里面包含许多UI组件,JS可通过Cordova调用iOS、android等原生功能。它特别关注外观、交互、体验,特别适合于开发Hybrid模式的HTML5 APP。

Ionic是一个轻量的手机UI库,具有速度快,界面现代化、美观等特点,为了解决其他一些UI库在手机上运行缓慢的问题。

官方网站:http://www.ionicframework.com/ 中文网站:http://www.ionic.wang

学习笔记

###ion-refresher刷新后要通知框架

使用<ion-refresher>在刷新完毕后,应当使用作用域的$broadcast()方法通知框架,以完成刷新后的动画

$scope.$broadcast("scroll.refreshComplete");

如果没有通知框架,那么它将一直在那显示刷新

###ionic框架的依赖注入方式

方式1:直接在ng-app注明是ionic

<html ng-app="ionic">

方式2:在js中手动依赖ionic

angular.module("myApp", ["ionic"]);

###ion-tabs的使用结构:

<ion-tabs>
    <ion-tab>
        <ion-view>
            <ion-content>

不要捣乱顺序了,不然ionic计算布局时会出差错

###使用crosswalk来加速HTML5 APP

crosswalk是一个能让HTML5 APP应用交互加快的WEB引擎,它支持Android和Tizen系统。 优点是使HTML5 APP运行速度加快; 缺点是打包后的安装包体积增大;

在Ionic中集成crosswalk

ionic browser add crosswalk

卸载crosswalk:

ionic browser revert android
#或者
ionic browser remove crosswalk

###ionic环境安装

安装好JAVA、ant、android、ios等系统的环境

ant:链接地址 android: 链接地址 ios:链接地址 cmd安装:npm install -g cordova ionic

附环境变量文件设置:

export JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.7.0_80.jdk/Contents/Home
export ANT_HOME=/Users/luozt/apache-ant-1.9.6
export ANDROID_HOME=/Users/luozt/Library/Android/sdk
export PATH=.:/usr/local/bin:$ANDROID_HOME/build-tools:$ANDROID_HOME/platform-tools:$ANDROID_HOME/tools:$JAVA_HOME/bin:$HOME/npm/bin:$ANT_HOME/bin:$PATH

© 著作权归作者所有

上一篇: angular实用手册
下一篇: resources_pc
前端届的科比
粉丝 21
博文 64
码字总数 51572
作品 0
深圳
私信 提问
初始前端接触angular.js+ionic框架,我这样做好吗?

问题:angular.js+ionic框架,要适应不同手机头部与内容的高度 之前没有接触过angular.js,认为这个框架Vue一样,上手还比较简单,后来,在实际的工作当中,我才明白自己想的太简单了。 第一...

迷茫的飞行猪
2017/07/21
0
0
每天5分钟日记

第一天 近期的目标 要做到早睡早起,早睡先放到一边,先要做好早起的准备。 先运动一个小时,然后,晚上要回顾一天的生活工作,核查自己一整天的任务完成情况以及调整第二天的任 务。 近期目...

boogoogle
2016/01/24
10
0
ionic3 创建 ionic1项目

简介 可能你和我一样觉得降级太麻烦,而且老是报错,这篇文章就介绍一下在 ionic3 下创建 ionic1 项目的方法 正常创建ionic项目 如果你打开了这篇文章,意味着你起码已经知道正常创建ionic项...

邪人君子
2018/01/07
0
0
Ionic Framework 学习

编者注 由于钻研服务器,前端一直使用Bootstrap,当然也非常好用。但是打包跨平台,还有现代的CLI工具都不太会用。近期发现Ionic已经可以脱离Angular也能够实施在Vue框架下,这个将会提供非常...

抢小孩糖吃
02/01
106
0
ionic-native-transitions让html5开发的app和原生一样快

Ionic(ionicframework)一款接近原生的Html5移动App开发框架 会html css js就可以开发跨平台的app 但是大家都知道 ionic在稍微低配置的android手机上面表现不是特别好。下面介绍的ionic-nat...

htzhanglong
2016/01/17
4.2K
2

没有更多内容

加载失败,请刷新页面

加载更多

html2canvas 生成的图片变模糊解决方案

需求: 背景图片和二维码还有用户微信头像生成一张图片,可供用户下载。打开页面的时候就是一张图可以保存,html2canvas插件即可实现效果,效果是实现了,但是很郁闷,图片模糊了。。。。 为...

前端老手
9分钟前
2
0
语音翻译器在线翻译语音

对于英语不好的朋友来说,如果出国旅游,多多少少都会使用到翻译软件。通过在线翻译的方式,方便彼此的沟通交流。那么,有朋友就在问哪个英语翻译软件最准确?下面就来和大家一起分享下这个简...

401恶户
10分钟前
2
0
国内25家滤波器公司排名

国内做滤波器的企业都有哪些?哪些企业做滤波器是比较知名的?国内滤波器企业排名如何?以下是解优人才网小编给大家的分享,国内前25家做滤波器的企业详细信息。 1、武汉凡谷电子技术股份有限...

猎头悬赏平台
15分钟前
4
0
即时配送,不再只是巨头的战场

9月4日,第十届中国电子商务物流大会暨2019中国同城即时物流行业峰会于杭州召开。会上出现了蜂鸟即配、达达-京东到家、美团配送、点我达、闪送等一众即时配送行业中的知名企业的身影。 在艾媒...

喵二狸
15分钟前
3
0
Moto G 2014 LTE Root

[TOC] 下载moto专用mfastboot mfastboot-v2.zip 下载对应设备的twrp 我的是这个版本 Moto G 2014 LTE thea 刷入twrp # 1. 开启USE调试# 2. 允许OEM解锁# 3. 查看设备adb devices# 4. 进f...

yeahlife
19分钟前
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部