Dorado 5 : 2.别致的抽屉式布局 (T1)

抽屉式布局其实是OutlookBar菜单的样式，只是其中放置的并非菜单项而是控件，它在JSP页面中添加了OutlookBarGroup标签而被用作布局的一种。

抽屉式布局
在sample项目的src下新建ViewModel命名outlookGroup。新建OutlookBar控件。步骤：【Controls】—>【Insert】—>【Others】—>【OutlookBar】。

图16-14
然后再新建4个Button按钮控件。

图16-15
保存之后新建outlookGroup相关的JSP页面outlook_group.jsp，通过【Dorado X-Insert】在JSP页面中添加OutlookGroup标签，调整页面标签代码。

<d:View config="outlookGroup"> 
 <d:OutlookBar id="outlookbar1"> 
 <d:OutlookBarGroup name="group1" label="第一个组"> 
 <d:Button id="button1" /> 
 </d:OutlookBarGroup> 
 <d:OutlookBarGroup name="group2" label="第二个组" padding="12"> 
 <d:Button id="button2" /> 
 </d:OutlookBarGroup> 
 <d:OutlookBarGroup name="group3" label="第三个组" padding="12"> 
 <d:Button id="button3" /> 
 </d:OutlookBarGroup> 
 <d:OutlookBarGroup name="group4" label="第四个组"> 
 <d:Button id="button4" /> 
 </d:OutlookBarGroup> 
 </d:OutlookBar> 
</d:View>

图16-16
全部保存之后，打开outlook_group.jsp页面查看抽屉式布局效果。

图16-17

Dorado 5 : 2.别致的抽屉式布局 (T1)

Attachments: