Image and text in a ListGrid cell

[casper.bang]

I wish there were a ListGridFieldType.IMAGE_TEXT type for the ListGrid, such that an image as well as a text could be easily rendered.

To make up for this, I tried overriding createRecordComponent and returning a Label with the required text while leaving the column as a ListGridFieldType.IMAGE and letting the grid take care of the rendering of the image.

The above approach kinda works, but involves awkward alignment of text vs. image, has the problem that events are captured by the Label rather than propagate down to the grid and last but not least, results in rendering artifacts when changing grouping.

What is the recommended way for achieving a ListGridFieldType.IMAGE_TEXT? The grid_cell_widgets example doesn't really address such a need.

[Isomorphic]

See valueIcons and if those don't work for you, use a CellFormatter. Embedding components for this is serious overkill.

[casper.bang]

See valueIcons and if those don't work for you, use a CellFormatter. Embedding components for this is serious overkill.

Oh thanks, I did not know about this and have some trouble making it work.
Would my ListGrid have to be of type ListGridFieldType.ICON or ListGridFieldType.IMAGE? The existence of setIcon(), setImage() and setValueIcon() suggests there should be a ListGridFieldType.VALUEICON; however ListGridField only contains setImageURLPrefix() suggesting ListGridFieldType.IMAGE is the correct type. Is this the case? (Have you considered refactoring into proper subtypes to minimize irrelevant members?)

Only example I've found is this one, which does not apply to ListGrid: http://www.java2s.com/Code/Java/GWT/...wnSmartGWT.htm

[casper.bang]

Rendering bug in showcase as well

Btw. the rendering bug I mention above also appears when using the group functionality of the sample that shows how to use widgets in grid cells:

http://www.smartclient.com/smartgwt/...d_cell_widgets

So I guess, with the current version of SmartGWT anyway, one should NOT use custom cell widgets while allowing grouping.

[smartgwt.dev]

Btw. the rendering bug I mention above also appears when using the group functionality of the sample that shows how to use widgets in grid cells:

http://www.smartclient.com/smartgwt/...d_cell_widgets

So I guess, with the current version of SmartGWT anyway, one should NOT use custom cell widgets while allowing grouping.

This is fixed in the latest nightly.

[casper.bang]

This is fixed in the latest nightly.

Awesome. You guys are FAST! :)

[casper.bang]

Propagate events from a custom cell widget?

Only one small issue left relating to this then. Is it possible to propagate events from a custom cell widget, to the underlying ListGrid (in case the widget is only for output, not for input)?

I tried to trap the widget events and dispatch manually to the grid via ListGrid.fireEvent() but it doesn't seem to have any effect.

[Remyx]

Only one small issue left relating to this then. Is it possible to propagate events from a custom cell widget, to the underlying ListGrid (in case the widget is only for output, not for input)?

I tried to trap the widget events and dispatch manually to the grid via ListGrid.fireEvent() but it doesn't seem to have any effect.

Anyone ? I have the same problem and I cannot find a way to resolve it. Somehow the events must be forwarded to the grid, otherwise we cannot select and use Drag and drop for a cell with a widget inside.

[somewhereinbelgium]

Hi Isomorphic,

Can I pick up on your comment regarding the CellFormatter option here please? I use CellFormatter instances in a number of situations for formatting currency amounts, etc., but fail to see how this could be used to display an image and associated text in view of the fact that it only returns a String.

As you indicate, using embedded components for this is overkill, but it is the technique I'm using at present and would be happy to move towards an alternative.

Thanks

Alastair

[davidj6]

CellFormatter does just handle the text. There is a brand-new getValueIcon override point to provide any desired cell with a value icon (before value). Combining both of these options gives full flexibility for showing an icon and value.

[Isomorphic]

The String returning by a CellFormatter is HTML that is placed within the cell. So if you have situation like an image needing to appear above associated text (not currently handled by valueIcons) you can return HTML that would render this way as a lighter-weight alternative to embedded components.

[somewhereinbelgium]

The String returning by a CellFormatter is HTML that is placed within the cell. So if you have situation like an image needing to appear above associated text (not currently handled by valueIcons) you can return HTML that would render this way as a lighter-weight alternative to embedded components.

Very, very nice. I think this will result in much cleaner code. Thanks, Isomorphic.

There is a brand-new getValueIcon override point to provide any desired cell with a value icon (before value)

Thanks for the info davidj6; I did try this option previously but the value icon functionality available through ListGridField only works with Map<String, String>, so the URL to be used is related to a key value of type String. In my case the key value is actually an Integer which is problematic. I did try to see if there could be way of constructing an implementation of Map<String, String> which internally used a Map<Integer, String> but was unsuccessful; this was a month or two ago so don't remember the precise reason.

[somewhereinbelgium]

I've removed my component embedding code and replaced it with a simple CellFormatter class to display the appropriate images - this is a great improvement and way more performant.

What I'd like, in a perfect world to do is to have a button below the image and then be able to specify a function which should be invoked for the onClick event.

So I've written a little bit of HTML to declare the image and the button in a table but I'm not sure how or if (or even if it is desirable) to call some method or static function in my class. Does anybody out there have any experience with this stuff?

Cheers

Alastair

[megs]

So I've written a little bit of HTML to declare the image and the button in a table but I'm not sure how or if (or even if it is desirable) to call some method or static function in my class. Does anybody out there have any experience with this stuff?

I would be very interested in that too! I tried to figure out a way to do this, but as the methodNames for javascript are generated by gwt I couldn't find a way to access those.

[brunojcm]

I my tests I couldn't use valueIcons together with valueMap.
My solution was to ignore valueMap and use valueIcons and CellFormatter.