B4A Library [Class] Flexible Table

Roberto P. · Aug 26, 2015

hello Klaus
here is the code I use.

B4X:

'
    mTableAttivita.Initialize(Me, "Table1", 14, Gravity.CENTER_HORIZONTAL, True)
    mTableAttivita.CellAlignment = Bit.Or(Gravity.LEFT, Gravity.TOP)
    mTableAttivita.HeaderColor = Colors.LightGray
    mTableAttivita.HeaderTextColor = Colors.Blue
   
    mTableAttivita.TextColor = Colors.Black 'Colors.Blue
    mTableAttivita.TableColor =  Colors.RGB(198,198,199) 'Colors.Black
    mTableAttivita.RowHeight = 50dip
   
    mTableAttivita.UseColumnColors = True
    mTableAttivita.AddToActivity(pnlTable, 0, 0, pnlTable.Width, pnlTable.Height)   
   
   
    mTableAttivita.MultiSelect = False
    mTableAttivita.SortColumn = True
    mTableAttivita.SingleLine = False
    'mTableAttivita.HeaderHeight = 0dip
   
    mTableAttivita.UseColumnColors = False

thank you

klaus · Aug 26, 2015

What is the Value of pnlTable.Top ?

Roberto P. · Aug 27, 2015

mTableAttivita.AddToActivity(pnlTable, 0, 0, pnlTable.Width, pnlTable.Height)

Log("top position: " & pnlTable.Top)

result is: top position: 0

thanks

klaus · Aug 27, 2015

What is mTableAttivita ?
Does it have a Top property ?
If yes, what is its value ?

Roberto P. · Aug 28, 2015

HI Klaus
mTableAttivita is the variable object TableView (Dim mTableAttivita As TableView) and I had set the Top property.

also by setting the value: mTableAttivita.Top = 0dip

the result does not change ?!

thank you

klaus · Aug 28, 2015

Sorry, but I don't understand.
What is TableView in this line Dim mTableAttivita As TableView ?
And then what is pnlTable ?
Couldn't you post a small project showing the problem ?

Roberto P. · Aug 28, 2015

finally ... I've found the problem

was the management of stdActionBar

As private bar StdActionBar

set up this way and in a vertical position, creating the gray bar:

bar.NavigationMode = bar.NAVIGATION_MODE_TABS

in this way it works correctly

bar.NavigationMode = bar.NAVIGATION_MODE_STANDARD

I'm sorry for making you waste time thinking it was your component.

thanks

franchsesko · Sep 6, 2015

Hi,

I just wrote a simple app that requests data from my server,. I get back a list of columns and the associated data (json), so each time the http job finishes (JobDone event), I call the following "SetupGrid" procedure:

B4X:

Sub SetupGrid(plstCols As List)
   Dim i As Int
   Dim asHeader(plstCols.Size) As String
   'In my layout I've got a toolbar (pnlToolbar) and a panel to contain the grid, just under it
   gtblSignals.Initialize(Me, "gtblSignals", plstCols.Size,Gravity.LEFT,False)
   'That was my first try: gtblSignals.AddToActivity(Activity, 0, pnlToolbar.Height, 100%x, 100%y)
   pnlTable.Width = 100%x
   pnlTable.Height = 100%y - pnlToolbar.Height
   gtblSignals.AddToActivity(pnlTable, 0, 0, pnlTable.Width, pnlTable.Height)
   'Tried that: gtblSignals.AddToActivity(pnlTable, 0, 0, 1500dip, pnlTable.Height)
   gtblSignals.HeaderColor = Colors.RGB(100, 100, 140)
   gtblSignals.HeaderTextColor = Colors.White
   gtblSignals.RowColor2 = Colors.RGB(200,200,220)
   'Setup column header names
   For i=0 To plstCols.Size - 1
     asHeader(i) = plstCols.Get(i)
   Next
   gtblSignals.SetHeader(asHeader)
