Multiple SfListView inside a ScrollView is lagging in Android 10.0(Q) or API Level 29 - Q

I just grabbed the ProductHomePage and MoviesPage of the Xamarin Essential UI Kit with multiple SfListView inside a ScrollView, without making changes to the written code i executed it using my physical Android device but the scrolling is lagging. Note: I am using the latest release version 18.4.0.34 of the syncfuction controls. I don't know if anyone have experienced this, and What could be the possible solution here please?

12 Replies

LN Lakshmi Natarajan Syncfusion Team January 15, 2021 12:09 PM UTC

Hi Pat, 
 
Thank you for using Syncfusion products. 
 
We have checked the reported query “Multiple SfListView inside a ScrollView is lagging in Android 10.0(Q) or API Level 29 - Q” from our side. We would like to inform you that when the ListView is loaded inside ScrollView, it is recommended to set the HeightRequest for the ListView. Please refer to our user guidance document regarding the same from the following link, 
 
 
Also, we would like to inform you that, adding scrollable control like ListView inside the ScrollView is not recommended in Xamarin forms. The Xamarin.Forms warns the usage of nested ScrollView. You can refer to the following documentation regarding the same from the following links,  
  
If you still wants to add the SfListView control inside ScrollView, we suggest you to use IsScrollingEnabled as False or set HeightRequest for the ListView. Please refer the following code snippets regarding the same from the following link,  
 
We have attached the tested sample in the following link, 
 
If you still facing the issue please revert us with the following details which would be helpful for us to check on it and provide you the solution as soon as possible. 
  • Share ListView XAML page
  • Share Issue reproducing video
  • Share Syncfusion and Xamarin.Forms updated version
 
Regards, 
Lakshmi Natarajan 



PN Pat Nadis replied to Lakshmi Natarajan January 15, 2021 09:28 PM UTC

Hi Pat, 
 
Thank you for using Syncfusion products. 
 
We have checked the reported query “Multiple SfListView inside a ScrollView is lagging in Android 10.0(Q) or API Level 29 - Q” from our side. We would like to inform you that when the ListView is loaded inside ScrollView, it is recommended to set the HeightRequest for the ListView. Please refer to our user guidance document regarding the same from the following link, 
 
 
Also, we would like to inform you that, adding scrollable control like ListView inside the ScrollView is not recommended in Xamarin forms. The Xamarin.Forms warns the usage of nested ScrollView. You can refer to the following documentation regarding the same from the following links,  
  
If you still wants to add the SfListView control inside ScrollView, we suggest you to use IsScrollingEnabled as False or set HeightRequest for the ListView. Please refer the following code snippets regarding the same from the following link,  
 
We have attached the tested sample in the following link, 
 
If you still facing the issue please revert us with the following details which would be helpful for us to check on it and provide you the solution as soon as possible. 
  • Share ListView XAML page
  • Share Issue reproducing video
  • Share Syncfusion and Xamarin.Forms updated version
 
Regards, 
Lakshmi Natarajan 


Thanks for your response.

If you really understood my question it will not call for sharing a project sample because the code i have is auto generated by Syncfusion's Xamarin Essential UI Kit.

For better understanding please, use visual studio to add the Product Home Page of the Xamarin Essential UI Kit under the catalog category. When you run the program you will see the UI like the one attached here.

Also note that this page am talking about lags when you set android version to Android 10.0(Q) or API Level 29 - Q.
Notice that this page works well without lagging when android version is set to other API levels expect the Android 10.0(Q) or API Level 29 - Q.


Attachment: ezyzip_85cdf122.zip


LN Lakshmi Natarajan Syncfusion Team January 18, 2021 12:54 PM UTC

Hi Pat, 
 
Sorry for the inconvenience caused. 
 
We have checked the reported scenario at our side. We could reproduce the reported scenario with target version Android 10 – API 29. Also, the reported scenario occurs from the Xamarin.Forms version 4.5 and above. We are currently checking this in framework level. We will check completely and update you further details on January 20, 2021. We appreciate your patience until then. 
 
Lakshmi Natarajan 
 



PN Pat Nadis replied to Lakshmi Natarajan January 19, 2021 07:10 AM UTC

Hi Pat, 
 
