question

SreejithSree-2948 avatar image
0 Votes"
SreejithSree-2948 asked ·

Xamarin Forms: How to detect the scrollview(or expander) end or top reached?

I need to load more data when scrollview reaches the end or top. I found the same thread over here, but on that, I didn't understand what is MyScrollView.

 private void OnScrolled(object sender, ScrolledEventArgs e)
 {
     MyScrollView scrollView = sender as MyScrollView;
     double scrollingSpace = scrollView.ContentSize.Height - scrollView.Height;

     if (scrollingSpace <= e.ScrollY)
     {
        //reached end
     }
 }

I implemented the same in ListView using the ItemAppearing event. But currently, I am using Expander on the UI to display data. Is there any same kind of event for the expander to reach the end and beginning? The expander is inside of a scrollview, that's why I started researching about the scrollview end event.

Help me to find a way to trigger some kind of event when scrollview reaches end or beginning?


dotnet-xamarinforms
10 |1000 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

SreejithSree-2948 avatar image
0 Votes"
SreejithSree-2948 answered ·

Like I mentioned in the question I have implemented the same feature in ListView using the ItemAppearing event. But in this case, my data is a list of items inside another list. That's why I forced to use the Expander component to display the data on the UI.

At the same time, I need to load more items when the Expander bottom reaches. But Expander doesn't provide the related event because it is not a scrollable control. So that I tried to find out an event for the ScrollView component. But no luck for that also.

Finally, I decided to change the data to a single list from a list inside another list. I have converted that using some for loops and now the data is suitable for ListView. And I have implemented the load more feature using the ItemAppearing event.

Thanks @JarvanZhang-MSFT

·
10 |1000 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

JarvanZhang-MSFT avatar image
0 Votes"
JarvanZhang-MSFT answered ·

Hello,​

Welcome to our Microsoft Q&A platform!

Is there any same kind of event for the expander to reach the end and beginning?

Expander doesn't provide the related event because it self is not a scrollable control.

I found the same thread over here, but on that, I didn't understand what is MyScrollView.

In you posted link, Bruno may use a custom ScrollView in his project. You could just change the 'MyScrollView' to ScrollView as below:

private void ScrollView_Scrolled(object sender, ScrolledEventArgs e)
{
    var scrollView = sender as ScrollView;
    double scrollingSpace = scrollView.ContentSize.Height - scrollView.Height;

    if (scrollingSpace > e.ScrollY)
        return;

    //do the work
    //the scrollView has scrolled to the last item
}

Check this link: https://stackoverflow.com/a/57558768/11083277

Best Regards,

Jarvan Zhang



If the response is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.


· 2 ·
10 |1000 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Tried this but not working as expected. It is always firing when start scrolling from the top. I added a Debug.WriteLine code like below and it is firing when start scrolling from the top. I need to fire this part only when reaching the last time inside scrollview.

 if (scrollingSpace > e.ScrollY)
 {
     Debug.WriteLine("#### Bottom ###");
 }

My scrollview contents are like below, it contains BindableLayout and Expander.

 <ScrollView
     x:Name="MyScrollView"
     Scrolled="OnScrolled">
     <StackLayout BindableLayout.ItemsSource="{Binding AllItems,Mode=TwoWay}">
         <BindableLayout.ItemTemplate>
             <DataTemplate>
                 <Expander>
                 </Expander>
             </DataTemplate>
         </BindableLayout.ItemTemplate>
     </StackLayout>
 </ScrollView>

0 Votes 0 ·

If you want to present a list of data and scoll the items, try using ListView and CollectionView instead. You could detect the ItemAppearing event of ListView or the Scrolled event of CollectionView to check the scrolling position.

Check the docs:
https://docs.microsoft.com/en-us/dotnet/api/xamarin.forms.itemvisibilityeventargs?view=xamarin-forms
https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/collectionview/scrolling#detect-scrolling

0 Votes 0 ·