CODEWITHSUNDEEP
gwt
user3192996
user3192996

Reputation: 11

In GWT how to change listbox dropdown list size alone?

I Have a listbox with fixed size, width = 200px, but the content in the listbox size is more.So I want only the dropdown width to be increased.How can this be done?

Upvotes: 0

Views: 3157

Answers (1)

Onkar
Onkar

Reputation: 662

I think you should set the listbox style to the width you want , and the option dropdowns will automatically adjust to option element size (alternatively you can use the .gwt-ListBox CSS class to define any CSS styling),

ListBox listBox = new ListBox();
listBox.getElement().getStyle().setWidth(200, Unit.PX);
listBox.addItem("AAA");
listBox.addItem("AAAAAA");
listBox.addItem("AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA");
listBox.addItem("AAADDDDDDDDD");

enter image description here enter image description here

If you want to style the drop down elements you can do so via adding a class to your list box and then styling the options,

listBox.addStyleName("myListBox");

Css

.myListBox { 
width:200px; 
} 
.myListBox option { 
width:500px; 
}

UPDATE

There is a way

    listBox.addMouseDownHandler(new MouseDownHandler()
    {
        @Override
        public void onMouseDown(MouseDownEvent event)
        {
            listBox.addStyleName("expand");
        }
    });

    listBox.addBlurHandler(new BlurHandler()
    {
        @Override
        public void onBlur(BlurEvent event)
        {
            listBox.addStyleName("normal");
        }
    });
    listBox.addChangeHandler(new ChangeHandler()
    {
        @Override
        public void onChange(ChangeEvent event)
        {
            listBox.addStyleName("normal");
        }
    });

.normal
{
width=200px;
}

.expand
{
width : auto;
}

In simple words set width to auto when viewing options else set it to default.

Upvotes: 1

Related Questions