GWT 如何制作由 2 种单元格组成的复合单元格或如何制作带有图像和文本的自定义单元格答案

【问题标题】：GWT How to make a composite Cell composed of 2 kinds of cells or how to make a custom cell with image and textGWT 如何制作由 2 种单元格组成的复合单元格或如何制作带有图像和文本的自定义单元格
【发布时间】：2012-06-29 16:45:20
【问题描述】：

我想在包含图像+文本的单元格表/数据网格中添加一列。我只是做了一些研究，发现可能有 3 种方法可以做到这一点。

制作一个 ImageResourceCell 和一个 TextCell，然后将它们组合成一个复合单元格。（还没有看到任何示例或参考，它只是从我的脑海中浮现出来。也许这不起作用）
使用 IconCellDecorator。我检查了文档。它说“一个将图标添加到另一个单元格的单元格装饰器”。不确定它是否可以做我想要的。我仍然没有找到任何关于它的例子。
制作自定义单元格。 GWT官网中有一个关于颜色名称和颜色样式组合的例子。我厌倦了这种结合图像和字符串的方式。但它不起作用。也许我的代码有问题，因为我不完全理解代码。

谁能提供一些关于实现这一目标的例子。你可以做任何你知道的方法。只需输入一些代码并给我看示例。

非常感谢。

最好的问候

【问题讨论】：

查看Showcase 示例，尤其是 CellList、CellTree/CellBrowser 和 CellSampler。

标签： gwt datagrid gwt-2.2-celltable custom-cell gwt-celltable

【解决方案1】：

这不是您搜索的内容，但我认为您可以修改我的示例。在这里，我使用 CompositeCell 来获取一个包含 2 个不同图像的 Cell，每个图像都呈现在一个 ImageCell 中。

//first make a list to store the cells, you want to combine
final ArrayList<HasCell> zellen = new ArrayList<HasCell>();

//then define the cells and add them to the list    
HasCell bearbeiten = new HasCell(){
    @Override
    public Cell getCell() {
        return new ImageCell();
    }

    @Override
    public FieldUpdater getFieldUpdater() {
        return null;
    }

    @Override
    public Object getValue(Object object) {
        String bearbBild = "images/pencil3.png";
        return bearbBild;
    }
};
zellen.add(bearbeiten);


HasCell ansicht = new HasCell(){

    @Override
    public Cell getCell() {
        return new ImageCell();
    }

    @Override
    public FieldUpdater getFieldUpdater() {
        return null;
    }

    @Override
    public Object getValue(Object object) {
        String ansichtBild = "images/gnome_edit_find.png";
        return ansichtBild;
    }
};
zellen.add(ansicht);

//use your CompositeCell in another Widget or Table         
Column<Benutzergruppe, Cell> options = new Column<Benutzergruppe, Cell>(new CompositeCell(zellen)){

    @Override
    public Cell getValue(Benutzergruppe object) {
        return zellen.get(0).getCell();
    }   
};

我将该列添加到 DataGrid，对我来说效果很好。

你好，妮可

【讨论】：