Vaadin Web应用开发教程(33):UI布局-HorizontalSplitPanel和VerticalSplitPanel布局
2012-08-27 06:38
471 查看
HorizontalSplitPanel和VerticalSplitPanel为水平和垂直分割窗口,可以将空间分成上下或左右两部分。用户可以通过中间的分隔条调整两部分的大小。
可以通过setFirstComponent()和setFirstComponent()为分隔的两部分设置不同的UI组件, addComponent()也可以依次添加两个UI组件。
此外可以通过方法setSplitPosition 设置分隔条的位置,如果不想用户调整分隔条的位置,可以通过setLocked(true) 禁止用户移动分隔条。
可以通过setFirstComponent()和setFirstComponent()为分隔的两部分设置不同的UI组件, addComponent()也可以依次添加两个UI组件。
// Have a panel to put stuff in Panel panel = new Panel("Split Panels Inside This Panel"); panel.setSizeFull(); // Have a horizontal split panel as its root layout HorizontalSplitPanel hsplit = new HorizontalSplitPanel(); panel.setContent(hsplit); // Put a component in the left panel hsplit.setFirstComponent(new Label("left panel")); // Put a vertical split panel in the right panel VerticalSplitPanel vsplit = new VerticalSplitPanel(); hsplit.setSecondComponent(vsplit); // Put other components in the right panel vsplit.addComponent(new Label("Here's the upper panel")); vsplit.addComponent(new Label("Here's the lower panel")); mainWindow.setContent(panel);
此外可以通过方法setSplitPosition 设置分隔条的位置,如果不想用户调整分隔条的位置,可以通过setLocked(true) 禁止用户移动分隔条。
相关文章推荐
- Vaadin Web应用开发教程(32):UI布局-Panel
- Vaadin Web应用开发教程(29):UI布局-VerticalLayout和HorizontalLayout布局
- Vaadin Web应用开发教程(35):UI布局-Accordion布局
- Vaadin Web应用开发教程(36):UI布局-AbsoluteLayout 布局
- Vaadin Web应用开发教程(31):UI布局-FormLayout布局
- Vaadin Web应用开发教程(30):UI布局-GridLayout布局
- Vaadin Web应用开发教程(34):UI布局-TabSheet布局
- Vaadin Web应用开发教程(40):使用主题-创建和应用新主题
- Vaadin Web应用开发教程(18):UI组件-Table 组件
- Vaadin Web应用开发教程(14):UI组件-DateField
- Vaadin Web应用开发教程(37):可视化界面编辑插件
- Vaadin Web应用开发教程(48): SQLContainer-编辑
- Vaadin Web应用开发教程(39):使用主题-CSS简介
- Vaadin Web应用开发教程(19):UI组件-Tree 组件
- Vaadin Web应用开发教程(23):UI组件-Form组件
- Vaadin Web应用开发教程(20):UI组件-MenuBar组件
- Vaadin Web应用开发教程(45): SQLContainer 概述
- Vaadin Web应用开发教程(44): 使用Container接口管理一组Item
- Vaadin Web应用开发教程(46): 开始使用SQLContainer
- Vaadin Web应用开发教程(11):UI组件-TextArea