GXT - 3: HTML code is displayed rather than the image

Find the image for the problem:

I am trying to create a column which displays multiple images which contains clickable events. But instead of image, I am getting the HTML code.

The column config I have written is as follows:

    actionsCol = new ColumnConfig<SensorTreeModel,String>(new ValueProvider<SensorTreeModel, String>() {
          com.sencha.project.client.Resources resources = GWT.create(com.sencha.project.client.Resources.class);
            @Override
            public String getValue(SensorTreeModel String) {
                //ImageResource image = resources.add();
                FlowPanel flowPanel = new FlowPanel();

                ImageResource add = com.sencha.project.client.Resources.INSTANCES.add();
                Image add1 = new  Image(add);
                flowPanel.add(add1);
              //return add1;
              return flowPanel.toString();
            }

            @Override
            public void setValue(SensorTreeModel object, String value) {
              if (object.getIsLeaf()) {

              }
            }

            @Override
            public String getPath() {
              return "actions";
            }
          });
      actionsCol.setHeader("");

Solution

In ColumnConfig<M,N> and ValueProvider<T,V>, N and V are the same and type of columns content. So on your example you are returning String as value. If you return ImageResource, column will show Image.

I hope it helps.

  actionsCol = new ColumnConfig<SensorTreeModel,ImageResource>(new ValueProvider<SensorTreeModel, ImageResource>() {
             com.sencha.project.client.Resources resources = GWT.create(com.sencha.project.client.Resources.class);
             @Override
             public ImageResource getValue(SensorTreeModel String) {

                  ImageResource add = com.sencha.project.client.Resources.INSTANCES.add();
                  return add;
                }

                @Override
                public void setValue(SensorTreeModel object, ImageResource value) {
                  if (object.getIsLeaf()) {

                  }
                }

                @Override
                public String getPath() {
                  return "actions";
                }
      });
 actionsCol.setHeader("");
actionsCol.setCell(new ImageResourceCell());