Question

我的布局结构位于图片 enter image description here

中

简介图片：HTMLPanel是RootPanel和2个垂直面板，一个标题和其他内容面板。第二个垂直面板有DockLayoutPanel 现在我的问题是当我运行项目时我的DockLayout没有显示主页代码

<g:HTMLPanel>
     <g:VerticalPanel ui:field="contentPane" ></g:VerticalPanel>
     <g:VerticalPanel ui:field="headerPane" styleName="{style.upper-titlebar-container}" ></g:VerticalPanel>
</g:HTMLPanel>

内容面板的代码

<g:HTMLPanel>
        <g:DockLayoutPanel unit='EM'>
             <g:north size='4'>
                <g:Label> Hello </g:Label>
             </g:north>
             <g:east size="7.0">
                  <g:HTMLPanel ui:field="EdgeBandingPane"></g:HTMLPanel>
             </g:east>
             <g:west size="5.8" >
                  <g:HTMLPanel ui:field="PartsPane"></g:HTMLPanel>
             </g:west>

             <g:center >
                  <g:HTMLPanel ui:field="PanelsPane"></g:HTMLPanel>
             </g:center>
             <g:south size="5">
               <g:Label> Hello </g:Label>
             </g:south>
        </g:DockLayoutPanel>

    </g:HTMLPanel>

Iam添加的小部件显示在输出中但我的Dock Panel未显示。我没有得到问题提前致谢

Answer 1

GWT * LayoutPanels嵌套在* Panels（没有Layout的那些）时不会自动工作。这是因为布局的方法不同：

布局面板使用绝对CSS布局，其中大小必须由父元素
“普通”面板随着内容的增长而增长

要在Panels中嵌套LayoutPanels，您必须设置固定大小并在大小变化时调用onResize。但另外，您可以尝试仅使用LayoutPanels。如果我是对的，你想要一个动态高度的标题（高度由它的内容定义）。在这种情况下，您应该使用HeaderPanel。对于标题，您可以使用VerticalPanel。作为（可交换的）内容的容器，您可以使用SimpleLayoutPanel，它是承载一个小部件的LayoutPanel：

<g:HeaderPanel>
    <g:VerticalPanel ui:field="headerPane"></g:VerticalPanel>
    <g:SimpleLayoutPanel ui:field="contentPane"></g:SimpleLayoutPanel>
</g:HeaderPanel>

从我的观点来看，应删除内容的DockLayoutPanel周围的额外HTMLPanel，以确保从外部正确设置大小：

<g:DockLayoutPanel unit='EM'>
     <g:north size='4'>
        <g:Label> Hello </g:Label>
     </g:north>
     <g:east size="7.0">
          <g:HTMLPanel ui:field="EdgeBandingPane"></g:HTMLPanel>
     </g:east>
     <g:west size="5.8" >
          <g:HTMLPanel ui:field="PartsPane"></g:HTMLPanel>
     </g:west>
     <g:center >
          <g:HTMLPanel ui:field="PanelsPane"></g:HTMLPanel>
     </g:center>
     <g:south size="5">
       <g:Label> Hello </g:Label>
     </g:south>
</g:DockLayoutPanel>

编辑：只有“手动”布局才需要HTMLPanel。不要用它来包装另一个小部件/面板。

GWT中的垂直面板和Doc布局面板

1 个答案: