Question

我正在使用GWT 2.4。我有一些简单的内容......

    final Image ajaxImage = new Image("loading.gif");
    final Grid grid = new Grid(1, 2); 
    grid.setText(0, 0, "Loading...");
    grid.setWidget(0, 1, ajaxImage);
    this.container = new FlowPanel();
    this.container.add(grid);
    rootPanel = new SimplePanel();
    rootPanel.add(this.container);

我希望这个内容在包含面板中水平和垂直居中，如果重要的话，它是一个FlowPanel。我该怎么做？

谢谢， - 戴夫

Answer 1

我知道如何在垂直面板上进行操作。

VerticalPanel panelPrincipal3 = new VerticalPanel();//Esto es el panel central, donde se centra todo
    panelPrincipal3.setWidth("100%");
    panelPrincipal3.setHeight("100%");
    panelPrincipal3.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_CENTER);
    panelPrincipal3.setVerticalAlignment(HasVerticalAlignment.ALIGN_MIDDLE);
    panelPrincipal3.add(/*your panel*/);//here yo add whatever yo want, and should be centered

Answer 2

如果您将FlowPanel作为RootPanel的直接孩子，则可以尝试将其height设置为100%。因此，如果您只有一个网格作为容器的子组件，则可以设置其对齐方式：

container.setCellHorizontalAlignment( grid, HasHorizontalAlignment.ALIGN_CENTER );
container.setCellVerticalAlignment( grid, HasVerticalAlignment.ALIGN_MIDDLE );

但如果你改变主意并转而使用UiBinder，你可以这样做：

<g:VerticalPanel spacing="0" width="100%" height="100%" ui:field="mainPanel">
    <g:Cell horizontalAlignment="ALIGN_CENTER" verticalAlignment="ALIGN_MIDDLE">
    <!-- content goes here -->
    </g:Cell>
</g:VerticalPanel>

Answer 3

用css？ margin:0 auto;和position:absolute; top:50%;？

GWT：如何将内容集中在面板中？

3 个答案: