Android Tutorial ListView tutorial

Erel · Nov 7, 2010

Don't use ListView.
Use xCustomListView - it is more powerful, easier to work with and cross platform.

Augustinas Impalis · Apr 18, 2014

klaus said:
You can change the properties Left, Top, Width and Height of all three views in the ListView items.
ListView1.TwoLinesAndBitmap.Label.Top etc
ListView1.TwoLinesAndBitmap.SecondLabel.Top etc
ListView1.TwoLinesAndBitmap.Bitmap.Top etc
Make sure that ListView1.TwoLinesAndBitmap.ItemHeight is set according to the heights of the internal views.

I get an error message saying unknown member: bitmap

B4X:

ListView1.TwoLinesAndBitmap.ItemHeight = 200dip
ListView1.TwoLinesAndBitmap.Bitmap.Height = 50

klaus · Apr 18, 2014

Sorry, it's ListView1.TwoLinesAndBitmap.ImageView and not ListView1.TwoLinesAndBitmap.Bitmap.

Augustinas Impalis · Apr 18, 2014

klaus said:
Sorry, it's ListView1.TwoLinesAndBitmap.ImageView and not ListView1.TwoLinesAndBitmap.Bitmap.

Thank you Klaus.. can you give me some guidance? i am trying to display a list of 5 images with description in the code below, however when i run it it makes 5 copies of each picture instead of displaying 5 number 1 -5.

B4X:

Sub Activity_Create(FirstTime As Boolean)
    ListView1.Initialize("ListView1")
    Dim GD As GradientDrawable
    GD.Initialize("TR_BL", Array As Int(Colors.White, Colors.LightGray))
    Activity.Background = GD
    ListView1.ScrollingBackgroundColor = Colors.Transparent
    Dim Bitmap1 As Bitmap
    Bitmap1.Initialize(File.DirAssets, "Pic1.jpg")
    Dim Bitmap2 As Bitmap
    Bitmap2.Initialize(File.DirAssets, "Pic2.jpg")
    Dim Bitmap3 As Bitmap
    Bitmap3.Initialize(File.DirAssets, "Pic3.jpg")
    Dim Bitmap4 As Bitmap
    Bitmap4.Initialize(File.DirAssets, "Pic4.jpg")
    Dim Bitmap5 As Bitmap
    Bitmap5.Initialize(File.DirAssets, "Pic5.jpg")
   
    ListView1.TwoLinesAndBitmap.ItemHeight = 160dip
    ListView1.TwoLinesAndBitmap.ImageView.Height = 150dip
    ListView1.TwoLinesAndBitmap.ImageView.Width = 150dip
    ListView1.TwoLinesAndBitmap.Label.Gravity = Gravity.CENTER
    ListView1.TwoLinesAndBitmap.Label.TextColor = Colors.Blue
    ListView1.TwoLinesAndBitmap.SecondLabel.Gravity = Gravity.CENTER
    ListView1.TwoLinesAndBitmap.SecondLabel.TextColor = Colors.Cyan
   
    ListView1.SingleLineLayout.ItemHeight = 100dip
    ListView1.SingleLineLayout.Label.TextSize = 20
    ListView1.SingleLineLayout.Label.TextColor = Colors.Blue
    ListView1.SingleLineLayout.Label.Gravity = Gravity.CENTER
    ListView1.FastScrollEnabled = True
    For i = 1 To 5
        ListView1.AddTwoLinesAndBitmap("Machine #" & i, "This is the second line.", Bitmap1)
        ListView1.AddTwoLinesAndBitmap("Machine #" & i, "This is the second line.", Bitmap2)
        ListView1.AddTwoLinesAndBitmap("Machine #" & i, "This is the second line.", Bitmap3)
        ListView1.AddTwoLinesAndBitmap("Machine #" & i, "This is the second line.", Bitmap4)
        ListView1.AddTwoLinesAndBitmap("Machine #" & i, "This is the second line.", Bitmap5)
       
    Next       
    Activity.AddView(ListView1, 0, 0, 100%x, 100%y)
End Sub

DonManfred · Apr 18, 2014

B4X:

