Android Tutorial Creating a table view based on ScrollView

A much improved version is available here.

You can use the code in this example to show data in tabular form.

The table is made of two main views. The header row is made of a panel with labels. The main cells component is made of a ScrollView with labels as the cells.

You can modify the code to change the table appearance.
Some of the settings can be changed in Sub Globals:

    'Table settings
    HeaderColor = Colors.Gray
    NumberOfColumns = 4
    RowHeight = 30dip
    TableColor = Colors.White
    FontColor = Colors.Black
    HeaderFontColor = Colors.White
    FontSize = 14

Adding data to the table:

    'add header
    SetHeader(Array As String("Col1", "Col2", "Col3", "Col4"))
    'add rows
    For i = 1 To 100
        AddRow(Array As String(i, "Some text", i * 2, "abc"))
    Next
    'set the value of a specific cell
    SetCell(0, 3, "New value")
    'get the value 
    Log("Cell (1, 2) value = " & GetCell(1, 2))

Table events:

Sub Cell_Click
    Dim rc As RowCol
    Dim l As Label
    l = Sender
    rc = l.Tag
    activity.Title = "Cell clicked: (" & rc.Row & ", " & rc.Col & ")"
End Sub
Sub Header_Click
    Dim l As Label
    Dim col As Int
    l = Sender
    col = l.Tag
    Activity.Title = "Header clicked: " & col
End Sub

The code is not too complicated and you can further customize it as needed.

 

[junaidahmed]

Can not Clear Record in Table

This examples is fine but can not clear existing record when populating new record.pls advise

 

[Erel]

What do you mean with clearing existing record?

 

[junaidahmed]

Should not append Record when populate another dataset,So we need to clear (Delete) existing record before poupulating new dataset.

 

[Erel]

Do you want to remove a single row or all rows?
To remove all rows you can use:

Sub ClearAll
    For i = Table.NumberOfViews -1 To 0 step -1
        Table.RemoveViewAt(i)
    Next
    Table.Height = 0
End Sub

 

[junaidahmed]

Thanks for your quick replay

 

[Erel]

LoadCSV and SaveCSV added. This is included in TableExample1.1.zip in the first post.
This is done using the new StringUtils library.

 

[junaidahmed]

I have seen the Tabular example using StringUtil library it works fine,if you update Gridline that will become an Grid like in Basic4PPC.so please try to update the Gridline method.Please revert back soon.

 

[junaidahmed]

still you have not updated gridline for tabluar view,pls update ASAP

 

[Erel]

I don't think that it will be added in the near future.

 

[kickaha]

When I tried this out and added some more data, the fullscroll (to the bottom) stopped one short of all the entries. Is this a bug or am I missing something?

All I did was add a button, the click event of which was

Sub Button1_Click
AddRow(Array As String(number, "Some text", number * 2, "abc"))   
number=number+1
SV.FullScroll (True)
End Sub

 

[Erel]

Can you see the last row? Is it only the scrolling that doesn't get to the last row?

 

[klaus]

I just tried it, it's only the scrolling.
It seems that the OS executes SV.FullScroll(True) before adjusting the Scrollview height.
Adding a DoEvents before SV.FullScroll(True) solves the problem.

