B4J Library [B4X] [XUI] SD FlexGrid (Table)

I created a new library to show a table (or grid) similar to the one in EXCEL.

There are already excellent classes that allow many to accomplish things, such as xCustomListView by @Erel (B4X) and with the FlexibleTable by @klaus (B4A)

I wanted to make something slightly different suited to my needs.

Explanations:
  1. To get the calculation of the cells that contain a formula I have added Erel's B4XEval to my Library, but as soon as possible I will make it external so that everyone can modify it according to their needs.
  2. To select multiple cells, position yourself on the first cell of those to be selected (the one at the top left) click a shot and then click again and drag your finger to cover all the cells (or area) that you want to select
  3. It is still in beta version, presents problems in large grids.
  4. Now only for B4A and B4i Now for B4A,B4i,B4j
  5. In the example to select a group of cells just long click on a cell (not checkbox). In the case of B4J click with the right mouse button

SD_FlexGrid

Author:
Star-Dust
Version: 0.22
  • Eval
    version 2.00
    Eval Method By Erel: https://www.b4x.com/android/forum/threads/b4x-eval-expressions-evaluator.54629/
    • Fields:
      • Error As Boolean
    • Functions:
      • Calculate (Expression As String) As Double
      • Class_Globals As String
      • Initialize (FG As FlexGrid) As String
      • IsInitialized As Boolean
        Verifica se l'oggetto sia stato inizializzato.
  • FlexGrid
    • Events:
      • CellClick (Row As Int, Col As Int)
      • CellLongClick (Row As Int, Col As Int)
      • HeadClick (Index As Int)
      • Modified (Row As Int, Col As Int)
    • Fields:
      • TypeButton As Int
      • TypeCheck As Int
      • TypeDouble As Int
      • TypeFloat As Int
      • TypeImage As Int
      • TypeInt As Int
      • TypeList As Int
      • TypeString As Int
    • Functions:
      • AddRow (Cell As Object(), Refresh As Boolean) As String
        eg. Flexgrid.AddRow(Array As Object(i,B,"User ","Description " ,100.00), True)
      • AddRow2 (Cell As Object(), HeightRow As Int, Refresh As Boolean) As String
        eg. Flexgrid.AddRow(Array As Object(i,B,"User ","Description " ,100.00),40dip,True)
      • AddRowAt (index As Int, Cell As Object(), Refresh As Boolean) As String
        eg. Flexgrid.AddRow(2,Array As Object(i,B,"User ","Description " ,100.00), True)
      • AddRowCustomize (Cell As Object(), Text_Color As Int, Background_Color As Int, TextFont As B4XFont, Refresh As Boolean) As String
      • AddToParent (Parent As B4XView, Left As Int, Top As Int, Width As Int, Height As Int, ColsNumber As Int) As String
        Parent is Panel to Add Grid
        eg. Flexgrid.AddToParent(Activity,0,0,100%x,100%y,5)
      • Class_Globals As String
      • ClearRows As String
        erase all rows contents
      • ClearSelection As String
        cell no longer be selected.
      • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
        Base type must be Object
      • EditCell (Row As Int, Col As Int) As String
        eg. Flexgrid.EditCell(1,1)
      • EditCellOnSite (Row As Int, Col As Int) As String
        eg. Flexgrid.EditCell(1,1)
      • GetCellBackgroundColor (Row As Int, Col As Int) As Int
      • GetCellCol (Col As Int) As Object()
        eg. Dim S() as String = Flexgrid.GetCellCol(1)
        eg. Dim B() as Boolean = Flexgrid.GetCellCol(2)
      • GetCellRow (Row As Int) As Object()
        eg Dim Row() as Object = Flexgrid.GetCellRow(1)
      • GetCellTextColor (Row As Int, Col As Int) As Int
      • GetCellTextFont (Row As Int, Col As Int) As B4XFont
      • GetCellValue (Row As Int, Col As Int) As Object
        eg. Dim I as int = Flexgrid.GetCellValue(1,1)
        eg. Dim S as String = FlexGrid.GetCellValue(2,2)
      • GetTypeCol (Col As Int) As Int
        eg. If Flexgrid.GetTypeCol(1)=Flexgrid.TypeInt Then .....
      • Initialize (Callback As Object, EventName As String) As String
      • Invalidate As String
      • IsInitialized As Boolean
        Verifica se l'oggetto sia stato inizializzato.
      • RemoveRow (Row As Int)
        Row (0...n-1)
        eg. Flexgrid.RemoveRow(1)
      • ResetCustomizeCell (Col As Int, Row As Int) As String
        eg. Flexgrid.ResetCustomizeCell(1,1)
      • SearchInColumn (Text As String, Col As Int, FromRow As Int, exactly As Boolean, IgnoreCap As Boolean) As Int
        Search for text in the indicated column starting from the start row.
        If the start row is 0 it will check the entire column.
        It will return the position of the line containing the text
        <code>Dim Col As Int = 5
        Dim Row As Int = FlexGied1.SearchInColumn("My text",Col,0, False, True)
        if Row>-1 then Log("Find in row " & Row) Else log("Don't find")
        </code>
      • SelectCell (Row As Int, Col As Int, Mobile As Boolean) As String
        eg. Flexgrid.SelectCell(1,1,True)
        If Mobile is True, the selectable area can be enlarged by touching and dragging it to the desired box.
      • SelectCells (FromRow As Int, FromCol As Int, ToRow As Int, ToCol As Int, Mobile As Boolean) As String
        eg. Flexgrid.SelectCell(1,1,5,4,True)
        If Mobile is True, the selectable area can be enlarged by touching and dragging it to the desired box.
      • SelectCol (Col As Int) As String
        eg. Flexgrid.SelectCol(1)
      • SelectRow (Row As Int) As String
        eg. Flexgrid.SelectRow(1)
      • SetCellCustomize (Row As Int, Col As Int, Text_Color As Int, Background_Color As Int, TextFont As B4XFont) As String
        eg. Flexgrid.SetCellCustomize(1,1,XUI.Color_Black,XUI.Color_White,XUi.CreateDefaultFont(12))
      • SetCellListIndex (Row As Int, Col As Int, Index As Int) As String
      • SetCellValue (Row As Int, Col As Int, Value As Object) As String
        eg. Flexgrid.SetCellValue(1,1,True)
        eg. Flexgrid.SetCellValue(2,2,"OK")
        eg. Flexgrid.SetCellValue(3,3,3)
        eg. Flexgrid.SetCellValue(Row,Col,"A,B,C,D,E") for TypeList
      • SetColAlignment (ColumnIndex As Int, Alignment As String) As String
        Index (0..n-1)
        eg. SetColAlignment(0,"CENTER")
      • SetColCustomize (Col As Int, Text_Color As Int, Background_Color As Int, TextFont As B4XFont) As String
        eg. Flexgrid.SetColCistomize(1,XUI.Color_Black,XUI.Color_White,XUi.CreateDefaultFont(12))
      • SetColName (ColumnIndex As Int, Name As String) As String
        Index (0..n-1)
        eg. Flexgrid.SetColName(1,"Help")
      • SetColsNumber (ColumnNumber As Int) As String
        Reset Grid and Change Cols Number
      • SetColType (ColumnIndex As Int, Typ As Int) As String
        Index (0..n-1)
        eg. SetColType(0,FlexGrid.TypeInt)
      • SetColWidth (ColumnIndex As Int, Width As Int) As String
        Index (0..n-1)
        eg. SetColWidth(0,100dip)
      • SetRowCustomize (Row As Int, Text_Color As Int, Background_Color As Int, TextFont As B4XFont) As String
        eg. Flexgrid.SetRowCustomize(1,XUI.Color_Black,XUI.Color_White,XUi.CreateDefaultFont(12))
      • SetRowHeight (IndexRow As Int, Height As Int) As String
        IndexRow (0..Size-1)
        eg. setRowHeight(0,60dip)
    • Properties:
      • Base As B4XView [read only]
      • ColCount As Int [read only]
      • ColsAlignment
        eg. setColsAlignment(Array As String ("LEFT","CENTER","CENTER","RIGHT"))
      • ColsName As String()
        eg. Flexgrid.ColName=array As String ("First","Second")
      • ColsType
        eg. ColsType=Array As Int(FlexGrid1.TypeInt,FlexGrid1.TypeCheck,FlexGrid1.TypeString,FlexGrid1.TypeString,FlexGrid1.TypeFloat)
      • ColsWidth
        eg. SetColsWìdth(Array As Int (100dip,50dip,100dip,100dip))
      • Font
        eg. Flexgrid.Font=xui.CreateDefaultFont(12)
      • HeaderFont
        eg. Flexgrid.HeaderFont=xui.CreateDefaultFont(12)
      • RowCount As Int [read only]
        Dim Size as int = Flexgrid.RowCount
      • ScrollToRow
        eg. Flexgrid.ScroolToRow=50
      • SelectedColumnEnd As Int [read only]
        return -1 if not selected
      • SelectedColumnStart As Int [read only]
        return -1 if not selected
      • SelectedRowEnd As Int [read only]
        return -1 if not selected
      • SelectedRowStart As Int [read only]
        return -1 if not selected
  • OrderData
    • Fields:
      • Added As Int
      • Index As Int
      • IsInitialized As Boolean
        Verifica se l'oggetto sia stato inizializzato.
      • Level As Int
    • Functions:
      • Initialize
        Inizializza i campi al loro valore predefinito.
  • ParsedNode
    • Fields:
      • IsInitialized As Boolean
        Verifica se l'oggetto sia stato inizializzato.
      • Left As ParsedNode
      • NodeType As Int
      • Operator As String
      • Right As ParsedNode
      • Value As Double
    • Functions:
      • Initialize
        Inizializza i campi al loro valore predefinito.