Sorry for the inconvenience caused. 
 
We have checked the reported scenario at our side. We could reproduce the reported scenario with target version Android 10 – API 29. Also, the reported scenario occurs from the Xamarin.Forms version 4.5 and above. We are currently checking this in framework level. We will check completely and update you further details on January 20, 2021. We appreciate your patience until then. 
 
Lakshmi Natarajan 
 


Thank you for your service, as i await your response on January 20th, i am still trying to see if i can reproduce such scenario using controls like collection view stacked in horizontal orientation. 

Best regard!


LN Lakshmi Natarajan Syncfusion Team January 19, 2021 12:48 PM UTC

Hi Pat, 
 
Thank you for the update. 
 
As promised earlier, we will update further details on January 20, 2021 and appreciate your patience until then. 
 
Lakshmi Natarajan 
 



LN Lakshmi Natarajan Syncfusion Team January 20, 2021 10:03 AM UTC

Hi Pat, 
 
Thank you for your patience. 
 
We have checked the reported scenario at our side. As we have mentioned in our previous update, the reported issue occurs after updating to the Xamarin.Forms v4.5 where Xamarin migrated AndroidX.  
 
We would like to inform you that we are using NestedScrollingEnabled as True in our source to enable the ListView scrolling when loaded in the ScrollView. Also, you can overcome the reported scenario by setting the NestedScrollingEnabled as False in sample level. Please refer to the following code snippets for more reference, 
 
Write dependency interface in the PCL project 
public interface IDependencyServiceListView 
{ 
    void SetNestedScrollingEnabled(SfListView ListView); 
} 
 
Implement the interface and set the NestedScrollingEnabled for the renderer in the native android project. 
[assembly: Dependency(typeof(ListViewDependencyService))] 
namespace ListViewXamarin.Droid  
{  
    public class ListViewDependencyService : IDependencyServiceListView  
    {  
        ExtendedScrollView ExtendedScrollView; 
 
        public void SetNestedScrollingEnabled(SfListView ListView) 
        { 
#if __ANDROID_29__ 
            ExtendedScrollView = ListView.GetScrollView(); 
            var extendedScrollViewRenderer = Platform.GetRenderer(ExtendedScrollView); 
            extendedScrollViewRenderer.View.NestedScrollingEnabled = false; 
#endif 
        } 
    }  
} 
 
In the OnAppearing override, call the dependency method for the ListView to update the API. 
protected override void OnAppearing() 
{ 
    base.OnAppearing(); 
 
    if (Device.RuntimePlatform == Device.Android) 
    { 
        DependencyService.Get<IDependencyServiceListView>().SetNestedScrollingEnabled(listView1); 
        ... 
    } 
} 
 
Also, set the IsScrollingEnabled as False for the ListView to load the ListView with full height. 
<ScrollView> 
    <StackLayout> 
            <syncfusion:SfListView x:Name="listView1" ItemSize="50" IsScrollingEnabled="False" ItemsSource="{Binding ContactsInfo}" BackgroundColor="LightBlue"> 
                <syncfusion:SfListView.ItemTemplate > 
                    <DataTemplate> 
                        <Grid x:Name="grid"> 
                            ...  
                        </Grid> 
                    </DataTemplate> 
                </syncfusion:SfListView.ItemTemplate> 
            </syncfusion:SfListView> 
 
We have attached the sample for your requirement and updated in the following link, 
 
Please let us know if you need further assistance. 
 
Lakshmi Natarajan 
 



PN Pat Nadis January 21, 2021 02:41 PM UTC

Thanks for keeping to your date of feedback.

I tried with code seen in your uploaded sample and i ran into a NullReferenceException as shown in the picture attached to this response.
Anyway i tried creating and setting the renderer first to avoid the NullReferenceException as shown below in my code but the scrolling is still lagging.

public void SetNestedScrollingEnabled(SfListView ListView)
        {
#if __ANDROID_29__
            ExtendedScrollView = ListView.GetScrollView();
            var extendedScrollViewRenderer = Platform.GetRenderer(ExtendedScrollView);
 
            if (extendedScrollViewRenderer == null)
            {
                extendedScrollViewRenderer = Platform.CreateRenderer(ExtendedScrollView);
                Platform.SetRenderer(ExtendedScrollView, extendedScrollViewRenderer);
            }
 
            extendedScrollViewRenderer.View.NestedScrollingEnabled = false;
#endif 
        } 

The scrolling only works well when i do a HOT RELOAD which means that the scrolling works well when the OnAppearing method is called the second time the SfListView has been loaded.

Below is my XAML code attached in the file below

Note: With or without IsScrollingEnabled set to false, it doesn't work not until the Hot Reload happens

Attachment: File_e70859e4.zip


SS SaiGanesh Sakthivel Syncfusion Team January 22, 2021 01:24 PM UTC

Hi Pat, 
 
Thank for the update. 
 
#Regarding Multiple SfListView inside a ScrollView is lagging in Android 10.0(Q) or API Level 29 - Q 
We are currently working on it and update you further details on January 27, 2020. We appreciate your patience until then. 
 
Regards, 
SaiGanesh Sakthivel 



PN Pat Nadis replied to SaiGanesh Sakthivel January 25, 2021 02:33 PM UTC

Hi Pat, 
 
Thank for the update. 
 
#Regarding Multiple SfListView inside a ScrollView is lagging in Android 10.0(Q) or API Level 29 - Q 
We are currently working on it and update you further details on January 27, 2020. We appreciate your patience until then. 
 
Regards, 
SaiGanesh Sakthivel 


Thanks for your great assistance!

I was able to figure things out. The SfListView needs to be fully initialized before this code below will be executed without NullReferenceException

         public void SetNestedScrollingEnabled(SfListView ListView)
        {
#if __ANDROID_29__
            ExtendedScrollView = ListView.GetScrollView();
            var extendedScrollViewRenderer = Platform.GetRenderer(ExtendedScrollView);

            extendedScrollViewRenderer.View.NestedScrollingEnabled = false;
#endif
        }

So the best event handler i used so that the SfListView is initialized first is the ItemAppearing event of the SfListView like so

         private void ListViewTile1_ItemAppearing(object sender, Syncfusion.ListView.XForms.ItemAppearingEventArgs e)
        {
             if (Device.RuntimePlatform == Device.Android)
            {
                DependencyService.Get().SetNestedScrollingEnabled(ListViewTile1);
                DependencyService.Get().SetNestedScrollingEnabled(ListViewTile2);
                DependencyService.Get().SetNestedScrollingEnabled(ListViewTile3);
            }
        }

Note that i only used the event handler for just one of the SfListViews in my code, in this case the ListViewTile1.
Thanks i hope it helps another developer.


LN Lakshmi Natarajan Syncfusion Team January 25, 2021 03:09 PM UTC

Hi Pat, 
 
Thank you for the update. 
 
We are glad that your requirement has been met at your side.  
 
Meanwhile, we would like to inform you that the ItemAppearing event will be triggered for every item while loading in the view. Please refer to our user guidance document for the same, 
 
We suggest you to try the Loaded event instead of ItemAppearing to achieve your requirement. The Loaded event will be raised after the SfListView is loaded in view for the first time. You can trigger the Loaded event for each ListView loaded in the page and call the SetNestedScrollingEnable method.  
 
Please refer to the user guidance document from the following link, 
 
Please refer to the following code snippets, 
private void listView_Loaded(object sender, ListViewLoadedEventArgs e) 
{ 
    if (Device.RuntimePlatform == Device.Android) 
    { 
        DependencyService.Get().SetNestedScrollingEnabled((sender as SfListView)); 
    } 
} 
 
Please let us know if this works without exception? 
 
Lakshmi Natarajan 
 

page one side of one leaf (of a book or magazine or newspaper or letter etc.) or the written or pictorial matter it contains More (Definitions, Synonyms, Translation)


PN Pat Nadis replied to Lakshmi Natarajan January 25, 2021 03:25 PM UTC

Hi Pat, 
 
Thank you for the update. 
 
We are glad that your requirement has been met at your side.  
 
Meanwhile, we would like to inform you that the ItemAppearing event will be triggered for every item while loading in the view. Please refer to our user guidance document for the same, 
 
We suggest you to try the Loaded event instead of ItemAppearing to achieve your requirement. The Loaded event will be raised after the SfListView is loaded in view for the first time. You can trigger the Loaded event for each ListView loaded in the page and call the SetNestedScrollingEnable method.  
 
Please refer to the user guidance document from the following link, 
 
Please refer to the following code snippets, 
private void listView_Loaded(object sender, ListViewLoadedEventArgs e) 
{ 
    if (Device.RuntimePlatform == Device.Android) 
    { 
        DependencyService.Get().SetNestedScrollingEnabled((sender as SfListView)); 
    } 
} 
 
Please let us know if this works without exception? 
 
Lakshmi Natarajan 
 

page one side of one leaf (of a book or magazine or newspaper or letter etc.) or the written or pictorial matter it contains More (Definitions, Synonyms, Translation)

Thanks so much the Loaded event of the SfListView aslo worked like magic without any performance issues observed and no Exception.

But i still await for your response on the easier fixes for this issues as you promised (Jan. 27, 2020). Because i find this solution a bit stressful because of too much codes to write before this works.

Lastly, assuming one is using the MVVM pattern how will this be solved?

Thanks for your assistance.


LN Lakshmi Natarajan Syncfusion Team January 26, 2021 08:25 AM UTC

Hi Pat, 
 
Thank you for the update. 
 
We would like to inform that you can achieve your requirement in MVVM using Behaviors. You can get the elements (ListView) loaded in the ContentPage in the Behavior class and trigger the Loaded event. Please refer to the following code snippets, 
 
XAML 
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
             xmlns:local="clr-namespace:ListViewXamarin" 
             xmlns:syncfusion="clr-namespace:Syncfusion.ListView.XForms;assembly=Syncfusion.SfListView.XForms" 
             x:Class="ListViewXamarin.MainPage"> 
    <ContentPage.BindingContext> 
        <local:ContactsViewModel/> 
    </ContentPage.BindingContext> 
    <ContentPage.Behaviors> 
        <local:Behaviors/> 
    </ContentPage.Behaviors> 
    <ContentPage.Content> 
        <ScrollView> 
            <StackLayout> 
                <syncfusion:SfListView x:Name="listView1" ItemSize="50" IsScrollingEnabled="False" ItemsSource="{Binding ContactsInfo}" BackgroundColor="LightBlue"> 
                    <syncfusion:SfListView.ItemTemplate > 
                        <DataTemplate> 
... 
                        </DataTemplate> 
                    </syncfusion:SfListView.ItemTemplate> 
                </syncfusion:SfListView> 
... 
 
Behavior 
public class Behaviors : Behavior<ContentPage> 
{ 
    SfListView ListView1; 
    SfListView ListView2; 
    SfListView ListView3; 
    SfListView ListView4; 
    SfListView ListView5; 
    protected override void OnAttachedTo(ContentPage bindable) 
    { 
        ListView1 = bindable.FindByName<SfListView>("listView1"); 
        ListView2 = bindable.FindByName<SfListView>("listView2"); 
        ListView3 = bindable.FindByName<SfListView>("listView3"); 
        ListView4 = bindable.FindByName<SfListView>("listView4"); 
        ListView5 = bindable.FindByName<SfListView>("listView5"); 
        ListView1.Loaded += ListView1_Loaded; 
            
        base.OnAttachedTo(bindable); 
    } 
 
    private void ListView1_Loaded(object sender, ListViewLoadedEventArgs e) 
    { 
        if (Device.RuntimePlatform == Device.Android) 
        { 
            DependencyService.Get<IDependencyServiceListView>().SetNestedScrollingEnabled(ListView1); 
            DependencyService.Get<IDependencyServiceListView>().SetNestedScrollingEnabled(ListView2); 
            DependencyService.Get<IDependencyServiceListView>().SetNestedScrollingEnabled(ListView3); 
            DependencyService.Get<IDependencyServiceListView>().SetNestedScrollingEnabled(ListView4); 
            DependencyService.Get<IDependencyServiceListView>().SetNestedScrollingEnabled(ListView5); 
        } 
    } 
} 
 
We have attached the modified sample in the following link, 
 
Please let us know if you need further assistance. 
 
Lakshmi Natarajan 
 


Loader.
Up arrow icon