Android Question (Solved)Strange behavior CustomListview_VisibleRangeChanged

[Ferdari]

Hi everyone,

Im trying to do a Infinity scroll CLV.

tried almost every example of how to hide items off screen and load the visible ones, but a rare behavior came when scrolling:
Some items visible disappear on scroll, the logs catches weird hide and show items order:

Sub ServicesLV_VisibleRangeChanged (FirstIndex As Int, LastIndex As Int)
    Dim ExtraSize As Int = 15

    For i = 0 To ServicesLV.Size - 1
        Dim p As Panel = ServicesLV.GetPanel(i)
   
        If i > FirstIndex - ExtraSize And i < LastIndex + ExtraSize Then
       
            'Visible items Show
            If p.NumberOfViews = 0 Then
                Log("add lv item "& i)
           
                Dim data() As String = ServicesLV.GetValue(i)
                If Not( data(0).Contains("panel") ) Then
                    p.LoadLayout("item")
                    Try
                        'Load pub Left
                        PriceTag1.Text="$ 100"
                        PubLabel2.Text="Item 1"
                        PubImg1.Bitmap=LoadBitmapResize(File.DirAssets, "sample1.webp",200dip,200dip,True)

                        'Load pub Right
                        PriceTag2.Text="$ 100"
                        PubLabel2.Text="Item 2"
                        PubImg2.Bitmap=LoadBitmapResize(File.DirAssets, "sample2.webp",200dip,200dip,True)
                    Catch
                        Log(LastException)
                    End Try
                Else
                    Log("its a panel")
                End If
            Else
                'Not Visible items, hide
                If p.NumberOfViews > 0 Then
                    LogColor("remove lv index "& i,Colors.Yellow)
                    p.RemoveAllViews
                End If
            End If
        End If
    Next
End Sub

Im not using PCLV because i add dynamically more items on scroll from server, PCLV ignores new added items.

I cant get rid of this ¿bug?

I also notice lag when items are removed

I appreciate your help, i have weeks trying to solve this.

Example is attached

 

[Alexander Stolte]

Works if I implement lazy loading in this way, just as it is in the tutorial:

Sub ServicesLV_VisibleRangeChanged (FirstIndex As Int, LastIndex As Int)
    Dim ExtraSize As Int = 20
    For i = 0 To ServicesLV.Size - 1
        Dim p As B4XView = ServicesLV.GetPanel(i)
        If i > FirstIndex - ExtraSize And i < LastIndex + ExtraSize Then
            'visible+
            If p.NumberOfViews = 0 Then
                p.LoadLayout("item")
               
                PriceTag1.Text="$ 100"
                PubLabel2.Text="Item 1"
                PubImg1.Bitmap=LoadBitmapResize(File.DirAssets, "sample1.webp",200dip,200dip,True)

                'Load pub Right
                PriceTag2.Text="$ 100"
                PubLabel2.Text="Item 2"
                PubImg2.Bitmap=LoadBitmapResize(File.DirAssets, "sample2.webp",200dip,200dip,True)
               
            End If
        Else
            'not visible
            If p.NumberOfViews > 0 Then
                p.RemoveAllViews '<--- remove the layout
            End If
        End If
    Next
End Sub

You only have to reload data when you have actually reached the end of the list. Use the following code or something like that:

Sub ServicesLV_VisibleRangeChanged (FirstIndex As Int, LastIndex As Int)
    Dim ExtraSize As Int = 20
    For i = 0 To ServicesLV.Size - 1
        Dim p As B4XView = ServicesLV.GetPanel(i)
        If i > FirstIndex - ExtraSize And i < LastIndex + ExtraSize Then
            'visible+
            If p.NumberOfViews = 0 Then
                p.LoadLayout("item")
               
                PriceTag1.Text="$ 100"
                PubLabel2.Text="Item 1"
                PubImg1.Bitmap=LoadBitmapResize(File.DirAssets, "sample1.webp",200dip,200dip,True)

                'Load pub Right
                PriceTag2.Text="$ 100"
                PubLabel2.Text="Item 2"
                PubImg2.Bitmap=LoadBitmapResize(File.DirAssets, "sample2.webp",200dip,200dip,True)
               
            End If
           
            If (LastIndex + ExtraSize) > ServicesLV.Size Then
                Log("Add new items to list")
            End If
           
        Else
            'not visible
            If p.NumberOfViews > 0 Then
                p.RemoveAllViews '<--- remove the layout
            End If
        End If
    Next
End Sub

And always test in release mode.

 

[Ferdari]

Works if I implement lazy loading in this way, just as it is in the tutorial:

