跟着ionic走了几个项目,也碰到了不少问题,准备慢慢开始整理出来,这篇文章不出意外的话,应该会不定时更新:
2、部分安卓低版本手机会无法安装或者打开app
11、
当两个页面的header高度不一的时候,由于iOS上页面切换的动画效果是从左往右或从右往左,这个时候会导致header的渲染出现UI问题,折中办法是把app的页面切换动画改成安卓手机效果就不会出现了:
imports: [
IonicModule.forRoot(MyApp, {
backButtonText: '',
pageTransition: 'md-transition'
}),
CloudModule.forRoot(cloudSettings),
HttpModule
]
12、input输入框自动focus/blur:
1、如何不让splash页面自动消失
config.xml页面配置:
<preference name="AutoHideSplashScreen" value="false"/>
component的ready之后
// spalsh关闭
setTimeout(function () {
Splashscreen.hide();
}, 1000)
2、部分安卓低版本手机会无法安装或者打开app
需要安装插件
ionic plugin add cordova-plugin-crosswalk-webview --save
笔者下过2.1.0的一个版本结果高版本的手机装了打不开,后面下了2.3.0的版本,才正常运作。不确定是插件原因还是app原因,不过我都是指定到2.3.0版本的,防止出现类似情况。
注:安装这个插件以后有一个弊端会造成打出来的apk愣生生大了十几兆,因此最好能跟产品经理沟通确认好这个问题,否则就不能玩耍了。
另外:
3、ionic上,如果用到ion-input和ion-textarea,需要在外面套ion-list和ion-item,这样,软键盘才能在focus到input和textarea上时自动将页面上推,否则会盖住输入框
另外:
如果安装了这个插件以后,打出来的包却无法安装,是由于少了对应arm7的文件在:
D:\xampp\htdocs\poct-level-front\poct-mobile-client\platforms\android\libs
文件夹下面找到这个文件夹:
armeabi
将它重新拷贝一份以后重命名为:
armeabi-v7a
3、ionic上,如果用到ion-input和ion-textarea,需要在外面套ion-list和ion-item,这样,软键盘才能在focus到input和textarea上时自动将页面上推,否则会盖住输入框
4、处理app在安卓手机启动慢的问题:
分为两种情况:
情况1:打包时候没有在命令行添加--prod,很简单,只需要在命令末尾添加这句,不仅打的包会小,而且启动速度也很快
分为两种情况:
情况1:打包时候没有在命令行添加--prod,很简单,只需要在命令末尾添加这句,不仅打的包会小,而且启动速度也很快
情况2:这种比较复杂了,笔者遇到的情况是,添加的安卓平台默认是5.2.0,导致启动巨慢,处理方法是,
1)先手动把根目录下
plugins文件夹删掉
2)然后再把安卓平台删掉:
ionic cordova platform remove android(没有装ionic3的童鞋,命令里面不需要加cordova)
3)再添加平台,不过要指定一个版本:
ionic cordova platform add android@6.1.0
4)重新编译apk就好
5、如果错安装了ionic3想降级到2怎么办?
npm uninstall -g ionic // 卸载ionic
npm cache clean // 清干净
npm install -g ionic@2 // 回滚
6、升级ionic3以后编译ionic2的项目遇到了报错
笔者是由于npm5.0版本导致的问题
先降级npm到4.0版本:
npm install -g npm@~4.0.0
再删node_modules
重装项目node_modules
7、安卓启动app总提示application error解决方法:
在config.xml中加:
在config.xml中加:
<preference name="loadUrlTimeoutValue" value="700000" />
8、android 退出再进入没显示splash:在config.xml中加:
<preference name="SplashShowOnlyFirstTime" value="false" />
9、当安装了ionic-plugin-keyboard插件时,会导致一个问题:
在iOS手机上当弹出软件盘时,软键盘最上“完成”的toolbar不见了,这是由于这个插件默认将这个bar隐藏掉了,处理方法是:
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(false)
10、如果有不是a或者button标签绑定了click事件,会出现一段延迟,导致体验感不好,这时候可以在绑定了click事件的标签上面加个属性“tappable”,就可以避免这个现象。
在app.module.ts中加入:
pageTransition: 'md-transition'
pageTransition: 'md-transition'
即:
...
...
imports: [
IonicModule.forRoot(MyApp, {
backButtonText: '',
pageTransition: 'md-transition'
}),
CloudModule.forRoot(cloudSettings),
HttpModule
]
...
12、input输入框自动focus/blur:
import { ViewChild } from '@angular/core';
import { TextInput } from 'ionic-angular'
@ViewChild('input') input:TextInput
//自动focus
//自动focus
this.input.setFocus()
//自动blur
this.input._native._elementRef.nativeElement.blur()
注:由于笔者项目用的不是最新版ionic,所以不支持setBlur方法,只能用原生自带的,据说新版支持this.input.setBlur(),但是还没亲测过,有兴趣的童鞋可以用最新框架试一下
13、关于ionic-native
import { Device } from 'ionic-native';
device好像ionic框架默认会先装,加平台的时候
Device.device.platform == "iOS"
但是新版的ionic不会默认装,需要用到哪个装哪个