
JS-原生組件
導航欄、菜單欄、導航欄可以用預加載完成效果。
原生控制可以用URL進行控制,效果優于JS控制。JS是加載網頁完成后生效。
BSL.AppTop('flag','isLong')
控制原生導航欄顯示/隱藏
| 參數 | 必填 | 說明 |
|---|---|---|
| flag | 是 | 固定值 |
| isLong | 是 | 固定值 |
flag 值
| 編碼 | 說明 |
|---|---|
| 1 | 顯示導航欄 |
| 0 | 隱藏導航欄 |
isLong 值
| 編碼 | 說明 |
|---|---|
| 1 | 全局有效 |
| 0 | 當前頁面有效 |
<script>
function appFinishiLoad(){
BSL.AppTop('0','0') //當前頁隱藏導航欄
BSL.AppTop('0','1') //App內隱藏導航欄
}
</script>BSL.AppTopL('state','buttonImage','long')
控制原生導航欄左側按鍵功能
| 參數 | 必填 | 說明 |
|---|---|---|
| state | 是 | 固定值 |
| buttonImage | 否 | 指定圖標,圖標大小60*60。不填寫或加載失敗時顯示默認功能圖標。圖片網址要填寫完整地址。如:http://www.xxx.com/1.png |
| long | 是 | 0:應用當前頁面,1:應用所有頁面 |
state 值
| 編碼 | 說明 |
|---|---|
| 0 | 分享 |
| 1 | 掃一掃 |
| 2 | 關于 |
| 3 | 清除緩存 |
| 4 | 打開鏈接 |
| 5 | 前進 |
| 6 | 后退 |
| 7 | 刷新 |
| 8 | 關閉 |
| 9 | 打開左側欄 |
| -1 | 隱藏按鈕 |
<script>
function appFinishiLoad(){
BSL.AppTopL('0','','0') //原生導航欄左側設置為分享,使用默認圖標。
}
</script>BSL.AppTopR('state','buttonImage','long')
控制原生導航欄右側按鍵功能
| 參數 | 必填 | 說明 |
|---|---|---|
| state | 是 | 固定值 |
| buttonImage | 否 | 指定圖標,圖標大小60*60。不填寫或加載失敗時顯示默認功能圖標。圖片網址要填寫完整地址。如:http://www.xxx.com/1.png |
| long | 是 | 0:應用當前頁面,1:應用所有頁面 |
state 值
| 編碼 | 說明 |
|---|---|
| 0 | 分享 |
| 1 | 掃一掃 |
| 2 | 關于 |
| 3 | 清除緩存 |
| 4 | 打開鏈接 |
| 5 | 前進 |
| 6 | 后退 |
| 7 | 刷新 |
| 8 | 關閉 |
| 9 | 打開左側欄 |
| -1 | 隱藏按鈕 |
<script>
function appFinishiLoad(){
BSL.AppTopR('0','','0') //原生導航欄左側設置為分享,使用默認圖標。
}
</script>BSL.navbarColor('color','isLong')
控制原生導航欄背景顏色
| 參數 | 必填 | 說明 |
|---|---|---|
| color | 是 | 16進制的顏色值,如 #FFC0CB |
| isLong | 否 | 固定值 |
isLong 值
| 編碼 | 說明 |
|---|---|
| 1 | 全局有效 |
| 0 | 當前頁面有效 |
<script>
function appFinishiLoad(){
BSL.navbarColor('#FFC0CB','0') //臨時改變原生導航欄背景色
}
</script>BSL.SetNavBarAlpha('alpha','isLong')
控制原生導航欄透明度。
| 參數 | 必填 | 說明 |
|---|---|---|
| alpha | 是 | 固定值:0.01~0.99。0.01:為全透明菜單欄,0.99:不透明菜單欄。 |
| isLong | 否 | 固定值 |
isLong 值
| 編碼 | 說明 |
|---|---|
| 1 | 全局有效 |
| 0 | 當前頁面有效 |
<script>
function appFinishiLoad(){
BSL.SetNavBarAlpha('0.01','0') //臨時改變原生導航欄為全透明。
}
</script>BSL.SetTitleName(‘title’,‘color’)
控制原生導航欄顯示文字與文字顏色
| 參數 | 必填 | 說明 |
|---|---|---|
| title | 否 | 要顯示的文字。 |
| color | 是 | 16進制的顏色值,如 #FFC0CB |
<script>
function appFinishiLoad(){
BSL.SetTitleName('封裝App','#ffffff') //當頁網頁原生導航欄標題文字。
}
</script>BSL.SlideHideNav(‘flag’)
控制原生導航欄在網頁滑動時隱藏效果。
| 參數 | 必填 | 說明 |
|---|---|---|
| flag | 否 | 固定值 |
flag 值
| 編碼 | 說明 |
|---|---|
| 1 | 開啟 |
| 0 | 關閉 |
<script>
function appFinishiLoad(){
BSL.SlideHideNav('0') //關閉網頁滑動時原生導航欄隱藏。
}
</script>BSL.AppBottom('flag','isLong')
控制原生菜單欄顯示/隱藏
| 參數 | 必填 | 說明 |
|---|---|---|
| flag | 是 | 固定值 |
| isLong | 是 | 固定值 |
flag 值
| 編碼 | 說明 |
|---|---|
| 1 | 顯示菜單欄 |
| 0 | 隱藏菜單欄 |
isLong 值
| 編碼 | 說明 |
|---|---|
| 1 | 全局有效 |
| 0 | 當前頁面有效 |
<script>
function appFinishiLoad(){
BSL.AppBottom('0','0') //當前頁隱藏菜單欄
BSL.AppBottom('0','1') //App內隱藏菜單欄
}
</script>BSL.tabbarColor('color','isLong')
控制原生菜單欄背景顏色
| 參數 | 必填 | 說明 |
|---|---|---|
| color | 是 | 16進制的顏色值,如 #FFC0CB |
| isLong | 否 | 固定值 |
isLong 值
| 編碼 | 說明 |
|---|---|
| 1 | 全局有效 |
| 0 | 當前頁面有效 |
<script>
function appFinishiLoad(){
BSL.tabbarColor('#FFC0CB','0') //臨時改變菜單欄背景色
}
</script>BSL.SetTabbarAlpha('alpha','isLong')
控制原生菜單欄透明度
| 參數 | 必填 | 說明 |
|---|---|---|
| alpha | 是 | 固定值:0.01~0.99。0.01:為全透明菜單欄,0.99:不透明菜單欄。 |
| isLong | 否 | 固定值 |
isLong 值
| 編碼 | 說明 |
|---|---|
| 1 | 全局有效 |
| 0 | 當前頁面有效 |
<script>
function appFinishiLoad(){
BSL.SetTabbarAlpha('0.01','0') //臨時改變菜單欄為全透明。
}
</script>BSL.SlideHideTab(‘flag’)
控制原生菜單欄滑動頁面時隱藏效果。
| 參數 | 必填 | 說明 |
|---|---|---|
| flag | 否 | 固定值 |
flag 值
| 編碼 | 說明 |
|---|---|
| 1 | 開啟 |
| 0 | 關閉 |
<script>
function appFinishiLoad(){
BSL.SlideHideTab('0') //關閉網頁滑動時菜單欄隱藏。
}
</script>BSL.ChangeTabbar('json')
頁面內JS控制菜單欄的某一按鍵功能,
注:不能增減菜單按鍵只能更換按鍵功能。
| 參數 | 必填 | 說明 |
|---|---|---|
| json | 是 | 菜單按鍵功能JSON數據 |
json 值
| 參數 | 必填 | 說明 |
|---|---|---|
| itemId | 是 | 要修改按鈕的位置。從左到右按鍵分別對應是0,1,2,3,4。 |
| clickEvent | 是 | 點擊菜單按鍵時頁面加載方式,0:無變化,1:刷新,2:回首頁 |
| selectId | 是 | 要跳轉的頁面,跳轉到指定的一個菜單頁面。按鍵的id,從左到右,從0開始,即第一個為0。 |
| style | 是 | 按鍵樣式,1: 圖文 ,2:圖 , 3:文字 |
| function | 否 | 按鍵功能,不寫則功能不變,0分享,1二維碼,2關于,3清除緩存,4打開鏈接,5前進,6后退,7刷新,8關閉,9打開左側欄 |
| name | 是 | 標題文字 |
| url | 否 | 要改變的網址(和function項只有一個生效,url優先級高于function項) |
| title | 是 | 按鍵的名稱 |
| fontSize | 否 | 按鍵的名稱的字體大小 |
| imageDefault | 否 | 默認圖片,填寫完整地址。如:http://www.xxx.com/1.png注:與imageSelect成對傳值??刹粋?,不傳時imageSelect也不傳。 |
| imageSelect | 否 | 選中圖片,填寫完整地址。如:http://www.xxx.com/1.png注:與imageDefault成對傳值。可不傳,不傳時imageDefault也不傳。 |
| colorDefault | 否 | 默認文字顏色,16進制的顏色值。如 #FFC0CB 注:與colorSelect成對傳值??刹粋?,不傳時colorSelect也不傳。 |
| colorSelect | 否 | 選中文字顏色,16進制的顏色值。如 #FFC0CB 注:與colorDefault成對傳值??刹粋?,不傳時colorDefault也不傳。 |
json值:
{\\"itemId\\":0,\\"clickEvent\\":\\"0\\",\\"selectId\\":1,\\"style\\":\\"1\\",\\"function\\":\\"\\",\\"name\\":\\"百度\\",\\"url\\":\\"https://m.baidu.com/\\",\\"title\\":\\"首頁\\",\\"fontSize\\":12,\\"imageDefault\\":\\"back\\",\\"imageSelect\\":\\"back\\",\\"colorDefault\\":\\"#00ff00\\",\\"colorSelect\\":\\"#0000ff\\"}<script>
function appFinishiLoad(){
BSL.ChangeTabbar(‘{\"itemId\":0,\"clickEvent\":\"0\",\"selectId\":1,\"style\":\"1\",\"function\":\"\",\"name\":\"百度\",\"url\":\"https://m.baidu.com/\",\"title\":\"首頁\",\"fontSize\":12,\"imageDefault\":\"back\",\"imageSelect\":\"back\",\"colorDefault\":\"#00ff00\",\"colorSelect\":\"#0000ff\"}’) //定義按鍵1
}
</script>BSL.AppLeft('state')
打開原生側邊欄
| 參數 | 必填 | 說明 |
|---|---|---|
| state | 是 | 固定值:1,打開側邊欄。 |
<script>
function appFinishiLoad(){
BSL.AppLeft('1')
}
</script>BSL.downRefresh('open','isLong')
| 參數 | 必填 | 說明 |
|---|---|---|
| open | 是 | 固定值 |
| isLong | 是 | 固定值 |
open值
| 編碼 | 說明 |
|---|---|
| 1 | 開啟 |
| 0 | 關閉 |
isLong 值
| 編碼 | 說明 |
|---|---|
| 1 | 全局有效 |
| 0 | 當前頁面有效 |
<script>
function appFinishiLoad(){
BSL.downRefresh('1','0'); // 開啟當前頁面下拉刷新。
}
</script>BSL.hideStateBar('state','flag')
控制狀態欄(電池欄)顯示/隱藏。
| 參數 | 必填 | 說明 |
|---|---|---|
| state | 是 | 固定值 |
| flag | 是 | 固定值 |
state值
| 編碼 | 說明 |
|---|---|
| 1 | 顯示 |
| 0 | 隱藏 |
flag值
| 編碼 | 說明 |
|---|---|
| 1 | 應用所有頁面 |
| 0 | 應用當前頁面 |
<script>
function appFinishiLoad(){
BSL.hideStateBar('1','0') //顯示狀態欄
}
</script>BSL.StatusBarTextColor('state')
改變狀態欄字體顏色
| 參數 | 必填 | 說明 |
|---|---|---|
| state | 是 | 固定值 |
state值
| 編碼 | 說明 |
|---|---|
| 1 | 黑色 |
| 0 | 白色 |
<a href="#" onclick="BSL.StatusBarTextColor('1')">狀態欄黑色字</a>
<a href="#" onclick="BSL.StatusBarTextColor('0')">狀態欄白色字</a>2020-03-04 16:46:43
熱門App插件
猜你喜歡
咨詢 . 試用
咨詢 . 試用