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

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.

SS-2012-07-04_10.38.01.png


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.
 

Attachments

  • Table.zip
    14.9 KB · Views: 7,945
Last edited:

Mahares

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

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

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

Expert
Licensed User
Longtime User
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.
 

Mahares

Expert
Licensed User
Longtime User
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
 
Last edited:

Informatix

Expert
Licensed User
Longtime User
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.
 

Attachments

  • TableWithFixedCol.zip
    16.1 KB · Views: 556

Mahares

Expert
Licensed User
Longtime User
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.
 

Attachments

  • TableWithFixedColumn071712.png
    TableWithFixedColumn071712.png
    87.6 KB · Views: 464

Cor

Active Member
Licensed User
Longtime User
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

Active Member
Licensed User
Longtime User
alignment for each column

Could there be an aligment for each column?

using now version table 1.21 with scrollview2d 1.03
 

Cor

Active Member
Licensed User
Longtime User
REQ: tableview 1.21 with scrollview2d

to set typeface and alignment for each cell

thanks
 

Erel

B4X founder
Staff member
Licensed User
Longtime User
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

Active Member
Licensed User
Longtime User
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

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

Expert
Licensed User
Longtime User
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
 
Last edited:

Mahares

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

Expert
Licensed User
Longtime User
@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.
 
Top