带有 SimpleLayoutPanel 的 GWT DataGrid 不会显示垂直滚动条答案

【问题标题】：GWT DataGrid with SimpleLayoutPanel won't present vertical scroll bar带有 SimpleLayoutPanel 的 GWT DataGrid 不会显示垂直滚动条
【发布时间】：2012-04-22 13:19:49
【问题描述】：

GWT 展示，以及我找到的许多示例，DataGrid 的用法总是很简单：

您在 UIBinder 中定义 DataGrid 元素，并设置要提供的字段。
在视图 constructor 中初始化网格 - 定义列 并添加数据
UI 绑定器已生成
它按预期呈现的一切..

但常见情况并非如此静态：您通常设置网格但没有数据，这些数据可能仅在用户执行某些操作（单击按钮等）后提供。

我花了很多时间在我复杂的 UI 布局中展示 DataGrid :| 为此，网格现在托管在具有 100% 宽度和高度的 SimpleLayoutPanel 中，并且此 SimpleLayoutPanel 位于某个停靠面板内。但由于我不明白的原因 - 网格显示超出了停靠面板的大小，所以我永远看不到它的滚动条的底端。

这是我的 UI 活页夹（为了清楚起见删除了一些内容）：

<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'
    xmlns:g="urn:import:com.google.gwt.user.client.ui">

<ui:style>

.sidePadding {
    padding-left: 8px;
        padding-right: 8px;
 }

    .expanded {
    width: 100%;
    height: 100%;
}


<g:DockLayoutPanel unit="PX" styleName="{style.expanded}">
    <g:north size="45">
        ...
    </g:north>
    <g:center>
    </g:center>
        ...
    <g:east size="190">
        <g:FlowPanel styleName="{style.sidePadding}">
            <g:FlowPanel>
                <g:Label>SOME TOOLBAR</g:Label>
            </g:FlowPanel>
            <g:HTMLPanel>
                <g:Label>SOME PANEL PANEL </g:Label>
            </g:HTMLPanel>
            <g:FlowPanel ui:field="eastContent">
                <g:Label>SOME FLOW PANEL</g:Label>
            </g:FlowPanel>
            <g:SimpleLayoutPanel ui:field="imagesGrid" addStyleNames="{style.expanded}"/>
        </g:FlowPanel>
    </g:east>
</g:DockLayoutPanel>

</ui:UiBinder>

事实证明 - 东面板的高度为 650 像素，这是正确的值，但 SimpleLayoutPanel 内的 DataGrid 也具有相同的高度！并且因为它之前有一些标签等 - 它溢出了东面板的大小..

有什么帮助？？？

更新： 似乎如果我从东面板中删除所有内容并只留下 DataGrid 的 SimpleLayoutPanel - 它可以找到！但我确实需要在网格上方添加所有这些额外的标签 - 我找不到解决方案。 ??

【问题讨论】：

标签： java gwt datagrid

【解决方案1】：

见https://developers.google.com/web-toolkit/doc/latest/DevGuideUiPanels

布局面板（RequiresResize 小部件）必须一直嵌套到其他布局面板（ProvidesResize 小部件）中，一直到 RootLayoutPanel、ResizePanel 或具有明确且固定大小的布局面板（即不是填充，例如，不是以父面板的百分比给出，而是以像素为单位）。

在这里，DockLayoutPanel 和 SimpleLayoutPanel 之间的 FlowPanel 打破了层次结构。

您可能希望将FlowPanel 与HeaderPanel 进行交易，将所有FlowPanels 放在标头（在容器FlowPanel 中）和您的SimpleLayoutPanel（或您的Datagrid) 作为内容。
尽管没有实现ProvidesResize，HeaderPanel 尊重此合同，但仅限于其 content 子项（这是它的关键：根据HeaderPanel 调整 content 子项的大小的大小和 header 和 footer 的 intrinsic 大小）

【讨论】：