Question

我尝试使用GWT创建一个SuggestBox，到目前为止一切正常。但我想让SuggestBox的Popup与Input Field具有相同的大小，但我还没有找到一种方法。

如果你能给我一个提示，我会很高兴。

问候凯文

Answer 1

创建一个扩展DefaultSuggestonDisplay并覆盖showSuggestions方法

的自定义类

import java.util.Collection;

import com.google.gwt.dom.client.Style.Unit;
import com.google.gwt.user.client.ui.SuggestBox;
import com.google.gwt.user.client.ui.SuggestBox.DefaultSuggestionDisplay;
import com.google.gwt.user.client.ui.SuggestBox.SuggestionCallback;
import com.google.gwt.user.client.ui.SuggestOracle.Suggestion;

public class CustomSuggestionDisplay extends DefaultSuggestionDisplay
{
    @Override
    protected void showSuggestions( SuggestBox suggestBox, Collection< ? extends Suggestion> suggestions, boolean isDisplayStringHTML, boolean isAutoSelectEnabled, SuggestionCallback callback )
    {
        super.showSuggestions( suggestBox, suggestions, isDisplayStringHTML, isAutoSelectEnabled, callback );
        getPopupPanel().setWidth( ( suggestBox.getElement().getAbsoluteRight() - suggestBox.getAbsoluteLeft() ) + Unit.PX.getType() );
    }
}

使用以下建议框consturctor

SuggestBox suggestBox = new SuggestBox( new MultiWordSuggestOracle(), new TextBox(), new CustomSuggestionDisplay() );

Answer 2

如果您的SuggestBox具有固定宽度，例如200px，则可以应用以下样式

.gwt-SuggestBoxPopup .item{ width:  198px;}

GWT SuggestBox Popup与输入字段大小相同

2 个答案: