2010-01-11 4 views
2

수평 분할 자 패널의 오른쪽면을 스타일 지정해야합니다. 내가 아는 바로는, GWT 1.7은 개별 패널 (왼쪽 및 오른쪽) 스타일을 지원하지만 여기서는 GWT 1.5를 사용하고 있습니다.GWT 1.5에서 가로 분할 자 패널을 스타일 지정하는 방법

GWT 코드 :

HTML div1 = new HTML("Div 1"); 
div1.setWidth("200px"); 
div1.setHeight("200px"); 
HTML div2 = new HTML("Div 2"); 
div2.setWidth("400px"); 
div2.setHeight("500px"); 

HorizontalSplitPanel horizontalSPanel = new HorizontalSplitPanel(); 
horizontalSPanel.setLeftWidget(div1); 
horizontalSPanel.setRightWidget(div2); 

RootPanel.get().add(horizontalSPanel); 

해당 출력 :

<div class="gwt-HorizontalSplitPanel" style="position: relative; height: 100%;"> 
    <div style="border: medium none ; margin: 0pt; padding: 0pt; position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px;"> 
     <div style="border: medium none ; margin: 0pt; padding: 0pt; overflow: auto; position: absolute; top: 0px; bottom: 0px; width: 511px;"> 
      <div class="gwt-HTML" style="width: 200px; height: 200px;">Div 1</div> 
     </div> 
     <div style="position: absolute; top: 0px; bottom: 0px; left: 511px;"> 
      <table height="100%" cellspacing="0" cellpadding="0" class="hsplitter"> 
      <tbody> 
       <tr><td valign="middle" align="center"> 
        <img border="0" style="background: transparent url(http://localhost:8888/com.xyzpackage.MyEntryPoint/4BF90CCB5E6B04D22EF1776E8EBF09F8.cache.png) no-repeat scroll 0px 0px; width: 7px; height: 7px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;" src="http://localhost:8888/com.xyzpackage.MyEntryPoint/clear.cache.gif"/> 
       </td></tr> 
      </tbody> 
      </table> 
     </div> 
     <div style="border: medium none ; margin: 0pt; padding: 0pt; overflow: auto; position: absolute; top: 0px; bottom: 0px; right: 0px; left: 518px;"> 
      <div class="gwt-HTML" style="width: 400px; height: 500px;">Div 2</div> 
     </div> 
    </div> 
</div> 

내가 단지 RHS의 DIV에 스타일을 적용 할 수있는 방법이 있습니까?

기본적으로 내 응용 프로그램이 RHS보기에서 세로 스크롤 막대를 가질 수없는 요구 사항이 있습니다.

+1

GWT 2.0이 출력됩니다. 나는 업데이 트하는 것이 좋습니다. – cletus

+0

:) 내 전화가 아니에요, 우리의 응용 프로그램은 거대합니다. –

+0

실제로 내 요구 사항은 Wierd입니다. RHS에 "항상 위에"있어야하는 요소가 있습니다. 즉, 나머지 요소는 스크롤 가능해야합니다. 그러나 우리의 요구 사항은 이중 스크롤 막대도 허용하지 않습니다. –

답변

0

는 DOM에 의지했다 :

   Node node = horizontalSPanel.getElement().getFirstChildElement().getChildNodes().getItem(2); 
       // set the overflow y to hidden, this is in point of view of GWT current version 
       // does not allow user to set style to right or left containers. 
       DOM.setStyleAttribute((Element) node, "overflowY", "hidden"); 

이 매우 불구하고

더 나은 솔루션을 가진 하나를 하드 코딩 사용 ??

3

Div 2를 다른 Div에 랩핑하고이 하나에 overflowY : hidden 속성을 부여 할 수 있으므로 DOM 트리를 거칠 필요가 없습니다.

반대의 이유로 ScrollPanel에서 동일한 접근 방식을 사용합니다.

+0

문제는 스크롤바입니다.이 "스크롤 막대 내부 또는 외부 상자"를 참조하십시오. 이 페이지에서 http://css-tricks.com/the-css-overflow-property/ 하나의 브라우저가 그것을 계산하고, 따라서 100 % 너비와 높이를 설정하면 동작이 달라지며 Firefox에서 두 번 스크롤 막대를 표시합니다. –

+0

여전히 아이디어에 +1 –

관련 문제