app直播原始碼，uniapp之自定義頂部樣式

app直播原始碼，uniapp之自定義頂部樣式

//需要自定義頂部樣式的頁面配置
{
"path" : "pages/case/index",
"style" :                                                                                    
{
    "navigationBarTitleText": "案例",
"navigationStyle": "custom",
    "enablePullDownRefresh": true
}
},
 
//預設頂部樣式
{
"path":"pages/houseVideo/index",
"style" :
{
"navigationBarTitleText": "雲看房",
"enablePullDownRefresh": true
}
},
 
 
 
//兩者的區別就是navigationStyle引數

接下來就是自己在需要自定義頭部樣式的頁面   自己編寫相關css樣式即可

涉及到資料就是幸好欄需要的高度和padding值

// 計算自定義頭部的高度和padding
calcCustomPosi() {
const systemInfo = uni.getSystemInfoSync(); //獲取系統資訊同步介面。
const menuInfo = uni.getMenuButtonBoundingClientRect(); //
let navPadTop = systemInfo.statusBarHeight,
navHeight = 0;
navHeight = menuInfo.height + (menuInfo.top - navPadTop) + (menuInfo.bottom - menuInfo.height - navPadTop);
this.navPadTop = navPadTop + 'px';
this.navHeight = navHeight + 'px';
}

以上就是app直播原始碼，uniapp之自定義頂部樣式， 更多內容歡迎關注之後的文章