End Sub

Although I've read the posts on this thread and the "TableView", I still cannot figure out how to do two things (I'm quite new to b4a, but as I understood, these are features this table view should support):
1) How to let the column widths adjust to their largest entry
2) How to let the grid adjust its width to the columns width and scroll horizontally if needed.
If you can just point out the general idea how to do that I'll complete whats needed.
Thanks.

klaus · Sep 7, 2015

The 'automatic' column width exist only in the LoadSQLiteDB and LoadTableFromCSV2 routines.

franchsesko · Sep 9, 2015

Thanks Klaus.

I used LoadSQLiteDB to craft a sbu for me.
Still don't know if it will scroll horizontally if needed.

Here's my version of a "LoadFromJSONList" that I added to the class:

B4X:

'load data from a JSON set
'DataList = A JSON array of objects (Get it from a JSONParser .NextObject)
'ColNames = A list of column names (to extract from the JSON objects in DataList)
'AutomaticWidths  True > set the column widths automaticaly
Public Sub LoadFromJSONList(DataList As List, Colnames As List, AutomaticWidths As Boolean)
   Dim mapData  As Map

   cAutomaticWidths = AutomaticWidths
   NumberOfColumns = Colnames.Size
   innerClearAll(NumberOfColumns)
   If AutomaticWidths Then
     pnlTable.Visible = False
   End If
   
   Dim Headers(NumberOfColumns) As String
   Dim ColumnWidths(NumberOfColumns) As Int
   Dim HeaderWidths(NumberOfColumns) As Int
   Dim HeaderWidthsCopy(NumberOfColumns) As Int
   Dim DataWidths(NumberOfColumns) As Int
   Dim Col, row As Int
   Dim str As String
   For Col = 0 To NumberOfColumns - 1
     Headers(Col) = Colnames.Get(Col)
     If AutomaticWidths = False Then
       ColumnWidths(Col) = 130dip
       HeaderWidthsCopy(Col) = 130dip
       DataWidths(Col) = 130dip
     Else
       HeaderWidthsCopy(Col) = cvs.MeasureStringWidth(Headers(Col), Typeface.DEFAULT, cTextSize) + ExtraWidth
       DataWidths(Col) = 0
     End If
   Next
   'Again, as SetColumnsWidth resets HeaderWidths() (<-- Why ?)
   For Col = 0 To NumberOfColumns - 1
     HeaderWidths(Col) = HeaderWidthsCopy(Col)
   Next
   SetHeader(Headers)
   SetColumnsWidths(ColumnWidths)
   
   If DataList.Size > 0 Then
     For row = 0 To DataList.Size-1
       Dim R(NumberOfColumns), str As String
       mapData = DataList.Get(row)
       For Col = 0 To NumberOfColumns - 1
         str = mapData.Get(Headers(Col))
         If str <> Null Then
           R(Col) = str
           If AutomaticWidths Then
             DataWidths(Col) = Max(DataWidths(Col), cvs.MeasureStringWidth(str, Typeface.DEFAULT, cTextSize) + ExtraWidth)
             ColumnWidths(Col) = Max(HeaderWidthsCopy(Col), DataWidths(Col))
           End If
         Else
           R(Col) = ""
         End If
       Next
       AddRow(R)
     Next
   End If
     
   If AutomaticWidths Then
     SetColumnsWidths(ColumnWidths)
     pnlTable.Visible = True
   End If
End Sub

How I use it ?
Note: The JSON response that my server gives back contains two object arrays, the first is "columns", which gives me the column names, the second is "data", which gives me the data for each column.
Sample JSON data:

B4X:

{
  columns: [
  "actiondate",
  "action",
  "machinename",
  "ip"
  ],
  data: [
  {
  actiondate: "2015-09-01 21:19:46",
  action: "THEACTION",
  machinename: "AMACHINE",
  ip: "555.55.555.55"
  }
  ],
  ok: 1,
  error: {
  context: "",
  code: 0,
  description: ""
  }
}

