2012-03-02 3 views
0

가로 패널에서 가로 스크롤을 구현하는 방법이 있습니까?GWT 가로 스크롤이있는 가로 패널

또는 다른 패널 아래에 언급 된 기능을 달성 할 수 있습니다 -

요구 사항은 내가 검색 항목으로 추가되고있는 검색 막대를 생성하고 있다는 것입니다 때 사용자 입력을 (이 비슷한 - http://documentcloud.github.com/visualsearch/) 글쎄, 기능이 작동하고 외모도 비슷하지만 수평 패널에서 고생하고있다. 검색 창으로 가로 패널을 사용하고 있으며 제안 상자가 포함되어 있습니다. 따라서 사용자가 데이터를 입력하면 검색 항목이 가로 패널에 추가됩니다. 검색 항목이 추가되면 가로 패널의 크기가 커지고 화면 밖으로 이동하고 브라우저의 가로 스크롤 막대가 나타납니다. 하지만 나는 수평 패널 자체에 스크롤 바를 원했다. 달성 될 수 있습니까? 몇 가지 아이디어가 필요합니다 ... 어떤 도움을 주시면 감사하겠습니다. 감사합니다. .

답변

2

css overflow-x 속성을 사용할 수 있습니다. 스크롤하려면 스크롤 또는 자동으로 값을 설정하십시오. 특정 방식으로 div의 크기를 제한해야하는 경우이를 프로그램 방식으로 제어해야 할 수 있습니다.

+0

나는 GWT 가로 패널이 HTML에서 테이블로 렌더링되기 때문에 불행히도 처음에는 작동하지 않았다. 따라서 나는 DIV 태그로 렌더링 될 다른 래퍼 패널을 사용할 수 있다고 생각했습니다. 따라서 SimplePanel을 사용하여 포장 한 후 CSS를 변경하여 사용하는 방법을 사용했습니다. 그것은 작동한다 !!!!! – ravi

1

HorizontalPanel 안에 스크롤 패널을 배치하는 것 외에 다른 해결책이 없습니다. 그런 다음 세로 스크롤 막대가 표시되지 않도록 CSS 속성을 추가합니다. 당신은 당신의 레이아웃에 따라, 수평 패널 내부의 항목의 높이를 조정하기 위해 귀하의 스크롤 패널의 클라이언트 높이를 확인해야 할 수 있습니다

<ui:style> 
    .scrollHorizontal{ 
     overflow-y: hidden !important; 
     /* !important used to force override the style "overflow:scroll" 
      of the ScrollPanel */ 
    } 
</ui:style> 

<g:ScrollPanel addStyleNames="scrollHorizontal"> 
    <g:HorizontalPanel ui:field="resultsPanel" /> 
</g:ScrollPanel> 

:

은 여기 ui.xml 발췌입니다.

+0

Oups, 죄송합니다. 위의 의견이 보이지 않았습니다. –