【解决】Weex ios app 安装首屏出现64px白底

最新推荐文章于 2024-07-05 11:10:45 发布
最新推荐文章于 2024-07-05 11:10:45 发布
阅读量174 收藏
点赞数
CC 4.0 BY-SA版权
原文链接：https://segmentfault.com/a/1190000011393229
本文解决了Weex在iOS真机测试中出现的64px白边问题，通过阅读源码发现是在隐藏原生NavigationBar时未调整显示区域高度所致。最终通过对相关文件进行修改解决了该问题。

问题如图

调试状态下显示正常

真机测试时会有大概64px的白底

思路

我们在WeexPlayground App 调试时效果也是正确的，但是会有一个应该也是64高的蓝色NavigationBar

于是身为一个纯web开始读oc的源码了。最终找到此文件

/platforms/ios/weexDemo/weexScanner/WXDemoViewController.m

weex在打包的时候会将原生的NavigationBar（高64）隐藏，但并没有把显示显示区域减去但64补回来

解决

前提：使用weexpack 添加的默认ios plantform
需要根据自己的情况对上图作下修改
我最终将那个剪去的64px的高补了回去

最总效果

封装微信小程序顶部导航栏，自适应各种手机屏幕
weixin_50147372的博客
12-30 959
根据当前需求封装的，ios标题居中，安卓上靠左，可能有点垃圾，希望给位指正 首先要在封装的page.json文件下写入: "navigationStyle":"custom", 在app.js中定义全局获取顶部高度 创建导航栏组件navigation（名字自定义） // 获取屏幕参数 try { const res = wx.getSystemInfoSync() if (res.platform == 'ios') { _this.globalData.p
12个前端必会 H5 问题及解决方法
qianduan666a的博客
08-14 1092
前言 作为一个开发了多个 H5 项目的前端工程师，在开发过程中难免会遇到一些兼容性等爬过坑的问题。现在我将这些问题一一汇总一下，并在后面给出坑产生的原理，和现阶段常规的填坑方案。由此来做一个阶段性的总结。 问题 下面列举了我遇到的一些常规问题，如有遇到其他问题请在评论区补充，之后我也会实践后加以补充，感谢！（经常更新该文） 移动端 H5 相关问题汇总： 1px 问题 响应式布局 iOS 滑动不流畅 iOS 上拉边界下拉出现白色空白 页面件放大或缩小不确定性行为 click 点击穿透与延迟
解决Window桌面上的图标都变成白底问题
嵌入式LINUX成长ING
01-08 2433
先来看看问题的现象吧：： 再来说说这个问题是这么出现的。 本来我想从Word中复制一张图片，在桌面粘贴。一路的点确定就出现了。不信你可以试试。 解决方法：在桌面空白地方“右键”-->“属性”-->"桌面“-->"自定义桌面”-->"Web"-->"网页“中去掉所有选择的，也可以删除。OK
weex run ios 不成功问题
CodingFire的博客
03-07 3421
在目前weex1.2.9版本中，通过weex run ios 运行iOS模拟器的时候失败，报错： Error:Error: Command failed: xcodebuild -workspace WeexDemo.xcworkspace -scheme WeexDemo -configuration Debug -destination id=15CCC22B-5292-4708-B32...
运行 iOS 模拟器中的 App 后显示空白-warning：Unsupported Configuration: Scene is unreachable due…
柳婼 の blog
07-22 1822
错误警告码是：warning: Unsupported Configuration: Scene is unreachable due to lack of entry points and does not have an identifier for runtime access via -instantiateViewControllerWithIdentifier:. 错误原因是
uniapp底部设置flexd，ios被底部导航栏遮盖
m0_51572647的博客
07-05 551
问题，unaipp的微信h5项目，设置position:flexd;时，其他端正常，ios被uniapp的底部导航栏遮盖住，关键就是 var(--window-bottom)，其中--window-bottom是计算距离底部距离，可以适配ios。//自动计算距离底部距离。
解决 overflow :auto 整个浏览器出现进度条_H5 问题及解决方法
weixin_39641334的博客
11-21 1108
移动端 H5 相关问题汇总：1px 问题响应式布局iOS 滑动不流畅iOS 上拉边界下拉出现白色空白页面件放大或缩小不确定性行为click 点击穿透与延迟软键盘弹出将页面顶起来、收起未回落问题iPhone X 底部栏适配问题保存页面为图片和二维码问题和解决方案微信公众号 H5 分享问题H5 调用 SDK 相关问题及解决方案H5 调试相关方案与策略移动端 H5 相关基础技术概览原理与实践之前两篇文章...
H5常见问题及解决方案手册
热门推荐
前端开发博客
05-24 1万+
作者/成都之声 阅读本文需要5分钟前言作为一个开发了多个 H5 项目的前端工程师，在开发过程中难免会遇到一些兼容性等爬过坑的问题。现在我将这些问题一一汇总一下，并在后...
解决 overflow :auto 整个浏览器出现进度条_12个前端必会 H5 问题及解决方法
weixin_39769627的博客
11-23 1190
前言作为一个开发了多个 H5 项目的前端工程师，在开发过程中难免会遇到一些兼容性等爬过坑的问题。现在我将这些问题一一汇总一下，并在后面给出坑产生的原理，和现阶段常规的填坑方案。由此来做一个阶段性的总结。问题下面列举了我遇到的一些常规问题，如有遇到其他问题请在评论区补充，之后我也会实践后加以补充，感谢！（经常更新该文）移动端 H5 相关问题汇总：1px 问题响应式布局iOS 滑动不流畅iOS 上拉边...
Qt for ios 设置程序图标（logo）和启动页（splash）
luoyayun361的专栏
02-02 1917
前言 Qt开发ios程序，要面临的一个问题就是设置程序图标和启动页的问题，作为一个跨平台开发者，对原生开发本身就不太熟悉，即便是这种小功能也可能会成为阻碍，没办法， 只能硬着头皮上咯。 要设置ios的启动页和程序图标，必须要在xcode中进行设置，之前有文章已经详细的说明了如何将一个Qt工程拿到xcode中进行编译，文章在这里。 接下来直接看如何在xcode中进行设置吧。 环境 我的开发环境: Q...
h5页面ios键盘弹出收起后页面底部留白问题
qq_38810813的博客
11-01 568
<textarea style="width:100%;height: 180px;background: #F4F4F4;border-radius: 10px;border:0;font-size: 14px;color: #666666;padding: 20px;" data-val="true" name="CommentContent" id="CommentContent" @focus="focusIn" @blur="blurIn"></textarea> foc
uniapp 打包运行到ios或者鸿蒙底部会留有一段白底的安全距离，怎么去除
06-25
我们被要求去除UniApp在iOS或鸿蒙系统底部安全距离的白底（白色空白）。根据问题描述，这是在iOS和鸿蒙系统上出现的底部安全区域白色空白问题。分析问题：在全面屏设备的底部有一个安全区域，通常是为了避免内容被...
移动端开发必会出现的问题和解决方案
qq_43623970的博客
04-30 1862
对于一个开发了多个H5的前端工程师，在开发过程中难免会遇到一些兼容性等爬过坑的问题。现在我将这些问题一一汇总一下，并在后面给出坑产生的原理，和现阶段常规的填坑方案。由此来做一个阶段性的总结。 问题 下面列举了我遇到的一些常规问题，如有遇到其他问题请在评论区补充，之后我也会实践后加以补充，感谢！（经常更新该文） 移动端 H5 相关问题汇总： 1px 问题 响应式布局 iOS 滑动不流畅 iOS 上...
PWA在ios桌面增加头部
07-08
- 引用[3]提到PWA可以解决跨平台一致性的问题，并具有安装成本低的特点。 相关问题： 1. 如何为PWA应用配置不同平台的图标和启动画面？ 2. 在iOS上，如何处理PWA应用的状态栏覆盖问题？ 3. 如何测试PWA在iOS...
一款基于MVVM架构的学习小项目，已经实现的功能有： 1.新闻和视频列表的查看 2.基于高德地图实现定位和城市搜索 3.
09-12
一款基于MVVM架构的学习小项目，已经实现的功能有： 1.新闻和视频列表的查看 2.基于高德地图实现定位和城市搜索 3.基于高德地图实现的城市天气查询 4.基于百度智能云实现网络图片、本地图片以及拍照图片的OCR识别。 5.实现记事本功能和待办功能 6.支持二维码扫一扫 7.支持在线版本更新.zip
拍照，录像，特效，修图，二维码，人脸识别.....zip
09-12
拍照，录像，特效，修图，二维码，人脸识别.....zip
二维码代码(1).zip
09-12
二维码代码(1).zip
睿意通少年派中最强的存在，包括四大二维码的生成以及无视距离的远程控制，现公开具体的源代码，仅以此纪念我们逝去的青春.zi
最新发布
09-12
睿意通少年派中最强的存在，包括四大二维码的生成以及无视距离的远程控制，现公开具体的源代码，仅以此纪念我们逝去的青春.zip
基于IMM卡尔曼滤波器的GNSS_UWB_INS子模型切换算法组合导航仿真的Matlab代码_Matlab code f
09-12
基于IMM卡尔曼滤波器的GNSS_UWB_INS子模型切换算法组合导航仿真的Matlab代码_Matlab code for GNSS_UWB_INS sub-model switching algorithm integrated navigation simulation using IMM-Kalman filter.zip
iOS应用全屏运行解决上下黑边问题
在iOS设备上运行应用程序时，开发者可能会遇到屏幕上下出现黑边的情况，这通常是因为应用界面没有正确适配设备的全屏幕显示。为了解决这一问题，我们需要了解几个关键的技术点和解决方案。 ### 关键技术点 1. **...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值