uniapp自定义导航栏高度

 // 获取状态栏高度
var { statusBarHeight } = uni.getSystemInfoSync();// 获取胶囊位置尺寸
var menuButtonObject = uni.getMenuButtonBoundingClientRect();
var { top, height } = menuButtonObject;
// 获取导航栏的高度
var navBarHeight = height + (top - statusBarHeight) * 2;
// 计算状态栏与导航栏的总高度
var statusNavBarHeight = statusBarHeight + navBarHeight;

uniapp自定义导航栏高度相关推荐

uni-app 顶部导航栏高度计算 + 胶囊高度计算
uni-app 顶部导航栏高度计算 + 胶囊高度计算文章目录 uni-app 顶部导航栏高度计算 + 胶囊高度计算 uni-app 一.顶部导航栏高度计算二.胶囊高度计算总结 uni-app u ...
uniapp自定义导航栏，手机顶部通知栏字体颜色修改
使用uniapp自定义导航栏时,自己的导航栏字体颜色为白色但是,系统上方的通知栏部分还是黑色,文档中表明设置这个就有用,即使你的配置是"navigationStyle": &qu ...
uni-app自定义导航栏右侧做增加按钮并跳转链接
uni-app自定义导航栏右侧做增加按钮并跳转链接 uni-app 在页面上的导航栏右侧做一个增加的图标并实现跳转 1. 先看效果图 2. 实现思路使用阿里图标库的字体图标, 下载放入本地文件 p ...
使用uniapp编译多端，自定义导航栏高度、状态栏的高度
使用uniapp框架编译多端,在使用自定义导航栏的时候需要适配不同手机,在安卓和ios上手机的状态栏高度是不一样的,尤其是小程序. uni.getSystemInfo(); //在小程序上使用这个方法 ...
uniapp自定义导航栏，高度，自定义组件
设置自定义导航栏 :globalStyle 内 navigationStyle": "custom" 配置页面:pages.json "globalStyle& ...
uniapp 计算自定义导航栏高度
一,自定义导航栏的重点是高度的计算从下图分析出来:导航栏高度 = (胶囊顶部距离 - 状态栏高度) x 2 + 胶囊的高度 data() {return {system:[],menu:[],sta ...
uniapp自定义导航栏遮住了手机状态栏问题
#uniapp在界面自定义导航栏之后,导航栏会自动占在屏幕的状态栏重叠上解决办法首先在pages.josn是页面里面加上"navigationStyle": "cus ...
uni-app自定义导航栏
有时我们需要对导航栏进行自定义,接下来就是对uni-app进行代码的编写对于一些不是很复杂的顶部导航,当然使用原生导航栏实现是最佳选择 uni-app原生导航栏也能实现一些顶部自定义按钮+搜索框,只 ...
uni-app 自定义导航栏
效果图隐藏小程序底部导航栏封装组件在 components 文件夹中新建一个 tabbar.vue 文件 <template><view class="tabbar& ...

uniapp自定义导航栏高度

uniapp自定义导航栏高度相关推荐

最新文章

热门文章