Video1.gif
Video2.gif
Video4.gif

Video5.gif
Video6.gif
Video3.gif


For more details: https://www.b4x.com/android/forum/threads/xui-flexgrid.98686/[/I]
 

Attachments

  • B4A Sample.zip
    31 KB · Views: 324
  • B4i Sample.zip
    24.2 KB · Views: 143
  • B4j Sample.zip
    23.9 KB · Views: 246
  • iSD_FlexGrid 0.23.zip
    492.9 KB · Views: 53
  • aSD_FlexGrid 0.23.zip
    29 KB · Views: 83
  • jSD_FlexGrid 0.23 bis.zip
    29.8 KB · Views: 50
Last edited:

mohsyn

Member
@Star-Dust great lib !!!

Some questions for you
Is it possible ...
1. to hide columns? (not delete - we can refer to them programmatically but they are not displayed)
2. for Grid to be opened as read only - except checkbox should respond to user inputs
3. for Row header to be invisible
4. for cell to expand on double tap and resize when focus is moved to another cell
 

Star-Dust

Expert
Licensed User
Update rel 0.15
  • Added HeaderFont property to change the header font
  • Added example to post # 2 on how to populate the grid from a db
 
Last edited:

Star-Dust

Expert
Licensed User
Update rel. 0.16
  • Added SetColsNumber method. Allows you to set the number of columns by code. When the number of columns is set, the grid will be cleared.
 

