Duilib自带的例子360SafeDemo中有TabLayout的使用方法,本文参照360SafeDemo范例,梳理TabLayout的基本使用方法,方便理解掌握。
1、定义一组Option作为标签页的标签
<Option name="Option01" float="false" text="Tab01" width="60" height="30" textcolor="#FF1c1c1c" disabledtextcolor="#FFA7A6AA" align="center" leftbordersize="1" bordercolor="#ff000000" selectedtextcolor="#ff96cdcd" group="switch" selected="true" /> <Option name="Option02" float="false" text="Tab02" width="60" height="30" textcolor="#FF1c1c1c" disabledtextcolor="#FFA7A6AA" align="center" leftbordersize="1" bordercolor="#ff000000" selectedtextcolor="#ff96cdcd" group="switch" />
需要注意的是,上述Option都在同一个组
2、定义TabLayout作为标签页
<TabLayout name="TabLayoutMain" selectedid="-1" topbordersize="1" bordercolor="#ff000000" padding="2,2,2,2" > <HorizontalLayout> <Label text="This is tab01." /> </HorizontalLayout> <HorizontalLayout> <Label text="This is tab02." /> </HorizontalLayout> </TabLayout>
3、在代码中处理DUI_MSGTYPE_SELECTCHANGED(selectchanged)消息
如果要使用DUI_ON_MSGTYPE宏处理DUI_MSGTYPE_SELECTCHANGED消息,需要在主窗口类的头文件中添加DUI_DECLARE_MESSAGE_MAP,然后在CPP文件中添加
DUI_BEGIN_MESSAGE_MAP(CTestTabLayoutWnd,WindowImplBase) DUI_ON_MSGTYPE(DUI_MSGTYPE_SELECTCHANGED, OnOptSelChanged) DUI_END_MESSAGE_MAP()
4、在OnOptSelChanged函数中编写功能代码
DUI_MSGTYPE_SELECTCHANGED消息是由某个具体的标签(Option)发出的,当某个Option被点击后,DUI_MSGTYPE_SELECTCHANGED消息的发送者就是被点击的Option。
给出完整的xml内容以及代码(见附件)
<?xml version="1.0" encoding="utf-8" standalone="yes" ?> <Window size="800,600" sizebox="4,4,4,4" caption="0,0,0,32" mininfo="600,400"> <VerticalLayout name="VerticalLayoutUI1" bkcolor="#ff696969" > <HorizontalLayout height="32" bkcolor="#ffe6e6dc" bkcolor2="#ffaaaaa0"> <Label name="Title" padding="2" text="test" /> <VerticalLayout /> <Button name="minbtn" width="50" text="min" /> <Button name="maxbtn" width="50" text="max" /> <Button name="closebtn" width="50" text="close" /> </HorizontalLayout> <HorizontalLayout name="HorizontalLayoutUI1" width="600" height="30" padding="2,2,2,2" > <Option name="Option01" float="false" text="Tab01" width="60" height="30" textcolor="#FF1c1c1c" disabledtextcolor="#FFA7A6AA" align="center" leftbordersize="1" bordercolor="#ff000000" selectedtextcolor="#ff96cdcd" group="switch" selected="true" /> <Option name="Option02" float="false" text="Tab02" width="60" height="30" textcolor="#FF1c1c1c" disabledtextcolor="#FFA7A6AA" align="center" leftbordersize="1" bordercolor="#ff000000" selectedtextcolor="#ff96cdcd" group="switch" /> </HorizontalLayout> <TabLayout name="TabLayoutMain" selectedid="-1" topbordersize="1" bordercolor="#ff000000" padding="2,2,2,2" > <HorizontalLayout> <Label text="This is tab01." /> </HorizontalLayout> <HorizontalLayout> <Label text="This is tab02." /> </HorizontalLayout> </TabLayout> </VerticalLayout> </Window>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。