success: (res)=>{//获取手机顶部状态栏的高度const statusBarHeight = res.statusBarHeight || 0;//获取导航栏的高度(手机状态栏高度 + 胶囊高度 + 胶囊的上下间距)const menuButtonInfo =uni.getMenuButtonBoundingClientRect(); const navBarHeight= menuButtonInfo.height + (menuButtonInfo.top - statusBa...
//获取胶囊按钮的布局位置信息,坐标信息以屏幕左上角为原点 let custom = wx.getMenuButtonBoundingClientRect() //导航栏高度 = 状态栏到胶囊的间距(胶囊距上距离-状态栏高度) * 2 + 胶囊高度 + 状态栏高度。 this.$options.globalData.customBar = custom.bottom + custom.top - e.statusBarHeight // #...
一般呢 采取第二种方法,但是呢 这里如果取消了 往里面写东西会顶上到状态栏 非常丑比,所以我们需要获取到导航栏高度然后设置一下: 上图已经获取到了导航栏的高度 这个方法 只有APP有效 小程序和 H5 是获取不了的。小程序应该是可以的 但是我不行 小程序获取方法如下: 代码在这里: let systemInfo = uni.getS...
// #endif// #ifdef MP-WEIXINletcustom=wx.getMenuButtonBoundingClientRect()barHeight=custom.bottom+custom.top-e.statusBarHeight// #endif// #ifdef MP-ALIPAYbarHeight=e.statusBarHeight+e.titleBarHeight// #endif// 本地缓存uni.setStorageSync('bar_height',barHeight);// 状态栏加导航栏的高度...
uni.getSystemInfo({//获取系统信息success:res=>{letnavHeight=menuButtonObject.height+(menuButtonObject.top-res.statusBarHeight)*2;//导航栏高度=菜单按钮高度+(菜单按钮与顶部距离-状态栏高度)*2this.titleBarHeight=navHeight;this.statusBarHeight=res.statusBarHeight},fail(err){console.log(err);}})}...
uni-app 获取可用屏幕宽度,高度,letsystemInfo=uni.getSystemInfoSync()//px转换到rpx的比例letpxToRpxScale=750/systemInfo.windowWidth;//状态栏的高度letktxStatusHeight=systemInfo.st...
3、获取到手机状态栏的高度,胶囊宽高计算出状态栏与胶囊按钮中的空隙,保存至缓存 conststatusBarHeight = (uni.getStorageSync('statusBarHeight')||ref({}))//手机状态栏的高度,这个状态来就是手机顶部的电量啊,信号这些区域的高度,如果是刘海屏,它还会包含刘海屏的高度constmenuButtonInfo =ref({})//胶囊信...
首先要获取到系统状态栏的高度和胶囊按钮的位置信息 大概就是这样 状态栏高度可以通过uni.getSystemInfoSync().statusBarHeight 胶囊按钮信息可以通过uni.getMenuButtonBoundingClientRect()获取,只要知道按钮的高度和到顶部的距离就可以了。 实现代码 <view:style="{ height: `${searchHeight}px`, paddingTop: `${...
statusBarHeight: 0, //状态栏的高度 navigatorHeight: 0, //导航栏高度 menuHeight: 0, //胶囊高度 menuTop: 0, //胶囊与顶部的距离 totalHeight: 0, //总高度 } }, onLoad() { //获取系统信息 uni.getSystemInfo({ success: res => { ...