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 · Jul 16, 2012

You will need to use a ScrollView instead of a ListView. You can then handle the ScrollChanged event to synchronize the two lists.

You can use the new CustomListView class which is based on ScrollView.

Mahares · Jul 16, 2012

I loaded the first column data into an array of labels and added the labels to a scrollview per Erel's advice as opposed to using a listview to keep it as the first column. But I could not figure out how to synchronize the labels scrollview and the table scrollview that I created with the help of the ScrollView2D class. How do you use the ScrollChanged event so, when the table scrolls, the first column scrollview automatically scrolls the same amount to keep the list synchronized in both scrollviews.
Thank you

Informatix · Jul 16, 2012

Mahares said:
I loaded the first column data into an array of labels and added the labels to a scrollview per Erel's advice as opposed to using a listview to keep it as the first column. But I could not figure out how to synchronize the labels scrollview and the table scrollview that I created with the help of the ScrollView2D class. How do you use the ScrollChanged event so, when the table scrolls, the first column scrollview automatically scrolls the same amount to keep the list synchronized in both scrollviews.
Thank you

svFixedCol.VerticalScrollPosition = PosY in your ScrollChanged event

Informatix · Jul 16, 2012

Mahares said:
I loaded the first column data into an array of labels and added the labels to a scrollview per Erel's advice as opposed to using a listview to keep it as the first column. But I could not figure out how to synchronize the labels scrollview and the table scrollview that I created with the help of the ScrollView2D class. How do you use the ScrollChanged event so, when the table scrolls, the first column scrollview automatically scrolls the same amount to keep the list synchronized in both scrollviews.
Thank you

I think there's a better solution:
1) Use only one scrollview
2) Fill a panel with the content of your fixed column
3) In your scrollchanged event, add:
if PosX > 0 then
pnlFixedCol.Left = PosX
end if

The panel will move vertically automatically (it's a child of the Scrollview) and horizontally with the bit of code added in the event (we try to keep it always on the left side of the ScrollView).

Mahares · Jul 16, 2012

svFixedCol.VerticalScrollPosition = PosY in your ScrollChanged event

I tried to enter the following code in my main module, but it would not work. Obviously, I am not understanding your explanation.

B4X:

'Myscv is the vertical scrollview in main module.
'It is the stationary scrollview that has the 1st column data of a SQLlite table.
Dim Myscv as Scrollview
Sub Myscv_ScrollChanged(Position As Int)  
     Myscv.VerticalScrollPosition = PosY
             'Position=PosY
End Sub

Thank you very much in advance for any clarifications.

Informatix · Jul 16, 2012

You said you were using ScrollView2D, so I gave an answer for this library. You cannot do what you want to do with the standard ScrollView, except if you do it with the panel solution I gave.

Mahares · Jul 16, 2012

Here is what I did: I got rid of the scrollview I created in the main module.
With the use of the ScrollView2D class module, I created 2 ScrollView2D tables adjacent to each other. The one to the left stationary (scrolls vertically only) has only one column of a SQLite table data. The second one has several columns of the same SQLite table data and scrolls both directions. When the program opens up, both tables look as one, with the fields matching. How can I make one of the two tables scroll vertically and automatically the same distance as the other table I just scrolled?

@infomatix: I modeled my project after the example that Klaus created in post #22 of this thread. It uses your great library and a class module along with a main module. That is probably why I am not communicating well my situation.
http://www.b4x.com/forum/additional...ew-supports-tables-any-size-3.html#post111926

Thank you

Informatix · Jul 17, 2012

1) ScrollView2D is a library, not a class.
2) Don't use the standard ScrollView to synchronize with a ScrollView2D. They do not run the same code when you change the vertical scroll position. ScrollView do a smooth scroll, ScrollView2D goes directly to the position.
3) I modified the Erel's class to show you how to add a fixed column. I added a new function: SynchronizeWith. Try the uploaded file.
By the way, I made SetColumnsWidths easier to maintain and I fixed a bug introduced by Klaus (the header left position was wrong when the table was not on the left side).
4) There's a bug in my example. If you scroll past several dozens of lines, the layout becomes weird. I have not enough time to find why.

Mahares · Jul 17, 2012

4) There's a bug in my example. If you scroll past several dozens of lines, the layout becomes weird. I have not enough time to find why.

Thank you Informatix for taking the time to add the fixed column feature. I have included a picture of the distorted grid in the tables in the sample you included in you latest post. In addition, the column headings do not match with the data underneath them after you scroll few times. I could not figure it out either. The distortion is even more pronounced in the project I am working on.
If there is no solution to this, it behooves us to revert back to Klaus class module example method in post #22 which works very well, albeit without a fixed column, but I can live without the fixed column feature.
Again thank you very much for a great ScrollView2D library and the efforts you are putting to help all of us.