Sub Activity_Create(FirstTime As Boolean)
    ListView1.Initialize("ListView1")
    Dim GD As GradientDrawable
    GD.Initialize("TR_BL", Array As Int(Colors.White, Colors.LightGray))
    Activity.Background = GD
    ListView1.ScrollingBackgroundColor = Colors.Transparent
    Dim Bitmap1 As Bitmap
    Bitmap1.Initialize(File.DirAssets, "Pic1.jpg")
    Dim Bitmap2 As Bitmap
    Bitmap2.Initialize(File.DirAssets, "Pic2.jpg")
    Dim Bitmap3 As Bitmap
    Bitmap3.Initialize(File.DirAssets, "Pic3.jpg")
    Dim Bitmap4 As Bitmap
    Bitmap4.Initialize(File.DirAssets, "Pic4.jpg")
    Dim Bitmap5 As Bitmap
    Bitmap5.Initialize(File.DirAssets, "Pic5.jpg")
 
    ListView1.TwoLinesAndBitmap.ItemHeight = 160dip
    ListView1.TwoLinesAndBitmap.ImageView.Height = 150dip
    ListView1.TwoLinesAndBitmap.ImageView.Width = 150dip
    ListView1.TwoLinesAndBitmap.Label.Gravity = Gravity.CENTER
    ListView1.TwoLinesAndBitmap.Label.TextColor = Colors.Blue
    ListView1.TwoLinesAndBitmap.SecondLabel.Gravity = Gravity.CENTER
    ListView1.TwoLinesAndBitmap.SecondLabel.TextColor = Colors.Cyan
 
    ListView1.SingleLineLayout.ItemHeight = 100dip
    ListView1.SingleLineLayout.Label.TextSize = 20
    ListView1.SingleLineLayout.Label.TextColor = Colors.Blue
    ListView1.SingleLineLayout.Label.Gravity = Gravity.CENTER
    ListView1.FastScrollEnabled = True
    ListView1.AddTwoLinesAndBitmap("Machine #1", "This is the second line.", Bitmap1)
    ListView1.AddTwoLinesAndBitmap("Machine #2", "This is the second line.", Bitmap2)
    ListView1.AddTwoLinesAndBitmap("Machine #3", "This is the second line.", Bitmap3)
    ListView1.AddTwoLinesAndBitmap("Machine #4", "This is the second line.", Bitmap4)
    ListView1.AddTwoLinesAndBitmap("Machine #5", "This is the second line.", Bitmap5)
    Activity.AddView(ListView1, 0, 0, 100%x, 100%y)
End Sub

Augustinas Impalis · Apr 18, 2014

DonManfred said:

B4X:

Sub Activity_Create(FirstTime As Boolean)
    ListView1.Initialize("ListView1")
    Dim GD As GradientDrawable
    GD.Initialize("TR_BL", Array As Int(Colors.White, Colors.LightGray))
    Activity.Background = GD
    ListView1.ScrollingBackgroundColor = Colors.Transparent
    Dim Bitmap1 As Bitmap
    Bitmap1.Initialize(File.DirAssets, "Pic1.jpg")
    Dim Bitmap2 As Bitmap
    Bitmap2.Initialize(File.DirAssets, "Pic2.jpg")
    Dim Bitmap3 As Bitmap
    Bitmap3.Initialize(File.DirAssets, "Pic3.jpg")
    Dim Bitmap4 As Bitmap
    Bitmap4.Initialize(File.DirAssets, "Pic4.jpg")
    Dim Bitmap5 As Bitmap
    Bitmap5.Initialize(File.DirAssets, "Pic5.jpg")

    ListView1.TwoLinesAndBitmap.ItemHeight = 160dip
    ListView1.TwoLinesAndBitmap.ImageView.Height = 150dip
    ListView1.TwoLinesAndBitmap.ImageView.Width = 150dip
    ListView1.TwoLinesAndBitmap.Label.Gravity = Gravity.CENTER
    ListView1.TwoLinesAndBitmap.Label.TextColor = Colors.Blue
    ListView1.TwoLinesAndBitmap.SecondLabel.Gravity = Gravity.CENTER
    ListView1.TwoLinesAndBitmap.SecondLabel.TextColor = Colors.Cyan

    ListView1.SingleLineLayout.ItemHeight = 100dip
    ListView1.SingleLineLayout.Label.TextSize = 20
    ListView1.SingleLineLayout.Label.TextColor = Colors.Blue
    ListView1.SingleLineLayout.Label.Gravity = Gravity.CENTER
    ListView1.FastScrollEnabled = True
    ListView1.AddTwoLinesAndBitmap("Machine #1", "This is the second line.", Bitmap1)
    ListView1.AddTwoLinesAndBitmap("Machine #2", "This is the second line.", Bitmap2)
    ListView1.AddTwoLinesAndBitmap("Machine #3", "This is the second line.", Bitmap3)
    ListView1.AddTwoLinesAndBitmap("Machine #4", "This is the second line.", Bitmap4)
    ListView1.AddTwoLinesAndBitmap("Machine #5", "This is the second line.", Bitmap5)
    Activity.AddView(ListView1, 0, 0, 100%x, 100%y)
End Sub

Thank you!

macguiwer · Apr 22, 2014

hello, it is possible to place different background colors on different items?
thank you!

DonManfred · Apr 22, 2014

macguiwer said:
hello, it is possible to place different background colors on different items?

Yes and no.
Yes, you can set an background to "All one-line-items".
Yes, you can set an background to "All two-line-items".
Yes, you can set an background to "All two-line-items with bitmaps".
No, you cannot set a background ONLY for one or more spezific items.

macguiwer · Apr 22, 2014

DonManfred said:
Yes and no.
Yes, you can set an background to "All one-line-items".
Yes, you can set an background to "All two-line-items".
Yes, you can set an background to "All two-line-items with bitmaps".
No, you cannot set a background ONLY for one or more spezific items.

best regard

little3399 · Jun 8, 2014

tks!

klaus · Jun 8, 2014

