B4J Question [solved] TableView styling

udg

Expert
Licensed User
Longtime User
Hi all,

I have a TableView added through the Internal Designer.
Now I need to style it based on values from the underlying DB data.

Something like "when value for column 7 is "XYZ" then cell text color --> red"
But also "all data in column 4 gets right aligned"

So far, I tried:
B4X:
..
tvMyTable.StyleClasses.Add(File.GetUri(File.DirAssets, "Table.css"))
..
'CSS Table.css tried the following just to see if any effect applied...
.table-view .table-column {
  -fx-alignment: CENTER-RIGHT;
}
.table-column {
  -fx-alignment: CENTER-RIGHT;
}
.table-cell {
  -fx-alignment: CENTER-RIGHT;
}

Is there any tutorial I may have missed? Thank you.
 

udg

Expert
Licensed User
Longtime User
Thank you, Erel.
I'll look at the example and then set my question's title to "SOLVED" once done.

Umberto
 
Upvote 0

udg

Expert
Licensed User
Longtime User
Hi,
my test succeded, so here it is a dirty scheleton just in case someone else should have similar needs.

Firstly, I used a modified DBUtils' ExecuteTableView to assign data to my table in the form of (for each cell) a panel containing a single node (generally a label, but in one case a checkbox). This is well illustrated by @YAFUHENK here.
Then, for rendering my data with proper color and alignment I succesfully tested the following code:

B4X:
For Each row() As Object In tvMyTable.Items
     Dim p1 As Pane = row(2)              'select green/red color on cell data
     Dim lbl As Label = p1.GetNode(0)
     If (lbl.text = "CCA") Then lbl.TextColor=fx.Colors.Green Else lbl.TextColor=fx.Colors.Red
     Dim p1 As Pane = row(8)              'format number like monetary and right align horizontally
     Dim lbl As Label  = p1.GetNode(0)
     Dim i As Int = lbl.text
     lbl.text = NumberFormat2((i/100),1,2,2,False)
     Dim jo1 = lbl As JavaObject
     jo1.RunMethod("setAlignment", Array As Object("CENTER_RIGHT"))
     Dim p1 As Pane = row(9)              'center a checkbox
     Dim chk As CheckBox
     chk=p1.GetNode(0)
     Dim jo1 = chk As JavaObject
     jo1.RunMethod("setAlignment", Array As Object("CENTER"))
Next

Edit: In order to have a more complete control on the table style rendering, I added the following line in Appstart code:
B4X:
  MainForm.Stylesheets.Add(File.GetUri(File.DirAssets, "Table.css"))
Please find attached a preliminary and very bad css file (you have to change its extension from "txt" to "css" and then add it to your project's Files tab) derived from a couple of posts here and there on the Internet.

Enjoy.
 

Attachments

  • Table.txt
    2.2 KB · Views: 342
Last edited:
Upvote 0
Top