Sub ServicesLV_VisibleRangeChanged (FirstIndex As Int, LastIndex As Int)
    Dim ExtraSize As Int = 20
    For i = 0 To ServicesLV.Size - 1
        Dim p As B4XView = ServicesLV.GetPanel(i)
        If i > FirstIndex - ExtraSize And i < LastIndex + ExtraSize Then
            'visible+
            If p.NumberOfViews = 0 Then
                p.LoadLayout("item")
             
                PriceTag1.Text="$ 100"
                PubLabel2.Text="Item 1"
                PubImg1.Bitmap=LoadBitmapResize(File.DirAssets, "sample1.webp",200dip,200dip,True)

                'Load pub Right
                PriceTag2.Text="$ 100"
                PubLabel2.Text="Item 2"
                PubImg2.Bitmap=LoadBitmapResize(File.DirAssets, "sample2.webp",200dip,200dip,True)
             
            End If
        Else
            'not visible
            If p.NumberOfViews > 0 Then
                p.RemoveAllViews '<--- remove the layout
            End If
        End If
    Next
End Sub

You only have to reload data when you have actually reached the end of the list. Use the following code or something like that:

Sub ServicesLV_VisibleRangeChanged (FirstIndex As Int, LastIndex As Int)
    Dim ExtraSize As Int = 20
    For i = 0 To ServicesLV.Size - 1
        Dim p As B4XView = ServicesLV.GetPanel(i)
        If i > FirstIndex - ExtraSize And i < LastIndex + ExtraSize Then
            'visible+
            If p.NumberOfViews = 0 Then
                p.LoadLayout("item")
             
                PriceTag1.Text="$ 100"
                PubLabel2.Text="Item 1"
                PubImg1.Bitmap=LoadBitmapResize(File.DirAssets, "sample1.webp",200dip,200dip,True)

                'Load pub Right
                PriceTag2.Text="$ 100"
                PubLabel2.Text="Item 2"
                PubImg2.Bitmap=LoadBitmapResize(File.DirAssets, "sample2.webp",200dip,200dip,True)
             
            End If
         
            If (LastIndex + ExtraSize) > ServicesLV.Size Then
                Log("Add new items to list")
            End If
         
        Else
            'not visible
            If p.NumberOfViews > 0 Then
                p.RemoveAllViews '<--- remove the layout
            End If
        End If
    Next
End Sub

And always test in release mode.

Hi Alex, Have you tried the project?

i add more items on ReachEnd, the problem is not there, is when scrolling some visible items disappear and reappear, see the log

 

[Alexander Stolte]

Have you tried the project?

Yes and I couldn't find a place in the code where you add new items to the list. You just load the layout to the panels that do not yet have a loaded layout due to lazy loading.

i add more items on ReachEnd, the problem is not there, is when scrolling some visible items disappear and reappear, see the log

Look at your example project, there is no ReachEnd event.

 

[Ferdari]

Yes and I couldn't find a place in the code where you add new items to the list. You just load the layout to the panels that do not yet have a loaded layout due to lazy loading.

Look at your example project, there is no ReachEnd event.

But can you see the bug when scrolling?

Its a new project to reproduce the bug, the real project handles ReachEnd and the data via Cards type.

 

[Ferdari]

Its like visible range not getting real visible range, i tested resizing base panel so it catches real size, but no luck.

 

[Alexander Stolte]

But can you see the bug when scrolling?

Yes i can see it, but i cant say why this happend, because if i add the lazyloading code from the tutorial, then its works like in the code snipped in #2

 

[Ferdari]

Yes i can see it, but i cant say why this happend, because if i add the lazyloading code from the tutorial, then its works like in the code snipped in #2

Oh, what tutorial you mean? i followed all tutorials(i think)? your code is not using ReachEnd as i can see.

 

[Alexander Stolte]

You didn't have the reach end event in your example project, so how should I know? Just replace the code and then try again

In the lazy loading Tutorial, if you search, then the first Result

 

[Ferdari]

You didn't have the reach end event in your example project, so how should I know? Just replace the code and then try again

In the lazy loading Tutorial, if you search, then the first Result

Thanks for your suggestions, as said before in post #5 "Its a new project to reproduce the bug, the real project handles ReachEnd and the data via Cards type.",

The main thread is about the bug, i already implemented Lazyloading, but i will test your code to see if bug is gone and why

im trying to optimize my CLV to be fastest and memory saver, as it has lots of pictures, a Recyclerview must be the answer.

 

[Ferdari]

maybe @Erel can give some light and a fix?

 

[Erel]

Your code is wrong.
The "Else" is in the wrong place. You should only remove items that are not visible.

For further discussion please start a new thread in the question.

Tips:
- Switch to B4XPages.
- Don't load the same image multiple times.

 

[Ferdari]

Your code is wrong.
The "Else" is in the wrong place. You should only remove items that are not visible.

View attachment 155100

For further discussion please start a new thread in the question.

Tips:
- Switch to B4XPages.
- Don't load the same image multiple times.

i will try your suggestions, Thank you Erel, youre the best!

 

[Ferdari]

It works!! i mark as solved, Thanks @Erel and @Alexander Stolte

 

[Erel]

Moved to the questions forum. Better to start there.