Vaadin Web应用开发教程(33):UI布局-HorizontalSplitPanel和VerticalSplitPanel布局

jerry VaadinWeb 2015年11月25日 收藏

HorizontalSplitPanel和VerticalSplitPanel为水平和垂直分割窗口,可以将空间分成上下或左右两部分。用户可以通过中间的分隔条调整两部分的大小。
可以通过setFirstComponent()和setFirstComponent()为分隔的两部分设置不同的UI组件, addComponent()也可以依次添加两个UI组件。

  1. // Have a panel to put stuff in
  2. Panel panel = new Panel("Split Panels Inside This Panel");
  3. panel.setSizeFull();
  4. // Have a horizontal split panel as its root layout
  5. HorizontalSplitPanel hsplit = new HorizontalSplitPanel();
  6. panel.setContent(hsplit);
  7. // Put a component in the left panel
  8. hsplit.setFirstComponent(new Label("left panel"));
  9. // Put a vertical split panel in the right panel
  10. VerticalSplitPanel vsplit = new VerticalSplitPanel();
  11. hsplit.setSecondComponent(vsplit);
  12. // Put other components in the right panel
  13. vsplit.addComponent(new Label("Here's the upper panel"));
  14. vsplit.addComponent(new Label("Here's the lower panel"));
  15. mainWindow.setContent(panel);

此外可以通过方法setSplitPosition 设置分隔条的位置,如果不想用户调整分隔条的位置,可以通过setLocked(true) 禁止用户移动分隔条。