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.

WARNING
The use of libraries for personal and / or commercial use is permitted. It is not allowed to modify the sources or change the name of the library. Reverse engineering is not authorized to access the sources for any reason, not even for study or learning reasons.

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.28
  • 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)
      • ScrollX (Position As Double)
      • ScrollY (Position As Double)
    • 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) As String
        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)
      • SetHeadHeight (Height As Int) As String
        Set Header Height
      • 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)
      • SetRowsHeight (Height As Int) As String
        Set all Rows Height
    • 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
      • ScrollX As Double
      • ScrollY As Double
      • 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


Video1.gif
Video2.gif
Video4.gif

Video5.gif
Video6.gif
Video3.gif


List/Spinner
video7-gif.118379


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

Attachments

  • B4A Sample.zip
    31 KB · Views: 628
  • B4i Sample.zip
    24.2 KB · Views: 309
  • B4j Sample.zip
    23.9 KB · Views: 511
  • aSD_FlexGrid 0.28.zip
    31.7 KB · Views: 65
  • jSD_FlexGrid 0.28.zip
    32.5 KB · Views: 47
  • iSD_FlexGrid 0.28.zip
    505.5 KB · Views: 35
Last edited:

Star-Dust

Expert
Licensed User
Update 0.26
  • Fix bug.
    Fixed a bug when switching focus from one editable box to another
 

Oscarin

Member
for what purpose?
Thanks for the reply.

I have a product list on the bottom (using the library) and on the top all the product information I want the user to double-click on the grid to be able to edit the product information on the top and not on the grid itself and I try not use the click option to avoid mistakes when scrolling thought the list.
 

Star-Dust

Expert
Licensed User
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)
 

Oscarin

Member
Update 0.26
  • Fix bug.
    Fixed a bug when switching focus from one editable box to another
I get an error with this update when using
FlexGrid1.ClearRows
java.lang.IndexOutOfBoundsException: Index: 0, Size: 0
at java.util.ArrayList.get(ArrayList.java:437)
at anywheresoftware.b4a.objects.collections.List.Get(List.java:117)
at b4a.example.flexgrid._selectviewer(flexgrid.java:2456)
at b4a.example.flexgrid$ResumableSub_CreateGrid.resume(flexgrid.java:938)
at b4a.example.flexgrid._creategrid(flexgrid.java:798)
at b4a.example.flexgrid._invalidate(flexgrid.java:1919)
at b4a.example.flexgrid._clearrows(flexgrid.java:495)
at b4a.example.principal$ResumableSub_B4XPage_CloseRequest.resume(principal.java:199)
at anywheresoftware.b4a.shell.DebugResumableSub$DelegatableResumableSub.resumeAsUserSub(DebugResumableSub.java:48)
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.shell.Shell.runMethod(Shell.java:732)
at anywheresoftware.b4a.shell.Shell.raiseEventImpl(Shell.java:348)
at anywheresoftware.b4a.shell.Shell.raiseEvent(Shell.java:255)
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.ShellBA.raiseEvent2(ShellBA.java:144)
at anywheresoftware.b4a.BA.raiseEvent(BA.java:193)

PS
I do have lines of data on the FlexGrid
 

Star-Dust

Expert
Licensed User
I get an error with this update when using
FlexGrid1.ClearRows
java.lang.IndexOutOfBoundsException: Index: 0, Size: 0
at java.util.ArrayList.get(ArrayList.java:437)
at anywheresoftware.b4a.objects.collections.List.Get(List.java:117)
at b4a.example.flexgrid._selectviewer(flexgrid.java:2456)
at b4a.example.flexgrid$ResumableSub_CreateGrid.resume(flexgrid.java:938)
at b4a.example.flexgrid._creategrid(flexgrid.java:798)
at b4a.example.flexgrid._invalidate(flexgrid.java:1919)
at b4a.example.flexgrid._clearrows(flexgrid.java:495)
at b4a.example.principal$ResumableSub_B4XPage_CloseRequest.resume(principal.java:199)
at anywheresoftware.b4a.shell.DebugResumableSub$DelegatableResumableSub.resumeAsUserSub(DebugResumableSub.java:48)
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.shell.Shell.runMethod(Shell.java:732)
at anywheresoftware.b4a.shell.Shell.raiseEventImpl(Shell.java:348)
at anywheresoftware.b4a.shell.Shell.raiseEvent(Shell.java:255)
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.ShellBA.raiseEvent2(ShellBA.java:144)
at anywheresoftware.b4a.BA.raiseEvent(BA.java:193)