Sub JobDone code:

B4X:

'gtblSignals is "Dim gtblSignals As Table" in Sub Globals
Sub SetupGrid(plstCols As List)
   gtblSignals.Initialize(Me, "gtblSignals", plstCols.Size,Gravity.LEFT,False)
   gtblSignals.AddToActivity(pnlTable, 0, 0, pnlTable.Width, pnlTable.Height)
   gtblSignals.HeaderColor = Colors.RGB(100, 100, 140)
   gtblSignals.HeaderTextColor = Colors.White
   gtblSignals.RowColor2 = Colors.RGB(200,200,220)
End Sub

Sub JobDone(poJob As HttpJob)
   Dim JSON As JSONParser
   Dim mapData As Map
   Dim mapNav  As Map
   Dim lstRows As List
   Dim lstCols As List
   Dim i As Int
   
   If poJob.Success = False Then
  Log("Error: " & poJob.ErrorMessage)
  ToastMessageShow("Error: " & poJob.ErrorMessage, True)
     poJob.Release
     Return
   End If

   If poJob.JobName = JOBNAME_SLIST Then
     'We've got the json list
     Try
       JSON.Initialize(poJob.GetString())
       mapData = JSON.NextObject
       Log("mapData ok: " & mapData.Get("ok"))
       If mapData.Get("ok")=1 Then
         'Set grid columns
         lstCols = mapData.Get("columns")
         If lstCols.IsInitialized And lstCols.Size > 0 Then
           SetupGrid(lstCols)
           lstRows = mapData.Get("data")
           gtblSignals.LoadFromJSONList(lstRows, lstCols, True)
         Else
           ToastMessageShow("No data", True)
         End If
       Else
         ToastMessageShow("The request failed", True)
       End If
     Catch
       Log("Error parsing server response.")
       Log(LastException.Message)
     End Try
   End If
   
   poJob.Release
End Sub

Kanne · Oct 8, 2015

Hi,
I'm just starting to program an APP using LoadSQLiteDB.
In the Routine "LoadSQLiteDB" there was no code for regarding custom-Fonts but by calling "SetAutomaticWidths" after filling the table it could be solved. (note: .hide should be called after "SetAutomaticWidths" !).
But there was still a problem: I could not find a routine to changed the header's typeface to custom !
Can't I see it or isn't it there ?
I solved this by changing the code in the "SetHeader" but still wondering that noone else has this problem ...

B4X:

' :JK START: set custom typeface for header

If MultiTypeFace = False Then

L.Typeface = cTypeFace

Else

L.Typeface = cTypeFaces(col)

End If

' :JK END

Next questions:
how is it possible to center the whole table in the view ?
at least I should know the hor. size of all visible columns for doing that in source ...

klaus · Oct 9, 2015

I solved this by changing the code in the "SetHeader" but still wondering that noone else has this problem ...

I suppose that not many people are using different Typefaces.
It will be added in the next update.

how is it possible to center the whole table in the view ?

Don't you use horizontal scrolling?

at least I should know the hor. size of all visible columns for doing that in source

If you don't hide columns you can call GetColumnWidths whitch returns an array with the width values.
Otherwise you would need to declare ColumnWidths to Public to get the current widths.

Kanne · Oct 9, 2015

Scrolling works fine, but if the table is smaller than the Panel.width I want to Center it within the Panel

klaus · Oct 9, 2015

That's a bit more complicated because you need to change the code in the class, either:
- to claculate a none zero Left position for the first Label in the SetHeader routine to move the table.
- to change the ScrollView2D position.

Kanne · Oct 9, 2015

I added a small function "GetColumnWidthsTotal" which returns the sum of the SavedWidths().
With that value I can adjust the table within my activity - in the example the table is centered as long as it is smaller than 100%x ... works fine, because hor. scrolling is kept alive (when greater than 100%x)
So I could build an activity to show an overview of records returned by any SQL-Staement; I hide the first column (which in my case is always the primary key) and pass it to the according edit-activity when selecting a table-entry or clicking the "add"-button.

