Search code examples
gwtdatagridcellcustom-cellgwt-celltable

GWT how to add a custom cell to celltable/datagrid


I have rendered a custom cell which combines an image and text. It looks like this:

   class ImageTextCell extends AbstractCell<String> 

My question is how to add this cell into celltable/datagrid. I have tired this.

  Column<Message, String> iconColumn = new Column<Message, String>(new ImageTextCell())
            {
        @Override
        public String getValue(Message versionStatus) {

            return ? // I dont know what to type here. How to return the ImageTextCell object           }
    };

Solution

  • The role of the Cell object is to turn a value into a piece of HTML. The role of the Column is to get that value from each row. For example, you have a bunch of Messages, each one on its own row - the Column should take a Message and figure out what String to pass to the Cell.

    The output of getValue will be fed into the input of render. The output of render should be the HTML you want to see in your app.

    Pseudo-codily, here's what GWT does for you:

    for each Message in your table {
        pass the Message into Column.getValue and get out a String
        pass that String into Cell.render and get out some HTML
        add that HTML inside a <td> element in the table we're drawing
    }
    

    You just have to define Column.getValue and Cell.render so that this process makes the table you want.