2012-10-01 2 views
0

나는 일련의 단추가있는 세로 패널이 있습니다. 기본 버튼을 클릭하면 패널이 펼쳐지고 세로 패널의 일부인 버튼 세트가 표시됩니다. 이 기본 버튼은 hte UI의 맨 아래에 있기 때문에 확장 된 버튼이 아래쪽이 아닌 위쪽으로 흐르는 것처럼 보이도록 CSS를 변경했습니다. 그럼에도 불구하고 페이지가 펼쳐진 상태에서 아래쪽으로 펼쳐지는 것처럼 보입니다. 그러면 페이지에 스크롤이 추가되는데 이는 전혀 바람직하지 않습니다.GWT : 세로 패널 버튼 반전 방법

세로 패널에 버튼을 추가하는 방법이 있습니까? 가능한 한 다른 순서로 버튼을 추가하고 CSS를 다시 사용하지 않는 것이 좋습니다. 팁 주셔서 감사합니다. 버튼 패널은 기존 페이지의 상단에 떠하려는 나의 이해에서로

답변

0

VerticalPanel이 레이아웃에 대한 잘못된 위젯입니다. PopupPanel과 매우 간단한 CSS를 사용해야합니다. 사용자가 버튼을 누르면, .showRelativeTo() 메소드를 호출하여이 PopupPanel을 표시합니다. 그것은 모든 계산을 당신을 위해 할 것이고, 아래로 또는 브라우저 창 크기와 버튼의 위치에 따라 위쪽으로 보여줄 것입니다.

PopupPanel에서 FlowPanel을 추가하고 단추를이 FlowPanel에 추가합니다. 이 스타일을 FlowPanel에 적용하십시오.

.menu { 
    width: 100px; 
} 
.menu input { 
    float: left; 
    margin-top: 10px; 
    width: 100px; 
} 
+0

감사합니다. 팝업 패널이 항상 위로 열리도록하는 방법이 있는지 궁금합니다. –

+0

예. showRelativeTo()를 사용하는 대신 좌표를 직접 설정할 수 있습니다. .setPopupPositionAndShow() 메소드를 사용하십시오. –

0

그것은 just invert the direction에 쉽지 않다. 웹 페이지는 흐름 구조를 따르고 지정하지 않으면 스택되지 않습니다.

전체 레이아웃을 절대 패널로 변경하거나 CSS를 사용해야 할 수도 있습니다 (예 : 원하지 않지만 이전 패널보다 훨씬 쉽습니다). 원하는 위치에 패널을 배치 할 수 있습니다.

CSS :

.button-panel{ 
    clip: rect(auto, auto, auto, auto); 
    position: absolute; 
    left: 100px; 
    top: 319px; 
    overflow: visible; 
} 

자바 :

YourVerticalPanel.addStyleName("button-panel");