B4X:

Public Sub GetColumnWidthsTotal As Int
    Dim iTotal As Int
    iTotal = 0
    For i = 0 To NumberOfColumns - 1
        iTotal = iTotal + SavedWidths(i)
    Next
    Return iTotal
End Sub

B4X:

Sub FillTable
    Dim Query As String
    Query = Main.sAuswahl
    Table1.ClearAll
    Table1.LoadSQLiteDB(Main.SQL1, Query, True)
    Table1.SetAutomaticWidths
    Table1.hideCol(0)
    Table1.Left = Max((100%x - Table1.GetColumnWidthsTotal)/2,0)
End Sub

The three screeshots are showing different calls without any code added to the activity !

B4X:

        Case "Spieler"
             sAuswahl = "SELECT * FROM Spielerstamm ORDER BY Name_Spieler"
             sEdtActivity = "SpielerEdit"
             StartActivity("Auswahl")
        Case "Regeln"
             sAuswahl = "SELECT * FROM Regeln ORDER BY Name_Regel"
             sEdtActivity = "RegelnEdit"
             StartActivity("Auswahl")
        Case "Saison"
             sAuswahl = "SELECT * FROM Saison ORDER BY ID_Saison DESC"
             sEdtActivity = "SaisonEdit"
             StartActivity("Auswahl")

Kanne · Oct 9, 2015

@franchsesko:

you can allways call "SetAutomaticWidths" AFTER filling the table;
automatic is done only in several Subs (eg LoadLoadSQLiteDB) but also works by manual call
(I used it for recalcing because using custom font)

B4X:

    Table1.LoadSQLiteDB(Main.SQL1, Query, True)
    Table1.SetAutomaticWidths
    Table1.hideCol(0)

joneden · Oct 15, 2015

Hi All,

This looks like a great class. I need to enhance it to do two things. Firstly I need to be able to have a column display an image based off some calculation on a cell. I was hoping to supply a function reference that is called to generate specify the image on a per row basis. Then either use a proper image or preferably simply use a MSIconicDrawable icon.

I'd also like to be able to apply a conditional formatting on a row by row basis. Using the same mechanism of calling a function.

Has anyone tried this sort of thing as yet?

It doesn't help that I am trying to do this with a material type appearance !

Thanks for any help,

Jon

klaus · Oct 15, 2015

The Table Class doesn't support image display in any cell, it is not designed for this.
The cells are Labels.
Having different properties for each row would need a deep change in the Class.
You may consider the CustomListView Class.

joneden · Oct 15, 2015

Hi Klaus

Yeah that's the one I used to use but have found it quite slow when dealing with a lot of data. I like the simplicity of this one. I'll have a play with the row highlighting - I may be able to make it work.

Regards

Jon

Edit. I've managed to get custom row highlighting working but it's really too much of a change from the core. I think that I'll have another stab at the other one and maybe implement some form of paging to it to control the size of the grid.

syncmaster13 · Nov 29, 2015

Thank you for this library. Great work.
Last time I used it , it was 1.29 version and today I decided to update to the newest one and right away I have a problem with
" LoadSQLiteDB_Custom_Widths " error. What happen to this Subroutine? I was using it to fill rows to screen width.

And I always had an issue with adMob and Table library. I don't know if I'm the only one having this problem but it seems
that tables are not visible after adds get refreshed. I'm sure it has something to do with ads because without ads tables
display results without a problem.

B4A Library [Class] Flexible Table

Attachments

Well-Known Member

Expert

Well-Known Member

Expert

Well-Known Member

Expert

Well-Known Member

Member

Expert

Member

Member

Expert

Member

Expert

Member

Attachments

Member

Active Member

Expert

Active Member

Member

Similar Threads