Cor · Jul 18, 2012

Csv Separator

I have version 1.21

Could there be a cvs column separator property
Now I have to change it manually in the module.

Also when I place the table in a panel and if the table is larger then the panel
I cannot scroll vertically

thanks

Cor · Jul 18, 2012

alignment for each column

Could there be an aligment for each column?

using now version table 1.21 with scrollview2d 1.03

Cor · Jul 18, 2012

REQ: tableview 1.21 with scrollview2d

to set typeface and alignment for each cell

thanks

Erel · Jul 19, 2012

All the labels are created in this code:

B4X:

Private Sub CreateNewLabels As Label()
   Dim lbls(NumberOfColumns) As Label
   For I = 0 To NumberOfColumns - 1
      Dim rc As RowCol
      rc.Col = I
      Dim l As Label
      l.Initialize("cell")
      l.Gravity = Alignment
      l.TextSize = FontSize
      l.TextColor = FontColor
      l.Tag = rc
      lbls(I) = l
   Next
   Return lbls
End Sub

It should be quite simple to modify it and change the alignment and typeface of each column.

Cor · Jul 19, 2012

Thanks Erel,

I know that,

But i want this in a 'official update' because i need then adjust my existing code

every time a new update arises.

Informatix · Jul 19, 2012

Mahares said:
Thank you Informatix for taking the time to add the fixed column feature. I have included a picture of the distorted grid in the tables in the sample you included in you latest post. In addition, the column headings do not match with the data underneath them after you scroll few times. I could not figure it out either. The distortion is even more pronounced in the project I am working on.
If there is no solution to this, it behooves us to revert back to Klaus class module example method in post #22 which works very well, albeit without a fixed column, but I can live without the fixed column feature.
Again thank you very much for a great ScrollView2D library and the efforts you are putting to help all of us.

I found a workaround. Replace the first loop in ScrollChanged by the following code:

B4X:

   Dim HeaderMoved As Boolean
   For i = 0 To NumberOfColumns - 1
      v = Header.GetView(i)
      If v.IsInitialized Then
         If v.Left <> -PosX + TotalWidth Then
            v.Left = -PosX + TotalWidth
            HeaderMoved = True
         End If
         TotalWidth = TotalWidth + v.Width + 1dip
      Else
         Exit
      End If
   Next
   If HeaderMoved Then
      Dim lbls() As Label
      For i = 0 To visibleRows.Size - 1
         lbls = visibleRows.GetValueAt(i)
         For lbl = 0 To lbls.Length - 1
            lbls(lbl).Left = Header.GetView(lbl).Left + PosX
         Next
      Next
   End If

Mahares · Jul 19, 2012

I was able to figure out where to put the new code after working with it. Thank you so much. I started testing. So far it looks good. I will work with it for a little bit and report back to you.
Thank you very much

Informatix · Jul 19, 2012

Mahares said:
I am not sure what you mean by first loop. I tried all kind of combinations, the code does not even compile. I think your best bet is to include the full code you have in the:
...
This way, we will not misss anything. There was a TotalWidth var not declared anywhere.
Thank you

I think you're not looking at the code I posted here.

Mahares · Jul 19, 2012

I corrected my previous post. You were right. I was looking in the wrong place. I have had so many revisions of the TABLE and SCROLLVIEW2D class modules projects and samples, that I did not know whether I was coming or going.
I knew, you were not going to give up. I am going to continue the testing and also, try to apply it to my main project which is different from the sample project in these threads. I will definitely report back to you.
Thank you very much.

Mahares · Jul 19, 2012

@Informatix: I tested your latest changes to the TABLE class module extensively, which entails locking (freezing) the first column of a table scroll as the text scrolls horizontally. It looks great. I did not notice any distortion. It is working the way it should. It rivals Excel's 'Freeze panes' feature. Hopefully, other users will concur.
Thank you very much for your perseverance. I think you are going to be an asset to Erel and Klaus.

Informatix · Jul 20, 2012

Mahares said:
Thank you very much for your perseverance. I think you are going to be an asset to Erel and Klaus.

You're welcome.

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

Attachments

B4X founder

Expert

Expert

Expert

Expert

Expert

Expert

Expert

Attachments

Expert

Attachments

Active Member

Active Member

Active Member

B4X founder

Active Member

Expert

Expert

Expert

Expert

Expert

Expert

Privacy & Transparency

Privacy & Transparency