ionic1中ios系统头部被拉伸，多出20px的问题处理

最新推荐文章于 2021-10-15 17:57:05 发布
最新推荐文章于 2021-10-15 17:57:05 发布
阅读量292 收藏
点赞数
分类专栏： angular 文章标签： ionic
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43462746/article/details/100775387
版权

看了别的大佬(https://www.jianshu.com/p/076fc3c2aa04)排除推测的原因是：Ionic判断错了环境，以为这是一个类似打包软件的环境，所以自动加上了一个类似状态栏的高度(安卓下显示正常)
在这里插入图片描述
正常用cordova打包app的话可以在config.xml文件中配置
在这里插入图片描述
以上不能解决的话，试试在app.js文件中 $ionicPlatform.ready函数中加入ionic.Platform.isIOS() ? ionic.Platform.fullScreen(true,true) : ionic.Platform.fullScreen()这行代码
注意：ionic.Platform.fullScreen()在ios下底部会拉伸，在IOS中不加这两个参数的话可能会无法显示出状态栏

今天也要加油哇
关注
专栏目录
ionic在开发ios系统微信时键盘挡住输入框的解决方法(键盘弹出问题)
01-19
在使用ionic开发IOS系统微信的时候会有一个苦恼的问题，填写表单的时候键盘会挡住输入框，其实并不算什么大问题，只要用户输入一个字就可以立刻看见输入框了。 　可惜的是，有些客户是不讲理的，他才不管这个问题，...
ionic 全屏显示页面 输入框被输入法遮盖
技术追求者！
12-27 4133
解决 ionic 全屏显示页面 输入框被输入法遮盖 ，避免在config.xml中配置下<preference name="Fullscreen" value="true" />;
ionic3关于在ios系统头部会顶到状态栏上面的问题
qq_37517311的博客
03-16 3516
最近在做一个影用ionic3写的银行方面的项目，接触这个项目的时间项目基本已经完结，只剩下一些优化工作和页面样式问题；遇到过几个比较印象深刻的问题，本文要说的就是当用ionic3的ModalController组件创建页面后，再在这个页面用this.nav.push()方法跳转到下一个子页面时，这个子页面的头部在ios系统里会顶到状态栏上。解决办法是使用ModalController组件的onDi...
Ionic中设置页面横屏和全屏的那些坑
weixin_38299362的博客
03-24 2462
ionic建的程序中设置页面全屏和横屏遇到了一些BUG，在更改这些BUG的过程中发现了这些坑，现在给小伙伴们讲一下，大家以后遇到相同的问题就可以绕过去了。 1 设置全屏的坑我是用隐藏状态栏的方式实现的全屏，本来是已经实现了的，想着新建一个样例给小伙伴们讲一下的，结果在新建的程序下面用同样的代码都实现不了，后来查找原因居然是状态栏相关的插件居然没有添加进去，本来新建tabs程序是默认添加过的，不知道...
ionic 头部隐藏 ios问题
weixin_33979203的博客
11-30 100
ionic 隐藏头部使用hide-nav-bar="true" ，存在tabs界面的app，先点击app在点击有隐藏头部的二级界面会导致手机上方空白、 在ios上导致下面定义的内容顶住了头部。 解决方法用 <ion-nav-bar class="hide"></ion-nav-bar>然后就可以使用各种布局啦 转载于:https://www.cnblogs....
MUI在ios中的一些问题
Mr-k的博客
12-29 8022
MUI开发中，ios跟Android是存在差异，目前碰到的问题有以下几种 1，IOS跟Adroid在margin值时，存在差异，这时候只要让手机判断是IOS还是Android即可，这里给出两种方式判断 console.log（mui.os）,可以看到//第一种if(mui.os.android){ //注意，这里是小写的android $("#header").css("margin-to
ionic通过HmacSHA1加密对接Java系统
06-05
在本文中，我们将深入探讨如何使用Ionic框架通过HmacSHA1加密方法与Java系统进行安全的数据交互。HmacSHA1（Hash-based Message Authentication Code with SHA-1）是一种用于验证数据完整性和来源的安全算法，常用于...
ionic开发中点击input时键盘自动弹出
08-31
总的来说，这个`focusInput`指令是针对Ionic应用中输入框被键盘遮挡问题的一个有效解决方法，它通过自定义事件监听和适当的延迟处理，实现了在键盘弹出时自动滚动屏幕，保持关键元素可见，提升了用户体验。...
Splash适配解决启动图拉伸的问题
热门推荐
猴子请来的救兵
01-29 1万+
https://github.com/xiandanin/SplashCompatSample 前言 做过Splash的都知道，一般的做法是在style中设置windowBackground为启动图，来避免冷启动时的黑屏，但是如果放一张尺寸的图在某些屏幕上就会出现拉伸，并且windowBackground还不能centerCrop，就算通过资源限定符也不能完美的适配。 效果 左边是小米5S（108...
ionic head中加了内容 content 的margin-top变太大解决方法
张峰的博客
12-10 291
ionic1 ios11 statusBar
strong90的博客
08-22 528
ionic1 ios11 statusBar  会出现高度不对的情况，head和状态栏重叠 &lt;main.html&gt;中添加 &lt;meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, ...
Cordova ionic开发获取iOS状态栏高度
qq_39157025的博客
05-13 590
文章目录 前言 使用步骤 提示 前言 通过Cordova插件获取iOS手机状态栏高度 使用步骤 插件源码： @objc(Status) class Status: CDVPlugin { @objc func getStatusHeight(_ command:CDVInvokedUrlCommand){ let height = UIApplication.shared.statusBarFrame.height let result =.
ionic中的$ionicPlatform.ready事件中的通用设置
Wang的专栏
06-11 1697
前言$ionicPlatform.ready事件是用于检测当前的平台是否就绪的事件，相当于基于document的deviceready事件, 在app中一些通用关于设备的设置必须在这个事件中处理, 为了代码的可读性,我们把设置功能封装成一个方法, 只要在该事件中调用就行了。关键代码和说明.factory('setCommon', [ '$ionicPlatform', '$locat
iphoneX的H5页面底部多出大概20多像素高度的白条
6块腹肌的博客
11-06 3509
在meta标签添加：viewport-fit=cover，即可解决问题 <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no, viewport-fit=cover"> ...
ionic的性能优化和ionic-native-transitions插件的参数调优等
Wang的专栏
06-03 4422
在ionic1中性能是瓶颈但经过优化后，性能堪比原生。当然前提条件是需要说明一下的：首先，性能直接体现在安卓系统上，然后就是安卓系统版本问题，在4.4版本前后是一个分水岭。经过优化后，安卓4.3的机器也可以完美运行，当然会在一些机型上出现bug, 但也可经cordova插件中通过对系统机型的判断针对性解决问题。这里需要强调一下, 首先是ionic1中的问题，因为在这里问题比较多，需要详细记录下。在i
苹果刘海全面屏底部留白问题解决（viewport-fit=cover）
KevinXin的博客
10-15 7368
在meta标签设置viewport-fit=cover，页面就会填充整个刘海区域（前提是浏览器或套页面的app必须做了iphonex的兼容）。 <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover"> 如果上面属性设置之后，再把html,boby高度设置成100% 发现底部出现空白没有填满，这主要是这里的100%，只是安全区域的高度，是不包含非安全区域的。要使页面元
angularjs中书写window.resize功能
chi1130的博客
12-14 1929
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="angular.js"></script> <script> var app = angular.module('myApp', []); app.controller('my
Ionic4—splash启动页配置详解
雷雨天的雷胖子
01-02 1121
目录 一、概述 二、参数详解 三、问题汇总 一、概述 Ionic4混合开发中项目的启动目前还没有达到秒开级别，偶尔启动缓慢。Ionic4使用splash启动页来提升用户体验。Ionic4启动时会优先展示splash启动页，之后才进一步加载WebView。config.xml中splash启动页的相关配置如下。 <!--禁用启动屏滚动--> <preference n...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值