先看图:
借用一下网上的图,来详细解释下:
自定义tabbar,代码实现
tabbar采用定位,使用 top值 来决定tabbar显示
onLoad: function () {
var statusH = wx.getSystemInfoSync().statusBarHeight; // 状态栏高度
var safetop = wx.getSystemInfoSync().safeArea.top; // 安全区域距离顶部高度
var safeH = wx.getSystemInfoSync().safeArea.height; // 安全区域高度
var topx = Math.ceil(( screenW / 750) * 120); // tabbar 高度(120rpx转换成以像素为单位)
console.log(screenH,safetop, safebtm, safeH)
this.setData({
statusBarH:statusH, // 状态栏高度
safeAreaH:safeH + safetop - topx, // tabbar定位top高
});
}