Android Question Applying Lazy Loading to xCustomListView with Imageviews Bitmap Files

Discussion in 'Android Questions' started by Mahares, Jan 9, 2019.

  1. Mahares

    Mahares Well Known Member Licensed User

    I am not sure I am Applying Lazy Loading effectively in xCustomListView with Imageviews. The xCLV has 4 columns of imageviews. Below each imageview is a label showing the bitmap file as shown in screenshot. When I create the xCLV with 100 records, it is ok although scrolling is not smooth, but crashes if more records (of course crash occurs depending on number of records and memory of device). The bitmap files to load the imageviews range from 5 to 11 KB in size each. Here is the majority of the useful code:

    Code:
    Sub Activity_Create(FirstTime As Boolean)       
        MyList.Initialize
        MyList=
    Array ("p1.jpg","p2.jpg","p3.jpg","p4.jpg","p5.jpg","p6.jpg")
        
    Activity.LoadLayout("layMain")    'has CustomListView1 only
        For i = 1 To 100   'works no out of memory error. In one device it crashed with less than 100
    '    For i = 1 To 150  'crashed OOM
    '    For i = 1 To 120    'crashed OOM
            CustomListView1.Add(CreateMyPhotoList(MyList),i)
        
    Next
    End Sub

    Sub CreateMyPhotoList(l As ListAs B4XView
        
    Dim p As B4XView = xui.CreatePanel("carthage")  'carthage is the event name
        p.SetLayoutAnimated(000, CustomListView1.AsView.Width, 130dip)
        p.LoadLayout(
    "Item")    'has 4 imageviews and 4 Labels as shown in screenshot
        Dim iv(4As B4XView = Array As B4XView(iv1,iv2,iv3,iv4)
        
    Dim lbl(4As Label=Array As Label(lbl1,lbl2,lbl3, lbl4)
        
    For j=0 To iv.Length-1
            
    Dim f As String=l.Get(Rnd(0,6))  'random bitmap file
            iv(j).SetBitmap(xui.LoadBitmapResize(File.DirAssets, f, iv(j).Width, iv(j).Height, False))
            
    Dim cd As ColorDrawable
            cd.Initialize(
    Colors.RGB(255,255,200),10dip)
            lbl(j).Background=cd
            lbl(j).Text=f
            lbl(j).TextColor=
    Colors.Black
            lbl(j).TextSize=
    20
            lbl(j).Tag=j
        
    Next
        
    Return p
    End Sub

    Sub CustomListView1_VisibleRangeChanged (FirstIndex As Int, LastIndex As Int)
        
    Dim ExtraSize As Int = 20
        
    For i = 0 To CustomListView1.Size - 1
            
    Dim p As B4XView = CustomListView1.GetPanel(i)
            
    If i > FirstIndex - ExtraSize And i < LastIndex + ExtraSize Then
                
    'visible+
                If p.NumberOfViews = 0 Then
                    p.LoadLayout(
    "item")
                    
    Dim iv(4As B4XView = Array As B4XView(iv1,iv2,iv3,iv4)
                    
    Dim lbl(4As Label=Array As Label(lbl1,lbl2,lbl3, lbl4)
                    
    For j=0 To iv.Length-1
                        
    Dim f As String=MyList.Get(Rnd(0,6))
                        iv(j).SetBitmap(xui.LoadBitmapResize(
    File.DirAssets, f, iv(j).Width, iv(j).Height, False))
                        
    Dim cd As ColorDrawable
                        cd.Initialize(
    Colors.White,10dip)
                        lbl(j).Background=cd
                        lbl(j).Text=f
                        lbl(j).TextColor=
    Colors.Black
                        lbl(j).TextSize=
    20
                    
    Next
                
    End If
            
    Else
                
    If p.NumberOfViews > 0 Then
                    p.RemoveAllViews
                
    End If
            
    End If
        
    Next
    End Sub
     

    Attached Files:

  2. Erel

    Erel Administrator Staff Member Licensed User

    File size not important. Only the image dimensions are important.

    Your code is not using lazy loading correctly. The bitmaps are the heavy resource. You need to only load the bitmaps when needed. I will prepare an example...
     
  3. Erel

    Erel Administrator Staff Member Licensed User

    [​IMG]

    The attached example lazy loads 1000 items with 1000 images.
    The bitmaps are added and removed as needed. It can be further optimized by reusing the items views. It will not add much as the items are very simple (ImageView and a Label).

    If you comment the code that removes the invisible bitmaps the list will quickly become very slow.

    Note that you should test it in release mode or after cleaning the project.
     

    Attached Files:

    • 1.zip
      File size:
      66.1 KB
      Views:
      146
  4. Erel

    Erel Administrator Staff Member Licensed User

Loading...
  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice