duilib学习------网易云信Grid

前几天在网站上找到了一份某大神在网易云信中实现的grid控件，界面中包含了splitdrag的上下拉动或者左右拉动，时间控件，demo中的效果如下所示：

界面布局代码如下：

<?xml version="1.0" encoding="UTF-8"?>
 <Window size="900,600" caption="0,0,0,35" sizebox="4,4,4,4">
   <VBox bkcolor="bk_wnd_darkcolor">
     <HBox width="stretch" height="35" bkcolor="bk_wnd_lightcolor">
       <Control />
       <Button class="btn_wnd_min" name="minbtn" margin="4,6,0,0"/>
       <Box width="21" margin="4,6,0,0">
         <Button class="btn_wnd_max" name="maxbtn"/>
         <Button class="btn_wnd_restore" name="restorebtn" visible="false"/>
       </Box>
       <Button class="btn_wnd_close" name="closebtn" margin="4,6,8,0"/>
     </HBox>
     <Control class="splitline_hor_level1" splitdrag="dragns"/>
     <HBox height="20" margin="0,10">
       <Button class="btn_global_blue" name="btn_insert_row" width="80" height="20" margin="10,0" align="hcenter" text="插入行4" tabstop="true"/>
       <Button class="btn_global_blue" name="btn_insert_col" width="80" height="20" margin="10,0" align="hcenter" text="插入列4" tabstop="false"/>
       <DateTime name="date_time" width="120" height="20" margin="10,0" align="hcenter" />
     </HBox>
     <HBox name="hbox_pop" popwindow="true">
       <!--<TreeView class="list" name="tree" width="240" margin="10,30,5,30" bkcolor="splitline_level1" indent="20"/>
       <VListBox class="list" name="list" width="140" margin="10,30,5,30" bkcolor="splitline_level1"/>-->
       <Grid name="grid" margin="10,10,10,30" vscrollbar ="true" hscrollbar ="true" />
       <Control class="splitline_ver_level1" splitdrag="dragwe"/>
       <VBox width="80" margin="10,30,10,30">
         <Label height="18" margin="0,10" text="row:"/>
         <RichEdit class="simple prompt" name="re_row" height="20" margin="0,10" number="true" prompttext="row"/>
         <Label height="18" margin="0,10" text="col:"/>
         <RichEdit class="simple prompt" name="re_col" height="20" margin="0,10" number="true" prompttext="col"/>
         <Label height="18" margin="0,10" text="fixed_row:"/>
         <RichEdit class="simple prompt" name="re_fixed_row" height="20" margin="0,10" number="true" prompttext="fixed row"/>
         <Label height="18" margin="0,10" text="fixed_col:"/>
         <RichEdit class="simple prompt" name="re_fixed_col" height="20" margin="0,10" number="true" prompttext="fixed col"/>
         <Button class="btn_global_blue" name="btn_add_row" width="80" height="20" margin="0,10" align="hcenter" text="添加行"/>
         <Button class="btn_global_blue" name="btn_remove_row" width="80" height="20" margin="0,10" align="hcenter" text="删除行2"/>
         <Button class="btn_global_blue" name="btn_add_col" width="80" height="20" margin="0,10" align="hcenter" text="添加列"/>
         <Button class="btn_global_blue" name="btn_remove_col" width="80" height="20" margin="0,10" align="hcenter" text="删除列2"/>
         <Button class="btn_global_blue" name="btn_import_excel" width="80" height="20" margin="0,10" align="hcenter" text="导入excel"/>
         <Button class="btn_global_blue" name="btn_pop_window" width="80" height="20" margin="0,10" align="hcenter" text="新窗口"/>
       </VBox>
     </HBox>
   </VBox>
 </Window>