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

【问题标题】：set custom style to GWT CellBrowser with UiBinder使用 UiBinder 将自定义样式设置为 GWT CellBrowser
【发布时间】：2012-02-04 22:48:21
【问题描述】：

我正在尝试使用 UiBinder 为 GWT CellBrowser 小部件设置自定义样式，但我无法更改任何依赖样式（即，我可以为整个小部件设置不同的背景颜色，但我不知道如何更改所选项目的样式）

我尝试使用此论坛中建议的“@external”用于其他小部件（例如here 或here），但它没有任何效果，我猜这是因为样式指定的方式细胞浏览器。

我认为我应该采取的方法应该更类似于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 文件中，在标记内：

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

如果我不使用“CellBrosRes”，代码可以正常工作。因此，如果我将创建 CellBrowser 的行替换为以下行：

CellBrowser browser = new CellBrowser(tvm, null);

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

任何有关如何使这项工作的帮助将不胜感激。让我知道您是否需要更多详细信息或有什么不清楚的地方。

谢谢

【问题讨论】：

标签： gwt uibinder cellbrowser

【解决方案1】：

经过一番挣扎后，我决定为它创建自己的小部件。它肯定可以改进，我很想听听建议，但现在，我正在使用它。

这是结构：CellBrowser > CellPanel[] > Cell[]

CellBrowser 小部件使用元胞数组进行初始化。
这些单元格放置在第一个 CellPanel 上。对于每个单元格，您可以设置一个要在其上显示的 Widget 和一个 CellPanel 包含它的孩子。

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

【讨论】：

【解决方案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

希望对你有帮助

【讨论】：