Gwt TabLayoutPanel向右对齐选项卡

我正在GWT中使用TabLayoutPanel，我希望最后一个选项卡显示在页面的右侧。有可能做到这一点吗？

如果您创建自己的选项卡，这是可能的，而且非常简单。只需创建一个选项卡形状的png图像（顶部有圆角）。编写一个css规则。使用一个FlextTable并将该css应用于将成为选项卡的每个单元格，然后将FlexTable添加到另一个mainTable中。因此，在主表的第一行中，将有tabFlexTable，在第二行中，在选择特定选项卡后，将显示任何内容。因此，对于第一行，将水平对齐应用到右侧。这也是我在专业项目中使用的方法

简短回答-否

我在GWT 2.3中深入了解了源代码，并认为从

TabBar

和

StackLayoutPanel

构建自己的复合结构比开始使用此实现更容易

为了节省你的精力，它不能很容易集中。 我很抱歉事情是这样的

都是硬编码的

private static final int BIG_ENOUGH_TO_NOT_WRAP = 16384;
private final FlowPanel tabBar = new FlowPanel(); 
...
tabBar.getElement().getStyle().setWidth(BIG_ENOUGH_TO_NOT_WRAP, Unit.PX);

共同想法：

将选项卡容器宽度设置为“自动”，而不是预定义的“16384px”

将“float:right”css属性设置为最后一个选项卡

将最后一个选项卡移到起始位置

public void onModuleLoad() {
        .....
        // init TabLayoutPanel 
        .....
        Widget rightTab = tabPanel.getTabWidget(0).getParent();
        DOM.setStyleAttribute(rightTab.getElement(), "float", "right");
        Widget tabBar = rightTab.getParent();
        tabBar.setWidth("auto");
        tabPanel.selectTab(1);
}

---

为什么不是纯CSS解决方案？将代码与设计分离是一种很好的做法

.gwt-TabLayoutPanelTabs {
    width: auto!important;
}
.gwt-TabLayoutPanelTab {
    float: right;
}

---

请记住，您的选项卡将以相反的顺序出现（首先添加的选项卡将位于右侧）

如果要将所有选项卡向右对齐，请尝试以下操作：

.gwt-TabBar .gwt-TabBarFirst {
    width: 100%;
}

.gwt-TabBar .gwt-TabBarRest {
    width: 4px;
}

.gwt-TabBar .gwt-TabBarFirst-wrapper {
    width: 100%;
}

---

谢谢这对我很有用……：）。但我的主页上有两个选项卡面板。我希望一个应该对齐右边，但第二个应该对齐默认值（左）。这是否可能，因为gwt对每个组件都有自己的css元素？