Vaadin - Multiple TabSheet Layout

Question

하나의 Vaadin 탭 중 하나는 테이블과 버튼을 표시하고 다른 하나는 Hierarchical Vaadin 트리를 표시하며 사용자 정의 검색 상자가 있습니다. 내 탭의 크기를 H : 420px W : 250px로 설정 했으므로 테이블이 너무 커지거나 트리가 길면 스크롤바가 생깁니다 (그게 내가 원하는 것입니다). 다른 구성 요소는 검색 상자와 버튼이 레이아웃의 맨 아래로 내려 가게되므로 버튼/검색 상자에 액세스하려면 모든 항목을 아래로 스크롤해야하므로 원하는 구성 요소를 사용할 수 있습니다. 난 단지 구성 요소에 대한 두 번째 레이아웃을 추가하려고했지만 그것은 도움이되지 않았다 : -/여기에 내가 지금까지 시도 내용은 다음과 같습니다

TabSheet tabs = new TabSheet(); 
tabs.setWidth("250"); 
tabs.setHeight("420"); 

VerticalLayout lyTab = new VerticalLayout(); 
tabOne = tabs.addTab(lyTab, "Tab One", null); 
//added an extra layout for the Buttons : 
HorizontalLayout lyButton = new HorizontalLayout(); 
lyButton.addComponent(applyButton); 
lyButton.addComponent(selectAll); 
lyTab.addComponent(lyButton); 

내 아이디어는 tabSheet 그래서 내가 할 수있는에 두 번째 레이아웃을 추가했다 그것의 위치를 ​​고칠 수 없기 때문에 움직이지 만 그것은 작동하지 않았다. 어떤 아이디어? 내가 제대로 사용자의 문제를 이해한다면

Answer 1

이 테이블 방법으로 할 수 있습니다 :

VerticalLayout tab = new VerticalLayout(); 
tab.setSizeFull(); 

Table table = new Table(); 
table.setSizeFull(); 
tab.addComponent(table); 
tab.setExpandRatio(table, 1); 

HorizontalLayout buttons = new HorizontalLayout(); 
buttons.addComponent(new Button()); 
buttons.addComponent(new Button()); 
tab.addComponent(buttons); 

Tab tabOne = tabs.addTab(tab, "Tab One", null); 

를이 경우, 테이블 크기 가득 필요할 때 스크롤바를 보여줍니다. 트리를 들어

으로 위의 코드에서 테이블 부품을 교체 :

Panel panel = new Panel(); 
panel.setSizeFull(); 
panel.getContent().setSizeUndefined(); 
tab.addComponent(panel); 
tab.setExpandRatio(panel, 1); 

Tree tree = new Tree(); 
tree.setSizeUndefined(); 
panel.addComponent(tree); 

여기 트리 그래서 우리는 필요할 때 스크롤바를 보여 전체 크기의 패널 ​​내부에 그것을 포장 스크롤 막대를 표시 할 수 없습니다.

Answer 2

나는 Vaadin 7.4.8에서 비슷한 문제를 겪고 있었지만 제대로 작동 할 수있었습니다.

1 - 내가 만든 첫 번째 사실은 부모 구성 요소 (제 경우에는 두 개의 VerticalLayout을 하나씩 추가 했음)에 setSizeFull()이 있다는 것입니다. 뷰에 추가됩니다. 필자의 경우, 네비게이터가 호출 한 VerticalLayout 및 Implements View를 확장하는 클래스에서이를 설정하는 것을 잊었다.

2 - 다른 중요한 세부 정보는 addTab (구성 요소)에 탭이 추가 된 tabSheet에도 setSizeFull()이 설정되어 있어야하며, 탭에서 사용하지 않는 공간, 특히 하단을 차지합니다.

2.1 - setExpandRatio (tabSheet, 1)가 추가되어 위쪽으로 이동합니다.

3 - 이제 addTab (구성 요소)를 사용하여 tabSheet에 추가되는 구성 요소 (VerticalLayout)에 두 개의 구성 요소가 추가되었습니다. 하나는 HorizontalLayout이고 두 번째 구성 요소는 VerticalLayout입니다. 이 setSizeFull

setExpandRatio (HorizontalLayout을 .5f)했다

• ;
  은 그래서 있는지 확인했다
• setExpandRatio (VerticalLayout, .5f);