水平居中FlexTable在父FlowPanel中?

时间:2013-01-19 22:48:33

标签: gwt

我创建了一个FlexTable,我想在父FlowPanel中水平居中,如:

FlexTable ft = new FlexTable();
ft.add(0, 0, new Label());
ft.add(0, 1, new Orange());
ft.add(0, 2, new Label());

FlowPanel parent = new FlowPanel();
parent.add(ft); // how can I horizontally center the table in this div?

表的内容比父FlowPanel(宽度:auto,浏览器的整个宽度)窄,但表现在是左对齐的,

由于

2 个答案:

答案 0 :(得分:2)

两个选项:

parent.getElement().getStyle().setTextAlign(TextAlign.CENTER);

ft.getElement().getStyle().setProperty("margin", "0 auto");

当然,您可以使用CSS样式。

答案 1 :(得分:1)

首先?您使用的是哪个版本的GWT?问我这个问题的原因是,FlexTable中没有类似于latest version中使用的add(int,int,Widget)的方法。

但是,您可以使用以下代码。

    FlexTable ft = new FlexTable();
    ft.setWidget(0, 0, new Label("a"));
    ft.setWidget(0, 1, new Label("b"));
    ft.setWidget(0, 2, new Label("c"));

    FlowPanel parent = new FlowPanel();
    parent.setSize("100%", "100%");
    parent.add(ft);
    parent.getElement().getStyle().setProperty("TextAlign", "center");
    // If you are using Firefox : 
    //parent.getElement().getStyle().setProperty("TextAlign", "-moz-center");
    RootLayoutPanel.get().add(parent);

如果你不想在java代码中提及样式,你可以随时使用CSS,如

parent.addStyleName("myStyle");

在CSS中

.myStyle{
text-align : center;
}