ravi
ravi

Reputation: 1827

GWT Horizontal panel with horizontal scrolling

Is there a way to get horizontal scrolling implemented in a horizontal panel ?

or any other panel can be used to achieve the functionality mentioned below -

The requirement is that i am creating a search bar where search items are being added as and when user inputs them (something similar to this - http://documentcloud.github.com/visualsearch/) Well i got the functionality working and even the looks are similar but struggling on the horizontal panel. I am using a horizontal panel as a search bar and it has a suggest box embedded in it. so when user inputs data the search items are added to the horizontal panel. but as and when search items are added the horizontal panel grows in size and moves out of the screen and browser's horizontal scroll bar appears. But i wanted a scroll bar on the horizontal panel itself. Can this be achieved ? want some ideas ... any help is appreciated. Thanks.

Upvotes: 1

Views: 5968

Answers (2)

Olivier H
Olivier H

Reputation: 898

I don't see any other solution than place your HorizontalPanel inside a scroll panel. Then I would add a CSS property to prevent the vertical scrollbar from showing.

Here's an ui.xml excerpt:

<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>

You may need to check the client height of your scroll panel so as to adjust the height of the items inside the horizontal panel, depending on your layout.

Upvotes: 2

Deanna
Deanna

Reputation: 696

You may want to use the css overflow-x attribute. If you want it to scroll set the value to scroll or auto. If you need to constraint the size of the div in specific ways you may need to control it progamatically.

Upvotes: 2

Related Questions