将 GWT 中的 CSS（动态）设置为具有多个关联样式的元素

Question

我有一个 TabLayoutPanel 实例，其中选项卡的数量将动态设置。因此，要对齐标签以填充屏幕的整个宽度，我需要

1) 使用 auto !important (done) 覆盖 gwt-TabTayoutPanel 默认值宽度 16384px；

2) 将 gwt-TabTayoutPanelTab 的宽度设置为适当的百分比值（例如 2 个标签 = 50%。3 个标签 = 33%，4 个标签 = 25% 等等）。 我有一个简单的函数，如下所示（简化）：

双 cssValue = 100.0/getWidgetCount();

（完成）

3) 现在我的问题是：如何从 Java 设置 gwt-TabTayoutPanelTab 的宽度？我加粗了 Tabs 因为当我使用 this.getStyleName(); 时，我得到了 gwt-TabLayoutPanel 而不是 gwt-TabLayoutPanelTab 。

总之，我可以将我的问题分为两部分：

-如何从GWT访问TabLayoutPanelTab css类？；

-如何使用我动态生成的百分比数字设置所述类宽度？;

编辑： 正确编辑函数以确定百分比值。

Answer 1

-如何从 GWT 访问 TabLayoutPanelTab css 类？;

int widgetCount = panel.getWidgetCount();
for(int i = 0; i < widgetCount; i++)
    System.out.println(panel.getTabWidget(i).getParent().getStyleName());
}

如您所见，无法直接访问这些选项卡。您可以做的是访问选项卡中的小部件，并获取它们的父级，即相关选项卡。

-如何使用我动态生成的百分比数字设置所述类宽度？;

• 如果您有一定数量的可能百分比，那么您可以声明这些类（例如 custom-Width-25、custom-width-33 等），您可以在其中使用 !important 注释指定宽度以覆盖所有内容否则。
• 如果以前的解决方案不可接受，那么您只能使用内联 css。 这意味着该元素必须已经加载到 DOM 中。 在您知道该元素已加载的代码中的某处，您可以调用如下代码：

int widgetCount = panel.getWidgetCount();
for(int i = 0; i < widgetCount; i++) {
  com.google.gwt.user.client.Element tabElement = panel.getTabWidget(i).getParent().getElement();
  tabElement.getStyle().setWidth(100/widgetCount, Unit.PCT);
}