ucml生成java_ucml选项卡

当业务视图组件VC并排摆放时就会形成选项卡,本章介绍选项卡有关的操作函数和事件。

页面中有三个对象:TabStrip,Panel和Tab,TabStrip含Panel对象和Tab对象。业务单元BPO没有使用自定义业务模板时TabStrip对象ID命名规则为第一个:TabStrip_Level_1,第二个:TabStrip_Level_2以此类推,当使用自定义业务模板时TabStrip对象ID命名规则为:TabStrip_Level_ + 当前模板Panel中的第一个VC的VCName,例如:TabStrip_Level_VC_TSLXQuery

133e6a6e1e30528534495dc026adfe86.png

Panel对象:每个VC对应一个Panel对象,Panel对象包含Tab对象。

5f45098d3801d5d008b50ed201bb0bea.png

Tab对象:VC的头为一个Tab对象。

7f5fe69b045e7e9d3c869009b53425e0.png

函数:

用法:TabStrip_ID.函数名

示例:

在JSCRIPT业务初始化时写如下代码:

//初始时选择索引为1的Tab,即第二个Tab页签

TabStrip_Level_1.selectTab(1);

函数名称

说明

getPanel(index)

获取Panel对象,index为Panel索引

closeTab(index)

关闭Tab页签,index为页签的索引

getHeader(index)

获取选项卡的Tab页签对象,index为Tab索引。

showTab(index)

显示Tab页签,index为页签索引。

hidenTab(index)

隐藏Tab页签,index为页签索引,注意:隐藏页签后需要调用showTab函数来显示当前TabStrip对象中其它的页签。

selectTab(index)

选择Tab页签,index为页签索引。

exists(index)

存在返回Panel对象,不存在返回false,index为Panel索引。

隐藏页签示例:

如下图在页面显示时隐藏第一个TabStrip对象中的第二个Tab“图书类型2”

14db1ddab317c008897bda816db5f805.png

操作步骤:

1、定义fn_Init()函数如下图:

2d87b9a138bf12e7b012d2ab53813b50.png

function fn_Init(){

TabStrip_Level_1.hidenTab(1);  //隐藏VC标题为“图书类型2”的标签

TabStrip_Level_1.showTab(0);  //显示VC标题为“图书类型1”的标签

}

2、在JSCRIPT业务初始化时调用fn_Init()方法:

1957168a87bfed7550d8952c2cccb33e.png

3、生成编译,浏览BPO的页面效果如下:

e91436465df548b7aeef4ea995dcc2ac.png

如果隐藏后不调用显示该TabStrip对象中其它页签的showTab方法,则页面效果如下图,并不是想要的页面效果:

f06f13fee0de38a8e9cd473d2e21ee65.png

事件:

事件名称

说明

tabSelect

Tab页签选择事件,事件响应函数有两个参数:panel:panel对象,paenlIndex:指panel的索引

用法:

在JSCRPT初始化处绑定事件,语法:TabStrip_ID.on(“事件名”,函数)。

示例:

d5bc16b17ca9e6f715bce309fade708d.png

bee3bba113e76450658e69708d1fe1fb.png

function fn_Init(){

TabStrip_Level_1.on("tabSelect",function(panel,index){

alert("你选择的页签索引为:"+index);

});

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值