Xojo2024R4.1: is it possible to display icon in the row cell?

[Grzegorz_Greg_Pasternak]

I would like to display icon in the column of the WebListBox on certain rows meeting certain criteria. I would like this to be used with WebListBox based on DataSource.

Is it doable?

[William_Reynolds]

Hi Greg,

Personally, I’m using emojis as symbols in WebListBox as a simple and straight-forward way of handling this via WebListBoxStyleRenderer.

cellRenderer = New WebListBoxStyleRenderer(Self.listbox_records_for_review.style_normal_cell_emoji, Self.listbox_records_for_review.trash_icon)
Self.listbox_records_for_review.CellTextAt(last_row,7) = cellRenderer

[Ricardo_Cruz]

I also use emojis a lot, as @William_Reynolds. Alternatively you can also use a WebListBoxImageRenderer in your DataSource, if you prefer using custom images. WebListBoxRowData.Value supports using cell renderers.

As you only will be passing the URL, if that URL is coming from a WebPicture, you need to make sure to store the WebPicture instance somewhere, for example in one of the DataSource properties, or a Dictionary.

As for the WebPicture, it can be an icon you already have designed, or a WebPicture.BootstrapIcon. The full list of available icons can be seen here:

Bootstrap Icons

[Grzegorz_Greg_Pasternak]

Great, thanks. Additional info, the WebApp is using Bootstrap, I suppose I can also use glyphicon such as “glyphicon-link !” as well?

[Ricardo_Cruz]

Do you mean this icon?

Link

This will give you a WebPicture that you can use anywhere you need it:

WebPicture.BootstrapIcon("link", Color.Red)

[Grzegorz_Greg_Pasternak]

Well, the actual icon is of less importance. I used it just as an example, but to your question - yes.

I did the following inside DataSource.RowData method:

If vFldName = "c_oth_client_count" Then
  vUseStyle = False
  Var vValue As String
  vValue = rs.Column(vFldName)
  If vValue.ToInteger > 0 Then
    vValue ="<img src='" + str(WebPicture.BootstrapIcon("search", Color.Black).URL)+"'> " + vValue
    row.Value(vFldName) = vValue
  End If
End If

I am not sure if I can combine this with the justification but it is good enough at this stage.
I think I can display the icon now after I did some research and found your old posting.

Now I have a question on how to make the icon interactive. I would like to click on icon and show the dialog box with the list showing what makes the number.