Yes, but for all TwoLinesAndBitmap layouts.

B4X:

ListView1.TwoLinesAndBitmap.ImageView.Left = ListView1.Width - ListView1.TwoLinesAndBitmap.ImageView.Width
ListView1.TwoLinesAndBitmap.Label.Left = 0
ListView1.TwoLinesAndBitmap.Label.Width = ListView1.TwoLinesAndBitmap.ImageView.Left
ListView1.TwoLinesAndBitmap.SecondLabel.Left = 0
ListView1.TwoLinesAndBitmap.SecondLabel.Width = ListView1.TwoLinesAndBitmap.ImageView.Left

little3399 · Jun 9, 2014

Hi Klaus

Where these code can be placed ? Would you give me a complete example ? tks!

Because I add these code in the ListView example, it show this error

and here is my code ....

klaus · Jun 10, 2014

Sorry, I hadn't tested it.
Replace the code you added by this:

B4X:

ListView1.TwoLinesAndBitmap.ImageView.Left = 100%x - 50dip
ListView1.TwoLinesAndBitmap.Label.Left = 0
ListView1.TwoLinesAndBitmap.Label.Width = 100%x - 50dip
ListView1.TwoLinesAndBitmap.SecondLabel.Left = 0
ListView1.TwoLinesAndBitmap.SecondLabel.Width = 100%x - 50dip

little3399 · Jun 10, 2014

Tks , Klaus , It running perfect

nemethv · Jun 13, 2014

Hi guys,

I have a listview that is reading off from a local sqlite file, it's using a cursor and the listview is done in the Designer.

Let's say I've coded that if someone clicks on an item on the list the item gets deleted from the sqlite table.
How do I get to reread the data and redo the listview once the table has been updated without finishing the activity? (that's an option, but it's a bit awkward...)

Thanks

Erel · Jun 15, 2014

You can use ListView.RemoveAt to remove an item from the list.

You can also clear all items and fill the list again. You do not need to reload the activity for that.

Levisvv · Aug 2, 2014

I am using a basic listview, works fine with a white background.
But I do not see any row separator bars as shown in the examples.
How can I see these? Is it because they are white? if so then how can I change the color of the lines that separate rows.

Here's a snipet of my code:

B4X:

StorList.TwoLinesLayout.Label.TextColor=Colors.Black
    StorList.TwoLinesLayout.Label.TextSize=14
    StorList.TwoLinesLayout.SecondLabel.TextSize=12
    StorList.TwoLinesLayout.ItemHeight=70dip
    StorList.AddTwoLines(CAMqty.SelectedItem & " camera(s): " & CAMres.SelectedItem  & ", " & VIDcompression.selecteditem & " @" & FPSqty.SelectedItem & "FPS", StorageDays.SelectedItem & " Days Storage = " & StorageSpace.Text & "GB, " & Bandwidth.Text & "Mbit/s" )

little3399 · Aug 2, 2014

You can modify the AndroidManifest.xml targetSdkVersion change to 10 , maybe be can see the line

klaus · Aug 2, 2014

You can change the background color with StorList.Color = Color.Black

Levisvv · Aug 2, 2014

It is not the color I am trying to get/change, it is the horizontal lines that separate each list item.

The idea from little3399 worked, when I changed this in the Manifest:
android:targetSdkVersion="14" to android:targetSdkVersion="10"
I could see the bars, but that also changed the formatting of many many other items, most of which I did not like. Is there a better way to get these bars back?

klaus · Aug 2, 2014

You need to 'play' with the colors and the dimensions of the labels.

B4X:

Sub Globals
    Dim ltvTest1, ltvTest2 As ListView
End Sub

Sub Activity_Create(FirstTime As Boolean)
    Activity.LoadLayout("main")
    InitListView
End Sub

Sub InitListView
    Dim i As Int
    Dim LineWidth = 3dip  As Int
    Dim LineWidth_2 = Max(1, LineWidth / 2)
    ltvTest2.SingleLineLayout.Label.Left = LineWidth
    ltvTest2.SingleLineLayout.Label.Width = ltvTest2.Width - 2 * LineWidth
    ltvTest2.SingleLineLayout.Label.Top = LineWidth_2
    ltvTest2.SingleLineLayout.Label.Height = ltvTest2.SingleLineLayout.ItemHeight - LineWidth_2
    ltvTest2.SingleLineLayout.Label.Color = Colors.White
    ltvTest2.SingleLineLayout.Label.TextColor = Colors.Black
  
    For i = 0 To 20
        ltvTest1.AddSingleLine("Test "& i)
        ltvTest2.AddSingleLine("Test "& i)
    Next
End Sub

Attached a small test program.
The top ListView has the default values, the text is even not visible. That's the problem with the 'new' layouts.
The bottom ListViews has the properties changed.

Android Tutorial ListView tutorial

Member

Expert

Member

Expert

Member

Member

Expert

Member

Active Member

Expert

Active Member

Expert

Active Member

Member

B4X founder

Member

Active Member

Expert

Member

Expert

Attachments

Similar Threads

Privacy & Transparency

Privacy & Transparency