B4A Library [B4X] B4XTable - Cross platform, sortable, searchable, customizable table

Discussion in 'Additional libraries, classes and official updates' started by Erel, Feb 5, 2019.

Thread Status:
Not open for further replies.
  1. Erel

    Erel Administrator Staff Member Licensed User

    B4XTable is a paged based table. The UI is made of a horizontal xCLV. The data is stored in an in-memory SQLite database.

    Dependencies:
    XUI Views must be selected in the libraries tab.

    [​IMG]

    How to use?

    1. Add a B4XTable with the designer.
    2. Add the columns:
    Code:
    B4XTable1.AddColumn("US County", B4XTable1.COLUMN_TYPE_NUMBERS)
    B4XTable1.AddColumn(
    "Name", B4XTable1.COLUMN_TYPE_TEXT)
    There are currently three types: TEXT, NUMBERS and DATES.
    3. Set the data:
    Code:
    Dim data As List = su.LoadCSV2(File.DirAssets, "us_counties.csv"",", headers)
    B4XTable1.SetData(data)
    Data is a list. Each item in the list is an array of objects that represents a row.
    Example
    Code:
    Dim data As List
    data.Initialize
    data.Add(
    Array(123))
    data.Add(
    Array(456))
    B4XTable1.SetData(data)
    When you call SetData the an in-memory db is created with the data.

    CellClick event

    Code:
    Sub B4XTable1_CellClicked (ColumnId As String, RowId As Long)
       
    Dim RowData As Map = B4XTable1.GetRow(RowId)
       
    Dim cell As String = RowData.Get(ColumnId)
       
    Log(cell)
    End Sub
    B4XTable.GetRow returns a Map with the row data. The row values are mapped to the columns ids.
    Tip: You can access the visible row ids with B4XTable.VisibleRowIds.

    Customization

    Many things can be customized. Will start with a few simple things.
    B4XTable.AddColumn returns a B4XTableColumn type instance. You can modify this type to change the column behavior:
    Code:
    Dim StateColumn As B4XTableColumn = B4XTable1.AddColumn("State", B4XTable1.COLUMN_TYPE_TEXT)
    StateColumn.Width = 
    80dip
    StateColumn.Sortable = 
    False
    By default all columns are sortable and text columns are searchable.

    Other fields that you can change are: Id, Searchable, Formatter, LabelIndex and DisableAutoResizeLayout. Not all of them will be covered in this tutorial.

    You can also call GetColumn with the column id to get a column type. The id equals to the title by default (can be changed).

    Attached examples show how to set a custom B4XFormatter.

    B4XTable.VisibleColumns holds the list of displayed columns. By default all columns are displayed. You can remove columns from the list or change their order as needed. Call B4XTable.Refresh after you modify the list.

    Most of the table colors are set in the designer properties. The arrows colors are set with ArrowsEnabledColor / ArrowsDisabledColor.
    The fonts are set with HeaderFont and LabelsFont fields.

    Custom Data Filters

    You can call B4XTable.CreateDataView to create a custom filter.

    For example:
    Code:
    B4XTable1.CreateDataView($"${NumberColumn.SQLID} > 10"$)
    The parameter passed is the SQL WHERE clause. NumberColumn is a B4XTableColumn and the SQLID returns the SQL column name.
    Another example:
    Code:
    B4XTable1.CreateDataView($"${NumberColumn.SQLID} > 10 AND ${NumberColumn.SQLID} < 15"$)
    Updates

    V1.16 - Fixes an issue with frozen columns when the table is reused with new columns.
    V1.15 - New BuildQuery method. This method can be used to get the SQL query that was used to set the table data with the current state and filter. Usage example:
    Code:
    Dim o() As Object = B4XTable1.BuildQuery(False'True to include the page LIMIT in the query.
    Dim rs As ResultSet = B4XTable1.sql1.ExecQuery2(o(0), o(1))
    Do While rs.NextRow
       
    Log(rs.GetString(B4XTable1.GetColumn("State").SQLID))
    Loop
    rs.Close
    V1.10 - Fixes a bug with cell clicks on empty tables.
    V1.09 - The navigation buttons layout was fine tuned to be able to show three digits.
    V1.08 - New events: CellLongClicked and HeaderLongClicked. In B4J they fire when a cell is right clicked.
    V1.07 - NumberOfFreezedColumns field renamed to NumberOfFrozenColumns.
    V1.06 - NumberOfFreezedColumns field - allows freezing the first x columns. Set it immediately after you add the columns.
    V1.05 - HeaderClick event. Usage example: https://www.b4x.com/android/forum/threads/b4x-table.102551/#post-643333
    V1.04 - HeadersHeight field. Allows setting the headers height independently of RowHeight value.
    - AllowSmallRowHeightModifications field. By default the actual row height can be slightly different than the set RowHeight value. This is done to let the rows fill all of of the available space (except of the scroll bar in B4J).
    You can set this field to False to prevent this. This is mainly useful if you are using custom cells and want the heights to be static.
    V1.03 - Search term highlighting. Color is configurable with the designer.
    - PrefixSearch field - limits searches to prefix matches.
    - Better support for table resizing. See the updated B4A and B4i examples. The table is resized when the keyboard becomes visible.

    V1.02 - Setting the selection color to transparent color disables the cell click animation. This is useful when you want to create a custom selection logic.

    [​IMG]
    https://www.b4x.com/android/forum/threads/b4x-b4xtable-multiple-rows-selection.102364/

    V1.01 - New DataUpdated event, MaximumRowsPerPage and other changes to make it simpler to create tables with custom layouts:

    [​IMG]

    B4XTable examples and code snippets: https://www.b4x.com/android/forum/pages/results/?query=b4xtable&prefix=19,23,20,30,8,9,18,21,27

    B4XTable is an internal library. Make sure to copy it to the internal libraries folder (C:\Program Files (x86)\Anywhere Software\<product>\libraries)
     

    Attached Files:

    Last edited: Aug 7, 2019
    hibrid0, Xicu, Watchkido1 and 41 others like this.
  2. MarcoRome

    MarcoRome Expert Licensed User

    Hi Erel. I have this error:

    Code:
    'create custom filter
            B4XTable1.CreateDataView($"${NumberColumn.SQLID} > ?"$Array(10))
    Too many Parameters... seem that CreateDataView havent parameter
     
  3. MarcoRome

    MarcoRome Expert Licensed User

    When try Switch ON ----> Error: SQL(query) error or missing database.
     
  4. Erel

    Erel Administrator Staff Member Licensed User

    Wrong version of the example was uploaded. Fixed now.

    Is this the full error message?
     
  5. MarcoRome

    MarcoRome Expert Licensed User

    With NEW EXAMPLE work
     
    ShaneG30 and Erel like this.
  6. Mashiane

    Mashiane Expert Licensed User

    In the future will one be able to use custom views / layouts in a row? for example set the view data & get it also?
     
  7. AscySoft

    AscySoft Active Member Licensed User

    Is there any possibility to load data from an external source (sqlite file) and not to convert a table in a csv file just for this?
     
  8. Erel

    Erel Administrator Staff Member Licensed User

    Yes. I will post an example.

    B4XTable has nothing to do with CSV. I just used CSV as an input source in this specific example.

    You need to load the data from any source you like and set it with B4XTable.SetData.
     
    AscySoft, Mashiane and Peter Simpson like this.
  9. Erel

    Erel Administrator Staff Member Licensed User

  10. rbghongade

    rbghongade Active Member Licensed User

    How do we print the table especially in B4J?
     
  11. Erel

    Erel Administrator Staff Member Licensed User

    Please start a new thread for this in B4J question forum.
     
  12. Erel

    Erel Administrator Staff Member Licensed User

    Myr0n and MarcoRome like this.
  13. Erel

    Erel Administrator Staff Member Licensed User

    V1.03 - Search term highlighting. Color is configurable with the designer.
    - PrefixSearch field - limits searches to prefix matches.
    - Better support for table resizing. See the updated B4A and B4i examples. The table is resized when the keyboard becomes visible.

    [​IMG]
     
  14. Erel

    Erel Administrator Staff Member Licensed User

    V1.04 - HeadersHeight field. Allows setting the headers height independently of RowHeight value.
    - AllowSmallRowHeightModifications field. By default the actual row height can be slightly different than the set RowHeight value. This is done to let the rows fill all of of the available space (except of the scroll bar in B4J).
    You can set this field to False to prevent this. This is mainly useful if you are using custom cells and want the heights to be static.
     
  15. Erel

    Erel Administrator Staff Member Licensed User

  16. Erel

    Erel Administrator Staff Member Licensed User

    V1.06 - NumberOfFreezedColumns field - allows freezing the first x columns. Set it immediately after you add the columns.
     
    Pencil3 and DonManfred like this.
  17. Erel

    Erel Administrator Staff Member Licensed User

    V1.07 - NumberOfFreezedColumns field renamed to NumberOfFrozenColumns.
     
  18. Erel

    Erel Administrator Staff Member Licensed User

    V1.08 - New events: CellLongClicked and HeaderLongClicked. In B4J they fire when a cell is right clicked.
     
  19. Erel

    Erel Administrator Staff Member Licensed User

    V1.09 - The navigation buttons layout was fine tuned to be able to show three digits.
     
    Peter Simpson, Mahares and asales like this.
  20. Erel

    Erel Administrator Staff Member Licensed User

    V1.10 - Fixes a bug with cell clicks on empty tables.
     
    Alexander Stolte likes this.
Thread Status:
Not open for further replies.
Loading...
  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice