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

Question

我想在包含图像+文本的celltable/datagrid中添加一列.我只是做了一些研究,发现可能有3种方法可以做到这一点.

1. 制作一个ImageResourceCell和一个TextCell,然后将它们组合成一个复合单元格.(没有看到任何例子或参考,它只是出自我的想法.也许这不起作用)

2. 使用IconCellDecorator.我检查了文档.它说"一个细胞装饰器将图标添加到另一个细胞".不确定它是否可以做我想要的.我仍然没有找到任何关于它的例子.

3. 制作自定义单元格.有一个关于在GWT官方网站上梳理颜色名称和颜色样式的例子.我厌倦了这种方式来组合图像和字符串.但它没有用.也许我的代码有问题,因为我不完全理解代码.

任何人都可以提供一些实现这一点的例子.你可以做任何你知道的方式.只需键入一些代码并向我展示示例.

非常感谢.

最好的祝福

Answer 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,对我来说很好.

招呼,妮可