"style": {
"navigationStyle": "custom", // 取消本页面的导航栏
"app-plus": {
"animationType": "fade-in", // 设置fade-in淡入动画，为最合理的动画类型
"background": "transparent", // 背景透明
"backgroundColor": "rgba(0,0,0,0)", // 背景透明
"webviewBGTransparent":true,
"mask":"none",
"opacity":0.9,
"popGesture": "none" // 关闭IOS屏幕左边滑动关闭当前页面的功能
}
}
tuzi
- 发布：2020-08-21 11:49
- 更新：2022-04-08 18:05
- 阅读：13016
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： 7
HBuilderX类型： 正式
HBuilderX版本号： 2.8.8
手机系统： Android
手机系统版本号： Android 10
手机厂商： 华为
手机机型： nova4
页面类型： vue
打包方式： 云端
项目创建方式： HBuilderX
示例代码：
操作步骤：
打开对应的页面后，背景依然为白色，除非设置opacity，但是那并不是我想要的效果
打开对应的页面后，背景依然为白色，除非设置opacity，但是那并不是我想要的效果
预期结果：
打开对应的页面后，背景依然为白色，除非设置opacity，但是那并不是我想要的效果
打开对应的页面后，背景依然为白色，除非设置opacity，但是那并不是我想要的效果
实际结果：
打开对应的页面后，背景依然为白色，除非设置opacity，但是那并不是我想要的效果
打开对应的页面后，背景依然为白色，除非设置opacity，但是那并不是我想要的效果
bug描述：
uniapp在APP中设置窗口背景透明无效
7 个回复
1***@qq.com
按照文档使用，发现无法实现透明背景
在页面中设置style 样式 style 头部 不能引入 scoped
然后 在样式中加入 page {background: transparent;} 即可实现 uniapp app 测试有效。知识来源于分享
chenli
两个要一起使用才可以。
t***@qq.com
安卓我只设置了页面的page透明没用，只设置pages.json透明也没用，两个一起设置就有用了
2021-07-13 11:08
hws007 - 我就是我！
< style lang="scss" scoped >记得里面要去掉scoped，搞半天，才发现
APP搞定
在看H5，怎么透明
chenli
tuzi (作者)
试过了，没用
2020-08-21 13:47
chenli
回复 tuzi: 样式方式：page {background: transparent;}
2020-08-21 13:54
tuzi (作者)
回复 chenli: 谢谢，这下可以了
2020-08-21 14:14
梦里追逐
回复 tuzi: 大佬 你是具体怎么设置的 我按照你的设置还是不行 不透明呢
2021-01-12 19:52
1***@qq.com
设置了 page {background: transparent;} 还是没有透明效果
梦里追逐
我也是的
2021-01-12 19:55
景风
请问解决了吗，我加了也没透明
2021-06-30 18:30
一抱一个胖猪猪 - 喜猪妹一只，爱超大只！管你好不好看，吨位最重要！
请问透明成功了吗
陌语 - uni-app
为什要这么做把页面设置透明呢？ 你直接在页面中的style里面添加这个样式就搞定了。 page{background-color: rgba(0, 0, 0, 0)} 这样整个页面就透明了，根本不用去pages.json中设置哦。
1***@qq.com
如果你需要一个可以盖住原生导航栏的弹出框呐
2022-07-15 18:02