
App-Ionic
文章平均质量分 66
Ionic1为主,也有部分Ionic2、3的内容
猿来这样1
编程圈子,谢厂节的博客
展开
-
Cordova 1 安装及示例程序
Cordova使用官网文档http://cordova.apache.org/docs/en/5.0.0/guide_cli_index.md.html#The%20Command-Line%20Interface/ 官方示例: npm install -g phonegap –全局安装phonegap npm install -g cordova cordova cr原创 2015-07-07 18:32:24 · 12144 阅读 · 3 评论 -
Cordova 2 基本使用 添加其它js框架
目录结构要显示assets的内容,要进行下面操作: 点开Project-Properties->Resource->Resource Filters, 其中有两个过滤器: ^(build.xml|ant-gen|ant-build|custom_rules.xml|CordovaLib|platform_www|cordova) ^(assets/www|res/xml/config.原创 2015-07-03 16:58:15 · 1241 阅读 · 0 评论 -
Cordova 3 架构学习 定义plugin
官网文档:http://cordova.apache.org/核心java类CordovaActivity:Cordova Activity入口,已实现PluginManager、WebView的相关初始化工作, 只需继承CordovaActivity实现自己的业务需求。PluginManager: 插件管理ExposedJsApi :javascript调用NativeNativeToJsMess原创 2015-07-06 12:10:49 · 6839 阅读 · 0 评论 -
Cordova 4 架构学习 定义启动界面Splash和图标
安装命令行,到项目下,运行命令: cordova plugin add org.apache.cordova.splashscreen修改config.xml这里要修改android平台下的config.xml。 修改cordova下的config.xml不起作用,暂时不知道为什么,以后再研究。 <preference name="SplashScreen" value="scree原创 2015-07-07 15:03:22 · 1727 阅读 · 0 评论 -
Cordova 5 架构学习 Weinre远程调试技术
手机上的页面不像桌面开发这么方便调试。可以使用Weinre进行远程调试以方便开发。本文介绍windows下的安装与使用。安装使用npm安装,可以运行: npm install -g weinre安装完路径可能是这样的: 输入命令 weinre 即可启动。使用浏览器打开网址: http://localhost:8080推荐使用Chrome。 如果有防火墙,要注意需要允许8080原创 2015-07-08 12:16:10 · 2055 阅读 · 0 评论 -
Cordova 6 架构学习 测试工具Ripple Emulator、GapDebug
Ripple EmulatorRipple Emulator是一个基于浏览器的,可以协助测试cordova app的软件,可以运行于多个操作系统。老版本Ripple 作为Chrome extension安装,需要Chrome浏览器支持。现在可以使用npm安装。网址: http://ripple.incubator.apache.org/ 安装: npm install -g ripple-em原创 2015-07-08 14:23:33 · 7374 阅读 · 0 评论 -
Cordova 7 架构学习 良好程序结构要点
不要复杂的css结构不要进行复杂的DOM操作为浏览器启用硬件加速<div id=”content-area”> <div id=”page-1” class=”page”> … </div> <div id=”page-2” class=”page”> … </div> </div> 启用硬件加速:div.page {原创 2015-07-09 10:31:43 · 1939 阅读 · 0 评论 -
Cordova 8 架构使用sqlite
本来想现在开源产品这么多,使用sqlite应该很简单, 却走了不少弯路,特把可以成功过程在这里记录一下:插件网址: https://github.com/litehelpers/Cordova-sqlite-storage安装步骤使用cordova plugin命令安装 cordova plugin add cordova-sqlite-storage安装结束后,使用中会报错: new t原创 2015-07-16 16:41:01 · 9504 阅读 · 2 评论 -
Cordova 9 Toast plugin
安装cordova plugin add https://github.com/EddyVerbruggen/Toast-PhoneGap-Plugin.git使用方法module.controller('MyCtrl', function($cordovaToast) { $cordovaToast .show('Here is a message', 'long', 'center')原创 2015-08-03 13:59:12 · 1610 阅读 · 0 评论 -
Cordova 10 VS2013配置cordova开发环境
安装安装vs2013安装Visual Studio Tools for Apache Cordovahttps://www.visualstudio.com/en-US/explore/cordova-vs安装wp8 SDKhttp://www.microsoft.com/en-us/download/details.aspx?id=35471原创 2015-08-06 13:45:31 · 1938 阅读 · 0 评论 -
Ionic学习笔记一 配置及项目示例
安装 npm install -g ionic ionic start myproject cd myproject ionic platform add android ionic build android ionic emulate android (build emulate可合并执行: ionic run android ) 项目创建完,会原创 2015-08-14 16:54:30 · 15342 阅读 · 1 评论 -
Ionic学习笔记二 Scss配置
关于scss安装方式,参见文章 : http://blog.youkuaiyun.com/xundh/article/details/47605515scss位置ionic/scss/ionic.app.scss 注意文件里 @import “../www/lib/ionic/scss/ionic”; 路径要保持正确编译方法: sass –style compact ionic.app.sc原创 2015-08-15 15:05:25 · 7155 阅读 · 1 评论 -
Ionic学习笔记三 Gulp在ionic中的使用
简介Gulp是一个基于流的自动化构建器。安装> npm config set registry http://registry.npm.taobao.org ---最好用国内源> npm install -g gulp> npm install --save-dev gulp创建文件 gulpfile.jsvar gulp = require('gulp');gulp.task('defaul原创 2015-08-19 12:04:46 · 7188 阅读 · 3 评论 -
Ionic学习笔记4 一些问题处理
IONIC actionsheet 的cancel menu在android下不显示的bug在 _action-sheet.scss 有这个规则:.platform-android .action-sheet-cancel { display: none;}可以在自定义的scsss文件加上:.platform-android .action-sheet-cancel { displ原创 2015-11-06 11:10:09 · 2524 阅读 · 0 评论 -
Ionic学习笔记五 跨域处理及HTTPS问题处理
安装白名单服务cordova plugin add cordova-plugin-whitelist设置config.xml <allow-navigation href="http://*/*" /> <allow-intent href="*" /> <access origin="*" />设置csp<meta http-equiv="Content-Security-Policy原创 2015-11-25 13:39:57 · 11007 阅读 · 1 评论 -
Ionic学习笔记六 Cordova 插件开发
操作命令npm install -g plugman //安装plugmanplugman create --name udpPlugin --plugin_id com.whr.plugins.udpPlugin --plugin_version 0.0.1 //创建一个插件项目cd udpPluginplugman platform add原创 2015-12-01 16:22:21 · 4361 阅读 · 3 评论 -
Ionic学习笔记七 Cordova 文件下载插件的使用
URL : https://github.com/apache/cordova-plugin-file-transfer安装: cordova plugin add cordova-plugin-file-transfer1.5版本在使用中,可能遇到问题:file transfer error code 3 可安装老版本: cordova plugin add org.apache.cordo原创 2016-02-02 17:54:37 · 3887 阅读 · 0 评论 -
Ionic学习笔记八 Cordova APP cdvfile路径
使用Cordova File plugin时,文件地址格式一般用: cdvfile://localhost/persistent在android系统里,它会保存在root位置,app卸载时,文件不会被删除。在iOS系统里,它保存在应用程序路径里,app卸载时,文件会被删除。在android系统里,如果文件放在以.开头的子文件夹里,里面的图片文件就不会在图片管理功能里显示。 在iOS里,把c翻译 2016-02-24 08:48:02 · 8110 阅读 · 0 评论 -
Ionic学习笔记9 自定义插件使用aar
在src/android/下,放进目标aar文件,添加一个同名的.gradle文件,内容:ext.cdvMinSdkVersion = 15repositories{ jcenter() flatDir{ dirs 'libs' }}dependencies { compile 'com.android.support:supp...原创 2016-08-19 09:17:52 · 2025 阅读 · 0 评论 -
Ionic学习笔记10 热更新
通过 cordova-hot-code-push 实现热更新网址:https://github.com/nordnet/cordova-hot-code-push一般来说,所有在www目录下的文件都可以通过这个插件进行热更新。当把app打包的时候,会把html、javascript、images等文件放到web文件夹下,一般有两种方法可以实现更新它们: 1. 发布一个新版本 2. 牺牲离线的性能原创 2017-06-02 08:35:07 · 1207 阅读 · 1 评论 -
Ionic学习笔记11 自动生成启动图标
在项目的根目录下创建resources文件夹。在文件夹中都放入icon.png(应用图标,最小192x192px,不带圆角),splash.png(启动屏幕,最小2208x2208px,中间区域1200x1200px)(可以是png、psd、ai)在cmd中进入项目所在文件夹执行:ionic resources 执行该命令后,会自动在resources文件夹下创建已添加的平台名称的文件夹,如原创 2017-04-28 21:50:22 · 1506 阅读 · 1 评论 -
Ionic学习笔记11 打开设置界面插件
URL: https://github.com/guyromb/Cordova-open-native-settings安装/删除插件:cordova plugin (add|rm) https://github.com/guyromb/Cordova-open-native-settings.git --save使用插件(Android/IOS)if (window.cordova && win原创 2017-04-26 10:42:48 · 2491 阅读 · 0 评论 -
Ionic3 学习笔记1 项目架构
ionic3 使用angular4,与ionic1区别比较大。这里记录一些框架架构。 其中AngularJS2的构架结构可以参考: AngularJS2学习笔记项目主体resources放icon.png和splash.png 通过ionic resources --iconionic resources --splashionic resources用来生成桌面图标和启动界面src 文件原创 2017-10-22 17:34:37 · 741 阅读 · 0 评论 -
Ionic学习笔记12 插件安装一个错误的处理
ionic plugin error expected /* // or } but < found处理方式:重装插件试试运行clean脚本试试,位置:./platforms/ios/cordova/clean或./platforms/android /cordova/clean检查plugins/fetch.json plugins/ios.json 和 plugins/android.js原创 2016-12-09 16:33:47 · 1835 阅读 · 0 评论 -
Ionic学习笔记13 国际化
插件网址: http://ngcordova.com/docs/plugins/globalization/安装插件cordova plugin add cordova-plugin-globalization获得语言module.controller('MyCtrl', function($cordovaGlobalization) { $cordovaGl...原创 2018-04-18 13:29:27 · 462 阅读 · 0 评论 -
Ionic3 生成项目及扫描二维码
创建项目ionic start devdacticQRCodes blankcd devdacticQRCodes// 安装插件npm install ngx-qrcode2 --saveionic cordova plugin add phonegap-plugin-barcodescannernpm install --save @ionic-native/barcode-scanne原创 2017-10-27 22:36:10 · 4736 阅读 · 6 评论 -
Ionic3 发布/订阅
Ionic3 发布/订阅官网文档地址: https://ionicframework.com/docs/api/util/Events/发布import { Events } from 'ionic-angular'; //导入...export class EventsPage { user = '来自Events的数据' constructor(pub原创 2018-01-12 23:13:37 · 2003 阅读 · 0 评论 -
Ionic3 使用摄像头
cordova-plugin-camera 相机插件安装:$ ionic cordova plugin add cordova-plugin-camera$ npm install --save @ionic-native/camera使用1. app.module.ts的providers引用插件import { Camera,CameraOptions...原创 2018-03-22 20:40:51 · 2185 阅读 · 2 评论 -
Ionic3 Tips
编译生产环境版本:npm run build --prod如果不带prod参数,会出现splash显示后近10秒的白屏。深度链接模式默认状态下ionic3 的程序在各page间跳转时,URL是不变的。如果要从外部跳到ionic3的特定页面,就要使用deep linking技术,它现在是由@IonicPage装饰器提供的功能。基本用法Page页import...原创 2017-11-05 16:50:12 · 777 阅读 · 0 评论