Our blazing fast Grid component built with pure JavaScript


Post by agarcia »

Hi, is it possible to set custom icons based on image uris on the Bryntum tree?

I'm sure is easy but I did a couple of test trying with background image using the style property and I did not get the expected result.

Is it better to use some renderer function? Or there is any existing 'native' property on the taskModel to dealing with the images/icon of the tree nodes?

Thank you in advance


Post by alex.l »

Please see https://bryntum.com/products/grid/docs/api/Grid/column/TreeColumn#config-collapseIconCls
and below, there is a list of properties to manage tree icons

There is also possibility to define icon per record using https://bryntum.com/products/grid/docs/api/Grid/data/GridRowModel#field-iconCls

I'm sure is easy but I did a couple of test trying with background image using the style property and I did not get the expected result.

It should be working if you CSS is correct. Try to inspect DOM and check if image loaded, if it sized well.
If no luck, please attach runnable application, we will try to help you with CSS.

All the best,
Alex


Post by agarcia »

Hi ALex, thank you for the support.

I just want to get a set of data (grid store), and pear each item I want to display the icon that comes on the data.

You know what I mean? I even don't know what images I should display per row, these images will come from the server. And I just want to display the icon per row.

I thought there should be something like 'iconCls' for displaying a font awesome icons, but for dispolaying a custom image, I was thinking if exists something like 'icon' or 'imageUrl' or something like this?

Could you help me on that?


Post by marcio »

Hey agarcia,

For a CSS icon (like font-awesome) you can use the iconCls to add the class to the record, just like any normal class.

If you want to render a custom URL, we advise you to add it to a custom renderer and add the icon definition inside of it.

https://bryntum.com/products/grid/docs/api/Grid/column/Column#config-renderer

Best regards,
Márcio


Post Reply