将 StyleName 设置为 gwt dockLayoutPanel 子项

Question

我已经开始为我使用 Lucene 创建的索引构建一个小型搜索引擎。我使用 GWT 创建我喜欢的 GUI，但遇到了问题。我正在尝试在 DockLayoutPanel 中心的 FlowPanel 中添加一些结果，这样我就可以根据需要滚动页面。我的问题是（正如我发现的那样）为了滚动工作（并且不让浏览器 window 削减我的结果）是让每个 DockLayoutPanel 子项都没有 position:absolute。我的问题是我无法删除它（或者我不知道如何删除）。当我从 chrome 中禁用它时，检查器滚动有效，但当我重新启用它时，它会切断 flowPanel。这是 java 代码：

public static void loadCellTrees(HashMap<Integer,LinkedHashMap<String,String>> searchResults, List<RootCategories> list)
{           
        VerticalPanel westTrees = new VerticalPanel();
        TreeViewModel treeModel = new CellTreeWidget(list);
        CellTree tree = new CellTree(treeModel, null);
        HTMLBuilder builder = new HTMLBuilder(searchResults);

        tree.setStyleName("tree");
        tree.setAnimationEnabled(true);

        dock.clear();
        westTrees.clear();
        westTrees.getElement().setAttribute("align", "center");
        westTrees.add(tree);

        FlowPanel resultsPanel = new FlowPanel();
        resultsPanel.setStyleName("resultsPanel");

        for(int i=0; i<searchResults.size(); i++)
        {
            HTML box = builder.toHTML(i);
            box.setStyleName("resultBox");
            resultsPanel.add(box);
        }

        dock.addWest(westTrees, 20);
        dock.addNorth(RootPanel.get("wrap"),20);

        dock.add(resultsPanel);
}

在我的代码开头，我将扩展坞 (DockLayoutPanel) 添加到我的 RootLayoutPanel。

如我在第一张图片中所示...将位置设置为绝对位置我可以使用滚动条并剪切结果，但是如果我禁用位置：绝对位置，如第二张图片所示

滚动条已启用，我可以完全访问我的所有结果。

滚动条是这样设置的：

RootLayoutPanel.get().getWidgetContainerElement(dock).getStyle().setOverflowY(Overflow.AUTO);

我想做的是删除每个 dockLayoutPanel 的子项的位置或将其设置为不会给我带来问题的其他内容。

Answer 1

我找到了解决办法。在 CSS 样式上我只需要写

.cw-DockPanel > div {
    position : initial !important;
}

如果有人必须提出比使用 !important 更好的方法，我会很高兴听到。

将 StyleName 设置为 gwt dockLayoutPanel 子项

SetStyleName to gwt dockLayoutPanel child

html

css

java

gwt

docklayoutpanel