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插件
猜你喜欢
咨询 . 试用
咨询 . 试用