B4J Library [BANano] UOEGridTable Conditional Value Display Formatting

Ola

This tut is based on this BANano Lib here, [BANano] UOEGridTable

What we will attempt here is to show all negative value in red and perhaps those non negative green.

The magic of this is an event definition that has been added to the UOEGridTable.

#Event: ColumnRenderer(value As Object, record As Map, cell As BANanoObject, displayEl As BANanoObject)

And once you have defined this event, you need to change the sub name to the actual sub you want as its just a template.

1. After you add your grid to the designer, when generating members, also select the ColumnRenderer event
2. In the code module update the code to link to the column you need. You can create as many ColumnRenderer events and then change the sub construct to link to your column.

As an example, we want to update the values of the population column. This sub we will code as part of our app in our module.

Sub mycountries_PopulationRender(value As Object, record As Map, cell As BANanoObject, displayEl As BANanoObject)
    'if the value is null, make zero
    If value = Null Then value = 0
    'create element from object
    Dim dl As BANanoElement = BANano.ToElement(displayEl)
    'update the value, reference to http://numeraljs.com
    Dim sResult As String = mycountries.NumeralFormat(value,"0 a")
    'update the text for the rc
    dl.SetText(sResult)
    'if value < 0 make red
    If value < 0 Then
        dl.SetStyle($"{"color":"red"}"$)
    End If
End Sub

When the code is running, this displays the grid as in...

From the above code, each value that is null is made zero.
We convert the display element from a bananoobject to a bananoelement
We then format the value so that it shows the 'million' indicator for all values equal or above 1 million value.
If the value is less than zero, we change the display element color to red. Whalla!

With this you can apply any formatting you need for any column you need directly from your code.

PS:

To indicate which renderer to use for your column, after the column is added, tell it which renderer to use. In this case it will be the sub name "populationrender" with .SetColumnRenderer

mycountries.AddColumn("population","Population",mycountries.COLUMN_TEXT,0,True,mycountries.ALIGN_RIGHT)
    mycountries.SetColumnRenderer("population", "PopulationRender")

This then formats your values each time they are added to the grid and all the code in the formatter is executed.

#HelpingOthersToSucceed!

 

[Mashiane]

You can refer to numeral.js to format the values with the NumeralFormat method of the grid. The example below, makes negative amounts red and bold and 'millionize' the amounts too.

Sub uoegrid_ColumnRenderer(value As Object, record As Map, cell As BANanoObject, displayEl As BANanoObject)
    If value = Null Then value = 0
    Dim de As BANanoElement = BANano.ToElement(displayEl)
    Dim svalue As String = uoegrid.NumeralFormat(value,"$(0.00 a)")
    de.SetText(svalue)
    If value < 0 Then
        de.SetStyle($"{"color":"red","font-weight": "bold"}"$)
        
    End If
End Sub

As you can see, the .SetStyle methods will apply with whatever format you need.

Ta!