uniapp开发,app手机状态栏问题挡住问题、小程序关闭过滤无依赖文件

3 篇文章 0 订阅
1 篇文章 0 订阅

问题:在使用uniapp开发手机App时,因为HBuildX创建的应用默认是沉浸式样式,如果去除自带的导航栏之后,页面会直通手机顶部状态栏,解决办法如下:

方法1:使用uniapp官方文档提供的解决方案https://uniapp.dcloud.io/collocation/pages?id=customnav
在这里插入图片描述
方法二:配置mainfest.json来关闭沉浸式。打开应用的manifest.json文件,打开源码视图,app-plus 下添加 statusbar >immersed节点并设置值为false

"app-plus" : {
    "statusbar": {  
        "immersed": false  
    },
}

方法二,测试成功!

参考:https://blog.p2hp.com/archives/8524

小程序关闭过滤无依赖文件

只需在“project.config.json”=>“setting”里面将"ignoreDevUnusedFiles"和"ignoreUploadUnusedFiles"都设置为 false,然后保存,重新编译即可。

"ignoreDevUnusedFiles": false,
"ignoreUploadUnusedFiles": false,

在这里插入图片描述
相关文档 https://developers.weixin.qq.com/minigame/dev/devtools/projectconfig.html
参考:https://blog.csdn.net/tianpeng1996/article/details/126928230

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
使用uniapp开发京东小程序时,可以通过设置沉浸式状态栏来提升用户体验。沉浸式状态栏是指将状态栏与应用界面融为一体,使应用的内容延伸到状态栏区域,给用户一种全屏的视觉效果。 要实现沉浸式状态栏,可以按照以下步骤进行操作: 1. 在uniapp项目的`manifest.json`文件中,找到`"mp-weixin"`或`"mp-alipay"`字段,添加`"window"`属性,并在该属性下添加`"navigationStyle"`属性,将其值设置为`"custom"`。这样可以自定义导航栏样式。 2. 在需要使用沉浸式状态栏的页面的vue文件中,可以通过设置`navigationBarStyle`属性来自定义导航栏样式。例如: ```vue <template> <view> <!-- 页面内容 --> </view> </template> <script> export default { data() { return { navigationBarStyle: { backgroundColor: '#ffffff', // 导航栏背景色 borderBottom: 'none', // 底部边框线 }, }; }, }; </script> ``` 3. 在App.vue文件中,可以通过设置`onLaunch`生命周期函数来获取系统状态栏高度,并将其保存到全局变量中。例如: ```vue <script> export default { onLaunch() { uni.getSystemInfo({ success: (res) => { uni.setStorageSync('statusBarHeight', res.statusBarHeight); }, }); }, }; </script> ``` 4. 在需要使用沉浸式状态栏的页面的vue文件中,可以通过计算属性获取系统状态栏高度,并设置页面内容的上边距。例如: ```vue <template> <view :style="marginTopStyle"> <!-- 页面内容 --> </view> </template> <script> export default { computed: { marginTopStyle() { const statusBarHeight = uni.getStorageSync('statusBarHeight'); return `margin-top: ${statusBarHeight}px;`; }, }, }; </script> ``` 这样就可以实现在uniapp开发的京东小程序中使用沉浸式状态栏了。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值