[FONT=Courier New][SIZE=2][COLOR=#0000ff]
[SIZE=2][FONT=Courier New][COLOR=#0000ff][SIZE=2][FONT=Courier New][COLOR=#0000ff]Sub [/COLOR][/FONT][/SIZE][/COLOR][/FONT][/SIZE][/COLOR][/SIZE][/FONT][FONT=Courier New][SIZE=2][FONT=Courier New][SIZE=2]btnAdd_Click[/SIZE][/FONT]
[SIZE=2][FONT=Courier New] AddRow([/FONT][/SIZE][/SIZE][/FONT][FONT=Courier New][SIZE=2][COLOR=#0000ff][FONT=Courier New][SIZE=2][COLOR=#0000ff][FONT=Courier New][SIZE=2][COLOR=#0000ff]Array[/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][FONT=Courier New][SIZE=2][COLOR=#0000ff][FONT=Courier New][SIZE=2][COLOR=#0000ff][FONT=Courier New][SIZE=2][COLOR=#0000ff]As[/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][FONT=Courier New][SIZE=2][COLOR=#008b8b][FONT=Courier New][SIZE=2][COLOR=#008b8b][FONT=Courier New][SIZE=2][COLOR=#008b8b]String[/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][FONT=Courier New][SIZE=2][FONT=Courier New][SIZE=2]([/SIZE][/FONT][/SIZE][/FONT][FONT=Courier New][SIZE=2][COLOR=#800000][FONT=Courier New][SIZE=2][COLOR=#800000][FONT=Courier New][SIZE=2][COLOR=#800000]"Test"[/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][FONT=Courier New][SIZE=2][FONT=Courier New][SIZE=2], [/SIZE][/FONT][/SIZE][/FONT][FONT=Courier New][SIZE=2][COLOR=#800000][FONT=Courier New][SIZE=2][COLOR=#800000][FONT=Courier New][SIZE=2][COLOR=#800000]"Some text"[/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][FONT=Courier New][SIZE=2][FONT=Courier New][SIZE=2], [/SIZE][/FONT][/SIZE][/FONT][FONT=Courier New][SIZE=2][COLOR=#800000][FONT=Courier New][SIZE=2][COLOR=#800000][FONT=Courier New][SIZE=2][COLOR=#800000]"76.3"[/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][FONT=Courier New][SIZE=2][FONT=Courier New][SIZE=2], [/SIZE][/FONT][/SIZE][/FONT][FONT=Courier New][SIZE=2][COLOR=#800000][FONT=Courier New][SIZE=2][COLOR=#800000][FONT=Courier New][SIZE=2][COLOR=#800000]"-23"[/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][FONT=Courier New][SIZE=2][FONT=Courier New][SIZE=2])) [/SIZE][/FONT]
[/SIZE][/FONT][FONT=Courier New][SIZE=2][COLOR=#0000ff][FONT=Courier New][SIZE=2][COLOR=#0000ff][FONT=Courier New][SIZE=2][COLOR=#0000ff] DoEvents[/COLOR][/SIZE][/FONT]
[/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][FONT=Courier New][SIZE=2][FONT=Courier New][SIZE=2] SV.FullScroll([/SIZE][/FONT][/SIZE][/FONT][FONT=Courier New][SIZE=2][COLOR=#0000ff][FONT=Courier New][SIZE=2][COLOR=#0000ff][FONT=Courier New][SIZE=2][COLOR=#0000ff]True[/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][FONT=Courier New][SIZE=2][FONT=Courier New][SIZE=2])[/SIZE][/FONT][/SIZE][/FONT]
[FONT=Courier New][SIZE=2][COLOR=#0000ff][FONT=Courier New][SIZE=2][COLOR=#0000ff][FONT=Courier New][SIZE=2][COLOR=#0000ff]End Sub[/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT]

I tried also adding SV.FullScroll(True) at the end of Sub LoadTableFromCSV, and it doesn't scroll at all.
Addign DoEvents before SV.FullScroll(True), it works well.

Best regards.

 

[Erel]

It makes sense. The views do not layout themselves immediately.

 

[kickaha]

Thanks Klaus, I will give that a try.

 

[chrisf]

Is it possible to have two lines of data per row?

I have a query against a database and need to display more details than I have room for on teh screen in the table view?

Thanks in advance

 

[klaus]

Yes, you can create almost whatever you want.
Have a look at ScrollView Examples Summary, there several examples of tables and databases.
You could set 2 Labels one on top of the other instead side by side.

Best regards.

 

[chrisf]

Thanks for the speedy reply. Much appreciated.

 

[hzimmer3]

Table with scrollview with horizontal scrolling

I am new to Basic4Android and I have just studied the TableExample1.2 which is interesting for reading a csv-table.
However I wonder how I can get the scrollview table to scroll horizontally in case the csv-table is wider than the screen width.
I have set the list width to 200%x but I cannot find out how I can get the
scrollview to scroll horizontally.

Is there a property which I need to set?

Any advise would be much appreciated,

Helmut
Cologne/Germany

 

[hzimmer3]

Table with scrollview with horizontal scrolling

I am new to Basic4Android and have just studied the TableExample1.2 which
I find very interesting for reading csv-tables.
However I wonder how I can arrange that the scrollview is able to scroll horizontally in case that the csv-table is wider than the screen width.

I have set the list width to 200%x but cannot find a way to enable horizontal scrolling in the list.

Is there a property which I need to set?

Any advise would be much appreciated,

Regards

Helmut
Cologne/Germany