uniapp顶部安全距离（包括app）

在自定义导航的时候，如果不对顶部距离处理的话就会顶到屏幕最上边，标题可能会被手机的齐刘海挡住。

之前在做小程序的时候，我都是用 getMenuButtonBoundingClientRect() 获取胶囊菜单的顶部距离等信息来处理顶部安全距离，但在app和H5上用不了，不过uniapp提供了个更好用的 var(–window-bottom) （在css使用）

padding-top:  var(--status-bar-height) ;//给组件加个上边距/*或者写一个占位div，高度设为css变量
height: var(--status-bar-height);*/

可以封装个自定义导航组件，这样就不用每个页面都改了。

uniapp顶部安全距离（包括app）相关推荐

视频教程-uni-app实战商城类app和小程序-Webapp
uni-app实战商城类app和小程序帝莎学院创始人&CEO,目前主要从事全栈开发.Python.PHP.小程序.App.Web等技术的研究和开发.专注于实战类教程,授课风趣幽默,讲解条理清 ...
【uni-app】使用定义在App.vue的方法
[uni-app]使用定义在App.vue的方法前言在methods中添加(推荐) 在globalData中添加方法(不建议) 前言接手了一个小程序项目,考虑到后期可能会扩展到APP上,筛选技术 ...
升级鸿蒙手机内数据会删除吗,鸿蒙系统：手机升级不会删除任何文件，包括APP的登录状态都不会掉...
迫不及待给自己的手机升级了HarmonyOS. (升级系统不会删除任何文件,包括APP的登录状态都不会掉,放心升级吧) 一件事很奇怪,mate40Pro升级包3个G,mate30竟然要5.6个G,em ...
uni-app 实现打开第三方app
uni-app 实现打开第三方app manifest.json -> plus -> distribute -> apple 节点下,添加 urlschemewhitelist.对 ...
对uni-app开发的某app安全分析
声明以下只是搬运下我公众号的东西.很早就发过了.原帖地址: 对uni-app开发的某app分析已经发公众号的为什么还发csdn 有的圈内朋友,不经过我的允许,删减摘录我公众号的内容,这里就不提谁了 ...
uniapp之unipush安卓app信息推送
第一步,uniapp 官网查找推送 uni-app官网介绍业务.开通流程,请务必仔细阅读 UniPush使用指南 - DCloud问答第二步,unipush相关链接开通的unipush是封装了个 ...
Uniapp+Nodejs实现外卖App项目1-项目介绍
项目介绍本项目采用uniapp和nodejs(数据接口).mongodb等技术实现了一个类似美团外卖的简易APP.项目主要目的是为了快速上手,如何快速使用uniapp开发一个app项目,同时掌握一些 ...
uniapp实现webview和APP之间的传值通信 / VUE和HTML页面通信
首先,让我们来谈谈会应用到什么业务场景. 在uniapp开发中会我们可能会内嵌html, 并且有时候还需要相互通信的需求例子:我们有个移动端的现成做好的网页,需要搬到uniapp开发的项目中,需要把 ...
计算机毕业设计Python+uniapp+安卓运动健康app（WEB+APP+LW）
计算机毕业设计Python+uniapp+安卓运动健康app(WEB+APP+LW) 该项目含有源码.文档.程序.数据库.配套开发软件.软件安装教程项目运行环境配置: Pychram社区版+ py ...

uniapp顶部安全距离（包括app）

uniapp顶部安全距离（包括app）相关推荐

最新文章

热门文章