gwt suggestbox 不会隐藏在页面滚动中

gwt suggestbox doesn't hide on page scroll

我创建了一个建议框并生成了 HTML 包含大量文本的页面,因此我可以滚动。 1.显示推荐列表 2.翻页

带有建议列表的弹出框随页面滚动而移动,但我希望它既不在页面滚动时隐藏也不随页面移动。

据我了解,建议弹出窗口具有绝对位置。但是有没有一些非 css 解决方案。


回答:

我已经尝试将滚动处理程序添加到 Window,但我发现只有在我有 并且它们的右侧移动时才处理事件,仅在这种情况下。如果我有一个滚动条来滚动页面,就像在大文本的情况下一样 - 没有调用

构建 SuggestBox 时,您可以提供自己的 SuggestOracleTextBoxSuggestionDisplayDefaultSuggestionDisplay 可用于隐藏建议列表。您可以在 Window.scrollHandler.

中完成

代码如下:

MultiWordSuggestOracle oracle = new MultiWordSuggestOracle();
oracle.add("one");
oracle.add("two");
oracle.add("three");

TextBox box = new TextBox();
final DefaultSuggestionDisplay display = new DefaultSuggestionDisplay();

SuggestBox suggestBox = new SuggestBox(oracle, box, display);

Window.addWindowScrollHandler(new ScrollHandler() {
    @Override
    public void onWindowScroll(ScrollEvent event) {
        display.hideSuggestions();
    }
});

请注意,您需要使用 DefaultSuggestionDisplay - 请参阅有关 已弃用 hideSuggestionList 方法的文档。

我希望这个例子能说明一切。

我还检查过,如果您不使用自己的 SuggestionDisplay,它仍然会使用 DefaultSuggestionDisplay。所以你可以做得更简单。

((DefaultSuggestionDisplay) suggestBox.getSuggestionDisplay()).hideSuggestions();

编辑:

如果不是滚动整个 window 而是只滚动某些面板的内容,您可以向面板添加一个 ScrollHandler:

panel.addDomHandler(new ScrollHandler() {
    @Override
    public void onScroll(ScrollEvent event) {
        ((DefaultSuggestionDisplay) suggestBox.getSuggestionDisplay()).hideSuggestions();
    }
}, ScrollEvent.getType());