如何以不同方式设置标准GWT组件(TabBar)的样式？

Question

我正在使用TabBar,我想以不同的方式设置组件的样式.所以有一次这种风格,另一种时候那种风格.我认为这会起作用,但它没有:

TabBar t = new TabBar();
t.addTab( "1" );
t.addTab( "2" );
t.addStyleName( MyResources.INSTANCE.css().slickTab() );

和:

public interface MyResources extends ClientBundle
{
 public static final MyResources INSTANCE = GWT.create(MyResources.class);
 @Source("style.css") MyCssResource css();
}
public interface MyCssResource extends CssResource
{
 String slickTab();
}

在CSS中

.slickTab .gwt-TabBar .gwt-TabBarItem {
  background-color: #ff0000;
  font-weight: normal;
}

但外观不会改变.我做错了什么？

Answer 1

接口 MyCssResource 需要位于 MyResources 内部。

这是一个例子：

public interface Resources extends ClientBundle
{
    public static final Resources INSTANCE = 
        GWT.create( Resources.class );

    /***********************************************
     *                    Home
     ***********************************************/
    @Source( "./css/home.css" )
    public HomeCss getHomeCss();

    public interface HomeCss extends CssResource
    {
         String loginBtn();
    }

    /***********************************************
     *                Another Page
     ***********************************************/
    @Source( "./css/AnotherPage.css" )
    public AnotherPage getAnotherPageCss();

    public interface AnotherPage extends CssResource
    {
         String title();
    }
}

这就是我使用各种资源的方式，而且效果非常好。
每当您需要在同一个方法或函数中多次使用它时，您可以这样做：

HomeCss homeStyle = Resource.INSTANCE.getHomeCss();
yourPanel.setStyleName( homeStyle.yourPanel() );

如果有任何不明白的地方，请随时询问。