radioex替代tabctrl实现不同标签宽度的功能

admin

【渡劫】SOUI-凝望着 2019/8/22 16:37:15

radioex 差不多就是这种效果


看起来比tabctrl效果差不多，不过tabctrl的标签宽度是固定的，这个能实现不同宽度的，符合我的要求
之前想实现tabctrl标签宽度不同，老大说不支持，现在用这个替代，就可以实现不同标签宽度了

admin

1. <SOUI name="mainWindow" title="@string/title" bigIcon="ICON_LOGO:32" smallIcon="ICON_LOGO:16" width="900" height="650" minsize="900,650" margin="5,5,5,5" resizable="1" wndType="appMain" appWnd="1" translucent="1">
   
2.   <root skin="_skin.bg" cache="1">
   
3.     <caption font="adding:0" pos="2,2,-1,99" show="1" colorBkgnd="#0694F3">
   
4.       <imgbtn animate="1" name="btn_close" pos="-32,0" skin="_skin.btn.close" tip="close"/>
   
5.       <imgbtn animate="1" name="btn_max" pos="-64,0" skin="_skin.btn.max"/>
   
6.       <imgbtn animate="1" name="btn_restore" pos="-64,0" show="0" skin="_skin.btn.restore"/>
   
7.       <imgbtn animate="1" name="btn_min" pos="-96,0" skin="_skin.btn.min"/>
   
8.       <imgbtn animate="1" name="btn_set" pos="-128,0" skin="_skin.btn.set"/>
   
9.       <imgbtn animate="1" name="btn_msg" pos="-160,0" skin="_skin.btn.msg"/>
   
10.       <img pos="15,5" skin="skin_caption_banner" />
    
11.       <imgbtn animate="1" name="btn_head" pos="11,31" skin="skin_caption_head"/>
    
12.       <text pos="80,40" class="font:w_normal">UserName</text>
    
13.       <imgbtn animate="1" name="btn_tb_vip" pos="160,40" skin="skin_ttbar_vip"/>
    
14.       <progress name="prog_test" pos="80,68,@140,@15" font="adding:-8" value="40" min="0" max="100" bkgndSkin="skin_caption_prog_bkg" posSkin="skin_caption_prog_frg"/>
    
15.       <text pos="80,68,@140,@15" class="font:w_small_3" align="center">1154.39GB/3183.50GB</text>
    
16.       <group pos="[75,2,@360,@95" colorLine1="#0795F4" colorLine2="#0795F4" headerHeight="0">
    
17.         <radioex pos="0,0" id="10000" name="radioex_1" checked="1" skin="skin_tab_bkg">
    
18.           <img pos="22,17" skin="skin_tab_disk" />
    
19.           <text pos="0,65,-0,-0" class="cls_titlebar_tab">我的网盘</text>
    
20.         </radioex>
    
21.         <radioex pos="[0,0" id="10001" name="radioex_2" skin="skin_tab_bkg">
    
22.           <img pos="22,17" skin="skin_tab_share" />
    
23.           <text pos="0,65,-0,-0" class="cls_titlebar_tab">分享</text></radioex>
    
24.         <radioex pos="[0,0" id="10002" name="radioex_3" skin="skin_tab_bkg">
    
25.           <img pos="22,17" skin="skin_tab_safe" />
    
26.           <text pos="0,65,-0,-0" class="cls_titlebar_tab">隐藏空间</text></radioex>
    
27.         <radioex pos="[0,0" id="10003" name="radioex_4" skin="skin_tab_bkg">
    
28.           <img pos="22,17" skin="skin_tab_box" />
    
29.           <text pos="0,65,-0,-0" class="cls_titlebar_tab">功能宝箱</text></radioex>
    
30.       </group>
    
31.     </caption>
    
32.     <tabctrl name="tab_main" pos="1,[0,-1,-1" animateSteps="10" tabHeight="0" cursel="0">
    
33.       <page title="我的网盘">
    
34.         <include src="LAYOUT:PAGE_DISK"/>
    
35.       </page>
    
36.       <page title="分享">
    
37.         <include src="LAYOUT:PAGE_SHARE"/>
    
38.       </page>
    
39.       <page title="隐藏空间">
    
40.         <include src="LAYOUT:PAGE_SAFE"/>
    
41.       </page>
    
42.       <page title="功能宝箱">
    
43.         <include src="LAYOUT:PAGE_BOX"/>
    
44.       </page>
    
45.     </tabctrl>
    
46.     <iconbtn animate="1" name="btn_task_list_btn" pos="-81,70" skin="skin_task_list_btn" iconSkin="skin_task_list_ico" class="font:w_small_3" icon-x="5" icon-y="7" text-y="7" valign="top">传输列表</iconbtn>
    
47.     <!-- Menu tray -->
    
48.     <shellnotifyicon id="110" menu="SMENU:menu_tray" ico="ICON_LOGO:16" tip="百度网盘"/>
    
49.   </root>
    
50. </SOUI>
    

复制代码

百度网盘demo就是通过radioex+tabctrl的方式，实现比较美观的效果。



【渡劫】SOUI-凝望着 2019/8/22 16:48:21

@小白 到这个demo里面抄

【老杨家的小扬】小钢炮 2019/8/22 16:48:32

height置为0

admin

【渡劫】SOUI-凝望着 2019/8/22 16:53:45

这个就是切换page的响应地方

【渡劫】SOUI-凝望着 2019/8/22 16:54:15

单个响应radio也行
这是 radio的id

caryone

学习学习