Tile Formatting [How To]

[CI-CUBE]

Hi Iso,

is it possible to create--by some DetailFormatter--a Tile as shown in the attachment, that can be managed by a regular TileGrid?

Minimum would be an Image (left)+text (label and desc, right).

Best case would be add'l Icons as shown...

Any hints? thx, Ekki

* GWT Rocks! * SmartGWT Rocks Even Harder! * SmartGWT PRO 2.1
Build 1139, GWT 2.0.3, Jetty 7.0.0, Eclipse 3.5.1, JRE 1.6.0_18 *

*** www.EasternGraphics.com/X-4GPL ***

[Isomorphic]

Yes, the simplest way is to provide a single DetailViewField and add a formatter that produces everything you want to see in the tile.

[CI-CUBE]

Am I right that the mechanism available in S'GWT Api (which of course is powerful and smart) 'only' supports 1-column vertical views? For my 2-columns layout I should directly create the HTML code and return it via getTileHTML(Record pRecord), right?

Thx Ekki

[Isomorphic]

Correct, return two column HTML directly from your formatter.

[CI-CUBE]

Hi Iso,

all and everything works great. Now I want to add click functionality to some of the visual items (marked red in the pic)... Two issues

- in case such a sub item of the Tile was clicked the overall Tile click handler should not be called

- what is the right approach to bind a function on [S']GWT level to the onclick() parameter, some JSNI function?

Thx

Ekki

* GWT Rocks! * SmartGWT Rocks Even Harder! * SmartGWT PRO 2.1
Build 1139, GWT 2.0.3, Jetty 7.0.0, Eclipse 3.5.1, JRE 1.6.0_18 *

[Isomorphic]

Unfortunately this is somewhat low-level. Two choices:

1) if the different areas of the tile are basically fixed size, use the normal TileGrid.recordClick handler, and just look at the coordinates to figure out what part the click fell in.

2) at a native onmousedown or similar JavaScript event handler to each separate part of the HTML you generated, that just records what part of the HTML was hit. Simplest thing here would be to just set a global variable in JavaScript, which you can then look at in TileGrid.recordClick.

[futtegud]

Would it be possible to show a short code example for how to create the simple example of an tilegrid with the image to the left of the label?