使用UiBinder将自定义样式设置为GWT CellBrowser

Question

我尝试使用UiBinder为GWT CellBrowser小部件设置自定义样式，但我无法更改任何相关样式(例如，我可以为整个小部件设置不同的背景颜色，但我不知道如何更改所选项目的样式)

我试着在其他小部件(例如here或here)中使用论坛中建议的"@external“，但没有任何效果，我猜这是因为CellBrowser中指定样式的方式。

我认为我应该采取的方法应该更类似于http://crazygui.wordpress.com/2011/11/01/how-to-skin-a-gwt-celltable/。使他们的代码适应CellBrowser，而不是我正在使用的CellTable：

@UiField (provided=true) CellBrowser cellbrowser;
interface CellBrowserCompanyUiBinder extends UiBinder<Widget, CellBrowserCompany> {}

public CellBrowserCompany() {

    TreeViewModel tvm = new TreeViewModelImpl();        
    CellBrowser.Resources reso = GWT.create(CellBrowsRes.class);

    cellbrowser = new CellBrowser(tvm, null, reso);
    cellbrowser.setKeyboardSelectionPolicy(KeyboardSelectionPolicy.ENABLED);

    initWidget(uiBinder.createAndBindUi(this));
}
public interface CellBrowsRes extends CellBrowser.Resources{
    @Source({CellBrowser.Style.DEFAULT_CSS, "path/to/css.css"})
    BrowserStyle cellbrowserstyle();

    interface BrowserStyle extends CellBrowser.Style{}
}

我使用来自GWT SDK的CSS文件作为参考。

在我拥有的ui.xml文件中，有一个< g:HTMLPanel>标记：

<c:CellBrowser ui:field="cellbrowser" width="100%" height="100%"/>

如果我不使用"CellBrosRes“，代码运行得很好。因此，如果我将创建CellBrowser的代码行替换为以下代码行，它就会起作用：

CellBrowser browser = new CellBrowser(tvm, null);

如果我使用"CellBrosRes“，它会忽略我的风格。我认为问题出在我创建样式资源的方式上。

任何关于如何使其正常工作的帮助都将不胜感激。如果你需要更多的细节，或者有些东西不够清楚，请让我知道。

谢谢

Answer 1

经过更多的努力之后，我决定为它创建自己的小部件。它肯定可以改进，我很乐意听到建议，但到目前为止，这是我正在使用的。

结构如下: CellBrowser > CellPanel[] > Cell[]

• CellBrowser小部件使用单元格阵列进行初始化。
• 这些单元格被放置在第一个CellPanel上。对于每个单元格，您可以设置要在其上显示的小部件和包含其子项的CellPanel。

由于整个过程使用了几个文件，我已经将代码作为google code project上传

Answer 2

您可以扩展CellBrowser并更改默认的css。

public class CustomCellBrowser extends CellBrowser {

/**
 * The resources applied to the table.
 */
interface CellResources extends CellBrowser.Resources {
    @Source({CellBrowser.Style.DEFAULT_CSS, "CustomCellBrowser.css"})
    CellBrowser.Style cellBrowserStyle();
}

public <T> CustomCellBrowser(TreeViewModel viewModel, T rootValue) {
    super(viewModel, rootValue, (CellBrowser.Resources) GWT.create(CellResources.class));
}

}

Grab a copy of the default CSS here and change

希望这是有帮助的