ionic ios打包配置以及bug修复整理

最新推荐文章于 2020-08-18 13:42:36 发布

morn夏目

最新推荐文章于 2020-08-18 13:42:36 发布

阅读量3.1k

点赞数

分类专栏：学习笔记

本文链接：https://blog.youkuaiyun.com/chenzao1220/article/details/54933718

版权

学习笔记专栏收录该内容

22 篇文章

订阅专栏

一，ios打包配置
1.状态栏重叠

第一次打包发现状态栏重叠，网上搜索的原生代码无效。最后通过在config.xml里设置实现。

  <preference name="StatusBarOverlaysWebView" value="false" />（重要）
  <preference name="StatusBarStyle" value="default" />
  <preference name="StatusBarBackgroundColor" value="#72C147"/>

第二次打包发现顶部好了.但是header下面有一段margin，找到ionic.css(9600+行) 全部注释。

/*.platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader) {
  height: 64px; }*/
/*  .platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader).item-input-inset .item-input-wrapper {
    margin-top: 19px !important; }
  .platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader) > * {
    margin-top: 20px; }*/

/*.platform-ios.platform-cordova:not(.fullscreen) .tabs-top > .tabs,
.platform-ios.platform-cordova:not(.fullscreen) .tabs.tabs-top {
  top: 64px; }

.platform-ios.platform-cordova:not(.fullscreen) .has-header,
.platform-ios.platform-cordova:not(.fullscreen) .bar-subheader {
  top: 64px; }

.platform-ios.platform-cordova:not(.fullscreen) .has-subheader {
  top: 108px; }

.platform-ios.platform-cordova:not(.fullscreen) .has-header.has-tabs-top {
  top: 113px; }

.platform-ios.platform-cordova:not(.fullscreen) .has-header.has-subheader.has-tabs-top {
  top: 157px; }
*/

2.隐藏启动页的加载图标
config.xml里面

 <preference name="ShowSplashScreenSpinner" value="false"/>

3.强制竖屏
config.xml里面

  <preference name="orientation" value="portrait" />

二。bug修复

1.ios input会出现blur时把顶部顶到不见的情况
一般情况下在内加入 overflow-scroll=”false”可以解决。

2.yhh项目的ajax的采用angular的$http封装，不再采用之前封装的jquery的ajax，但是传输方式有点变化，需要在app.js 的 config

$httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';
$httpProvider.defaults.transformRequest = function(data){
       if (data === undefined) {
           return data;
       };
       return $.param(data);
 };

封装时 $http设置

headers: { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'}。

4.android4.4以下webview的表现很差，于是集成crosswalk
直接安装插件：

cordova plugin add cordova-plugin-crosswalk-webview

5.ios上无法格式化‘2005-01-12’的时间格式，需要替换成‘2005/01/12’的格式。

.replace(/-/g,"/"))

6.轮播图更新后需要手动调用

$ionicSlideBoxDelegate.update();//更新
$ionicSlideBoxDelegate.loop(true);//循环

7.debug包可以连接电脑开启调试模式，要求系统>=4.4

谷歌浏览器输入：chrome://inspect

8.ios键盘挡住输入框。特别是底部单独有一个输入框的情况的解决方法
（http://blog.youkuaiyun.com/lovelyelfpop/article/details/52033045）
ios 的配置 config.xml 加入以下配置

<preference name="KeyboardShrinksView" value="true" />  
<preference name="DisableScrollingWhenKeyboardShrinksView" value="true" />