PS
I do have lines of data on the FlexGrid
Can you produce an example that produces the error? Why doesn't it return this error to me in my applications.
 

Oscarin

Member
Can you produce an example that produces the error? Why doesn't it return this error to me in my applications.
This is what I got in the sub

Sub B4XPage_CloseRequest As ResumableSub
If ListView1.Visible Then
ListView1.Clear
ListView1.Visible=False
Return False
End If
Dim sf As Object = xui.Msgbox2Async("¿Desea cerrar Sesión?", "", "Si", "", "No", Null)
Wait For (sf) Msgbox_Result (Result As Int)
If Result = xui.DialogResponse_Positive Then
FlexGrid1.ClearRows
Return True
End If
Return False
End Sub

Then on the logs I get
Error occurred on line: 74 (Principal)
Line 74 is
FlexGrid1.ClearRows
 

Star-Dust

Expert
Licensed User
This is what I got in the sub

Sub B4XPage_CloseRequest As ResumableSub
If ListView1.Visible Then
ListView1.Clear
ListView1.Visible=False
Return False
End If
Dim sf As Object = xui.Msgbox2Async("¿Desea cerrar Sesión?", "", "Si", "", "No", Null)
Wait For (sf) Msgbox_Result (Result As Int)
If Result = xui.DialogResponse_Positive Then
FlexGrid1.ClearRows
Return True
End If
Return False
End Sub

Then on the logs I get
Error occurred on line: 74 (Principal)
Line 74 is
FlexGrid1.ClearRows
I asked you for an example not the code, this means creating a small project that has this problem so that it can Debug.

In any case, it is not the ClearRows that produces the error, looking at the error it seems that you are simultaneously clearing you are doing a refresh of the grid or you are accessing the rows of the grid.

In the error I need to see the part starting from 'CAUSATED BY' so that the SUB that generates it is identified
 

Star-Dust

Expert
Licensed User
Update 0.27
  • added properties ScrollX and ScrollY
  • Added events ScrollX() and ScrollY()
 
Last edited:

Oscarin

Member
I asked you for an example not the code, this means creating a small project that has this problem so that it can Debug.

In any case, it is not the ClearRows that produces the error, looking at the error it seems that you are simultaneously clearing you are doing a refresh of the grid or you are accessing the rows of the grid.

In the error I need to see the part starting from 'CAUSATED BY' so that the SUB that generates it is identified
I've found what causes the error, I don't know if it is a bug or just bad programming (I don't remember from where I copied)
In my app, the user adds lines with descriptions and qty to the grid
When the user add something that is already on the grid, I add the qty to the one is already there, and I had this lines on my code
FlexGrid1.ScrollToRow=Row
FlexGrid1.SelectRow(Row)
FlexGrid1.SetCellValue(Row,2,que_cantidad)

When the user exited the app and called the
FlexGrid1.ClearRows
is when I get the error.
To fix the problem, I removed the
FlexGrid1.ScrollToRow=Row
FlexGrid1.SelectRow(Row)
And I don't get the error anymore
 

Star-Dust

Expert
Licensed User
I've found what causes the error, I don't know if it is a bug or just bad programming (I don't remember from where I copied)
In my app, the user adds lines with descriptions and qty to the grid
When the user add something that is already on the grid, I add the qty to the one is already there, and I had this lines on my code
FlexGrid1.ScrollToRow=Row
FlexGrid1.SelectRow(Row)
FlexGrid1.SetCellValue(Row,2,que_cantidad)

When the user exited the app and called the
FlexGrid1.ClearRows
is when I get the error.
To fix the problem, I removed the
FlexGrid1.ScrollToRow=Row
FlexGrid1.SelectRow(Row)
And I don't get the error anymore
I think it's a bug, I'll try to fix it in the next update
 

Oscarin

Member
Is there a way to have an automatic with of the columns?
Let's say that I have 2 columns with smaller than the width of the screen and I anchor the grid on to both sides of the screen, the grid will fill the width but I'll have a gray empty area because the width of the columns are smaller than the width of the screen
 

amorosik

Well-Known Member
Licensed User
Congratulations for the library, the closest available for the B4X environments of the famous TrueGrid
I'm trying the example for B4J, how to change the sort order according to column 3, or 2, etc?
I'm talking about what you basically do with the various dbgrids by clicking on the column title
Or to change the order, the only way is to modify the select sql?
 
Top