B4A Library [Class] TableView - Supports tables of any size

Erel · Jul 4, 2012

An improved version of this class is available here: http://www.b4x.com/forum/additional...icial-updates/30649-class-flexible-table.html

The Table class allows you to show tables of any sizes. The views (labels) are reused to avoid creating many views.

With the help of StringUtils the table can be loaded and saved to a CSV file. It shouldn't be difficult to show SQL tables using DBUtils.ExecuteMemoryTable.

Follow the attached example to see how the class is used. To add it to your own project you need to add the class module to your project and add a reference to StringUtils library.

RemoveRow code is available here: http://www.b4x.com/forum/showpost.php?p=146795&postcount=147

V1.10 uploaded. New method: SetColumnsWidths. Allows you to manually set the width of each column
V1.11 uploaded. Fixes a bug with grey stripes appearing.

Erel · Jan 30, 2013

You can add the Table to a panel added with the designer. The table will fill the designer so it will be "auto scaled".

The other things that you scale are:
- FontSize
- RowHeight

There are two possible ways to do it. You can use a Label added with the designer as the base size for these two properties or you can use Klaus AutoScale module which allows you to programmatically scale views / values.

BasicBert · Feb 9, 2013

I use Klaus' Table class with the addition of Melamoud and am enjoying it. :icon_clap:
I load my CSV-file into the table, which is on a panel (Let's call it pnlTable).
The panel is set to visible when the user asks for it by clicking on a button.

When a row gets selected, it will be marked as such.
After selecting a row, the data in the row gets displayed on another panel (pnlDetail), where the user can scroll up and down through the table, showing the data of the selected row.

Then, when the user clicks the button "Return" the pnlTable will be shown again by making it visible again. The last selected row will be displayed as the first row of pnlTable (by jumping to it).

This works fine, but I would like this row to appear in the table now as if the user clicked on this row (with the same selection-color).

How can I do that ?
:sign0163:

melamoud · Feb 10, 2013

if you are trying to "force" selection of a row programatically, I think you just need to call selectRow sub (it is private, so you need to make it pubic first)

it use a type RowCol that hold the row number and the column number,

let me know if that helped

Prosg · Feb 11, 2013

if we have a BLOB field in a database (picture) is it possible to have a picture in table ?

B4X:

Table1.AddRow(Array As String("Row: " & i, myPicture, "ddd", "eee"))

i try Table1.AddRow(Array as Object.... But error

Erel · Feb 11, 2013

No.
You can show the image when the user presses on the cell.

Prosg · Feb 11, 2013

like in a imageview outside the table ? or in the table ?

BasicBert · Feb 11, 2013

melamoud said:
if you are trying to "force" selection of a row programatically, I think you just need to call selectRow sub (it is private, so you need to make it pubic first)

it use a type RowCol that hold the row number and the column number,

let me know if that helped

:sign0142: Yes!
This is what I was looking for. I was thinking that selectRow would do the job, but I had no idea how to call it. Private to Public and the type RowCol wasn't that obvious to me.

Thanks a lot.

Erel · Feb 12, 2013

like in a imageview outside the table ?

The Table doesn't support images. You will need to show it in an ImageView.

CharlesR · Feb 14, 2013

Erel said:
The Table doesn't support images. You will need to show it in an ImageView.

I am just starting to use classes so please forgive my simple question.

I am trying to load 2 tables. One has 10 columns and the other has 7 columns. I can load either in both panels but when I try to load one in each I get "wrong number of variables" as an error for the lower panel. What am I doing wrong or do both panels have to have the same number of columns?

Thanks in advance.

klaus · Feb 14, 2013

How do you initialize the tables ?
Without seeing your code, impossible to give you a concrete answer.

Best regards.

CharlesR · Feb 14, 2013

klaus said:
How do you initialize the tables ?
Without seeing your code, impossible to give you a concrete answer.

Best regards.

I have not changed the code from the downloaded example as I am trying to understand the example before integrating it into my project. If I load the same file in both lines it works. All I have done is place a 7 col csv in the loadcsv1 and a 10 col csv in loadcsv2? I am sure I have missed something simple.

Thanks

LoadTableFromCSV1(File.DirAssets, "sortedsavings.csv", True)

LoadTableFromCSV2(File.DirAssets, "summarysavings.csv", True)

klaus · Feb 14, 2013

What are these lines ?
LoadTableFromCSV1(File.DirAssets, "sortedsavings.csv", True)
LoadTableFromCSV2(File.DirAssets, "summarysavings.csv", True)

In the Table Class there is only one LoadTableFromCSV routine.
You must show much more code so we could help you !

Best regards.

melamoud · Feb 14, 2013

If you are trying to build two tables you need to create two tables objects and on each call the load from csv sub
And not creating one table and call two subs...

Without the full code I'm just guessing that this us what your code look like...

CharlesR · Feb 14, 2013

klaus said:
What are these lines ?
LoadTableFromCSV1(File.DirAssets, "sortedsavings.csv", True)
LoadTableFromCSV2(File.DirAssets, "summarysavings.csv", True)

In the Table Class there is only one LoadTableFromCSV routine.
You must show much more code so we could help you !

Best regards.

Thanks Klaus

I see now that the 2 options depend of whether or not a header is present in the one csv file. I had mistakenly assumed that they refered to the upper and lower tables in the example.

I will continue with my learning process.

Regards

Charles
:signOops:

CharlesR · Feb 15, 2013

Clearing tables and headers

klaus said:
What are these lines ?
LoadTableFromCSV1(File.DirAssets, "sortedsavings.csv", True)
LoadTableFromCSV2(File.DirAssets, "summarysavings.csv", True)

In the Table Class there is only one LoadTableFromCSV routine.
You must show much more code so we could help you !

Best regards.

Hi Klaus

I have spent the day learning your version of the 2D scrolling table display and have got on well, but have one very simple question. Is there a simple way to clear the current tables from the screen. I have used table1.clearall and table2.clearall, but the headers remain.

Sorry for yet another simple question but I am getting there.

Thanks

klaus · Feb 15, 2013

You can change the ClearAll routine to:

B4X:

Public Sub ClearAll
    innerClearAll(NumberOfColumns)
    Header.RemoveAllViews
End Sub

Be aware that the Header panel will remain visible.

Best regards.

CharlesR · Feb 15, 2013

klaus said:
You can change the ClearAll routine to:

B4X:

Public Sub ClearAll innerClearAll(NumberOfColumns) Header.RemoveAllViews End Sub

Be aware that the Header panel will remain visible.

Best regards.

Thank you very much Klaus.

Smee · Feb 18, 2013

I am trying to add a table to a panel in the AHViewPager example.

B4X:

'This creates a page of the given type
Sub CreatePanel(PanelType As Int, Title As String) As Panel
   Dim pan As Panel
   Dim pi As PanelInfo
   
   pi.Initialize
   pi.LayoutLoaded = False
   pi.PanelType = PanelType

   pan.Initialize("")
   Select PanelType
      Case TYPE_HELLO_WORLD
         Dim lab As Label
         pan.Color = Colors.RGB(Rnd(0, 150), Rnd(0,150), Rnd(0,150))
         lab.Initialize("")
         lab.Text = Title
         lab.TextSize = 16
         lab.Gravity = Gravity.CENTER
         pan.AddView(lab, 0, 0, FILL_PARENT, 100%y)
      Case TYPE_LISTVIEW
         Directories.Initialize("Directories")
         pan.AddView(Directories, 0, 0, 100%x, 100%y)

      Case TYPE_PURCHASES
         Dim Cursor As Cursor
         pan.AddView(tblOrders, 0, 51%y, 100%x, 49%y)
         

         tblOrders.Initialize(Me, "tblOrders", ColumnCount,1)
            
         tblOrders.SetHeader(Col_Name)
         tblOrders.SetColumnsWidths(Array As Int(200dip, 1, 70dip, 70dip,70dip, 70dip, 70dip))
         
   End Select 
   
   pan.Tag = pi
   Return pan
End Sub

i am not getting past this statement
pan.AddView(tblOrders, 0, 51%y, 100%x, 49%y)

obviously the code is incorrect so how do i add it to the panel?

Erel · Feb 18, 2013

You need to call:

B4X:

tblOrders.AddToActivity(pan, ...)

gregwa · Feb 18, 2013

I ran into a problem yesterday that caused me to scratch my head all night long. I hope that this will keep others from stumbling through this like I did.

I have a panel (let's call it 'pnlTable') that I place the table object into.

B4X:

TableTasks.Initialize(Me,"TableTasks",6)
   TableTasks.AddToActivity(pnlTable,0,0dip,100%x,100%y)

Now the panel has the following parameters (running on a 10 inch tablet in landscape mode...
.width = 970
.height = 400

When I add data to the table and we get to the point when the data goes past the bottom of the table, you can't scroll the table data. That is, until I add probably 30 more items. Then it will scroll, but you can't see the last 10 or so items.

I finally fixed the problem with the following code modifications to my code.

B4X:

TableTasks.AddToActivity(pnlTable,0,0dip,pnlTable.Width,pnlTable.Height)

Now the table scrolls up and down correctly.

I seems that the width and height parameters are being taken from the activity, not the panel. That was my bad, not the coding of the table class.

As I said at the top, I hope that this keeps someone else from beating their heads on the keyboard for hours trying to figure out why this happens.

B4A Library [Class] TableView - Supports tables of any size

Attachments

B4X founder

Member

Active Member

Active Member

B4X founder

Active Member

Member

B4X founder

Member

Expert

Member

Expert

Active Member

Member

Member

Expert

Member

Well-Known Member

B4X founder

Member

Similar Threads

Privacy & Transparency

Privacy & Transparency