Star-Dust

Expert
Licensed User
@Star-Dust great lib !!!

Some questions for you
Is it possible ...
1. to hide columns? (not delete - we can refer to them programmatically but they are not displayed)
2. for Grid to be opened as read only - except checkbox should respond to user inputs
3. for Row header to be invisible
4. for cell to expand on double tap and resize when focus is moved to another cell
  1. You can set the column width to 0dip and it will be invisible
  2. I'm not sure I understand what you want
  3. You can do it from Design
    1624994985589.png
  4. I don't understand what it's for. In B4A and B4J you can edit in an enlarged box with the EditCell command
 

qle

Member
Licensed User
Hi,
Great library, Thanks, (donated)

i have one issue, and that it seems last row is not added

B4X:
      .
    FlexGrid1.ColsName=Array As String("Size","Qty")
    FlexGrid1.ColsWidth=Array As Int(50dip,48dip)
    FlexGrid1.ColsType=Array As Int(FlexGrid1.TypeString,FlexGrid1.TypeString)
    FlexGrid1.ColsAlignment=Array As String("RIGHT","LEFT")
    FlexGrid1.SetColCustomize(0,xui.Color_Black  ,xui.Color_RGB(255,255,255),xui.CreateDefaultFont(14))
    FlexGrid1.SetColCustomize(0,xui.Color_Blue   ,xui.Color_RGB(255,255,255),xui.CreateDefaultFont(14))

    For i=1 To 100
        Log("adding: B" &i&", "&i)
        FlexGrid1.AddRow(Array As Object("B" &i&" "," "&i),True)
    Next

log shows 'adding: B100, 100'
grid last row shows only 99

Lee.
 

Star-Dust

Expert
Licensed User
I guess you're talking about B4A.
Download update 0.16 again and you shouldn't have the problem
 
Last edited:

qle

Member
Licensed User
Hi,
Sorry, yes B4A
I had already installed 0.16,

i have now done it again to make sure, still no change

Adding 10 rows
B4X:
    For i=1 To 10
        Log("adding: B" &i&", "&i)
        FlexGrid1.AddRow(Array As Object("B" &i&" "," "&i),True)
    Next

it shows
flexgrid.PNG


But, if i add the FlexGrid1_CellClick, and tap a cell, then the last row appears
I have attached my test project

Note: The version in the SD_FlexGrid.xml is still 15 (but the FlexGrid1.SetColsNumber now exists)
<version>0.15</version>
<author>Star-Dust</author>

Lee
 

Attachments

  • Project.zip
    15.4 KB · Views: 23

Star-Dust

Expert
Licensed User
Sorry I sent an old version by mistake. Now I have renamed it to 0.17. I think you have no problems this way
 

qle

Member
Licensed User
Hi,
Thank you, that fixed the issue.

I now have another problem trying to use SetRowCustomize

If i use
B4X:
     FlexGrid1.SetRowCustomize(0,xui.Color_Blue,xui.Color_LightGray,xui.CreateDefaultFont(14))

I get error java.lang.ClassCastException: anywheresoftware.b4a.objects.ActivityWrapper$AllViewsIterator cannot be cast to android.view.View


Lee.
 

Star-Dust

Expert
Licensed User
Hi,
Thank you, that fixed the issue.

I now have another problem trying to use SetRowCustomize

If i use
B4X:
     FlexGrid1.SetRowCustomize(0,xui.Color_Blue,xui.Color_LightGray,xui.CreateDefaultFont(14))

I get error java.lang.ClassCastException: anywheresoftware.b4a.objects.ActivityWrapper$AllViewsIterator cannot be cast to android.view.View


Lee.
I tried your code and it didn't raise the error you report to me. Can you post another example where this error reproduces?

It could be an error with your source, because the error indicates that you are trying to assign a list to a View.
 

Star-Dust

Expert
Licensed User
Update rel 0.18
  1. fixbugs of SetRowCustomize
 

mohsyn

Member
I was asking if whole table can be set to "read only" with only exception of columns which have checkboxes


I don't understand what it's for. In B4A and B4J you can edit in an enlarged box with the EditCell command

Ability to view full content of a cell by clicking on it (it zooms up) and goes back to normal when clicked elsewhere (focus lost)
 

Star-Dust

Expert
Licensed User
I was asking if whole table can be set to "read only" with only exception of columns which have checkboxes
Basically they are all read-only except the CkecBox.

To make them editable, you must insert the editing activation in the Click or LongClick event with the EditCellonsite or EditCell command. But if you do not enter it all remain read-only

B4X:
Sub FlexGrid1_CellClick(Row As Int, Col As Int)
    If Col=0 Then
        FlexGrid1.SelectRow(Row)
    Else
        Select FlexGrid1.GetTypeCol(Col)
            Case FlexGrid1.TypeInt
                 ' edit cell
                FlexGrid1.EditCellonsite(Row,Col) '   <--------------- Delete this line
            Case FlexGrid1.TypeString
                 ' edit cell
                FlexGrid1.EditCellonsite(Row,Col) '   <--------------- Delete this line
        End Select
    End If
End Sub

or
B4X:
Sub FlexGrid1_CellClick(Row As Int, Col As Int)
         FlexGrid1.SelectRow(Row)
End Sub


Ability to view full content of a cell by clicking on it (it zooms up) and goes back to normal when clicked elsewhere (focus lost)
This function don't exists
 
Last edited:

Star-Dust

Expert
Licensed User
IMPORTANT UPDATE

Update 0.19
  • Add method AddRowCustomize (Cell As Object(), Text_Color As Int, Background_Color As Int, TextFont As B4XFont, Refresh As Boolean) As String
    Adds a row with custom graphics formatting
  • Add method SearchInColumn (Text As String, Col As Int, FromRow As Int, exactly As Boolean, IgnoreCap As Boolean) As Int
    Search for text in the indicated column starting from the start row.
    If you set exactly as true it will search for the box that contains exactly that expression if set to false it will check if the expression is contained in the box

Example AddRowCustomize
B4X:
Dim B As boolean = False
For i=11 To 100
   B=Not(B)
   If b Then
       FlexGrid1.AddRowCustomize(Array As Object("B" & i,i,B,"User " & i,Null,Rnd(50,1000)/10),xui.Color_Black,0xFFFFFFFF,xui.CreateDefaultFont(16),True)
   Else
       FlexGrid1.AddRowCustomize(Array As Object("B" & i,i,B,"User " & i,Null,Rnd(50,1000)/10),xui.Color_Black,0xFF44FF44,xui.CreateDefaultFont(16),True)
   End If
Next


Example SearchInColumn
B4X:
Dim rw As Int = FlexGrid1.SearchInColumn("User 10",3,0,True,True)
If rw>-1 Then FlexGrid1.SelectCell(rw,3,False)
Log("Find :" & rw)
 
Last edited:

Star-Dust

Expert
Licensed User
In the future I plan to insert the following methods:
  • SearchInAllColumn: To search all columns
  • FilterView: To display only the lines that correspond to certain parameters described in the filter, for example display only the lines where there is a certain text
 
Top