How to maintain scroll while updating Itemsource in.NET MAUI ListView?

The .NET MAUI ListView (SfListView) will be scrolled to top automatically when changing the ItemsSource at runtime. However, you can maintain the same scrolled position by using the SfListView.CanMaintainScrollPosition . After changing the ItemsSource, you can set the value as true to CanMaintainScrollPosition API to scroll back to the same position.

XAML
Set the CanMaintainScrollPosition to true to maintain the scroll position after updating the ItemsSource

<contentpage xmlns="http://schemas.microsoft.com/dotnet/2021/maui" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:class="ListViewMaui.MainPage" xmlns:local="clr-namespace:ListViewMaui" xmlns:listview="clr-namespace:Syncfusion.Maui.ListView;assembly=Syncfusion.Maui.ListView" xmlns:datasource="clr-namespace:Syncfusion.Maui.DataSource;assembly=Syncfusion.Maui.DataSource">

    <contentpage.bindingcontext>
        <local:contactsviewmodel>
    </local:contactsviewmodel></contentpage.bindingcontext>

    <contentpage.behaviors>
        <local:behavior>
    </local:behavior></contentpage.behaviors>

    <contentpage.content>
        <grid>
            <grid.rowdefinitions>
                <rowdefinition height="50">
                <rowdefinition height="*">
            </rowdefinition></rowdefinition></grid.rowdefinitions>
            <button x:name="updateButton" text="Update ItemsSource" heightrequest="50">
            <listview:sflistview x:name="listView" grid.row="1" canmaintainscrollposition="True" itemsize="70" itemssource="{Binding ContactsInfo}">
                <listview:sflistview.itemtemplate>
                    <datatemplate>
                        <stacklayout>
                            <grid x:name="grid" rowspacing="0">
                                <grid.columndefinitions>
                                    <columndefinition width="70">
                                    <columndefinition width="*">
                                </columndefinition></columndefinition></grid.columndefinitions>
                                <img source="{Binding ContactImage}" heightrequest="50" widthrequest="50" margin="5" horizontaloptions="CenterAndExpand" verticaloptions="CenterAndExpand">
                                <grid grid.column="1" rowspacing="1" padding="10,0,0,0" verticaloptions="Center">
                                    <grid.rowdefinitions>
                                        <rowdefinition height="*">
                                        <rowdefinition height="*">
                                    </rowdefinition></rowdefinition></grid.rowdefinitions>
                                    <label text="{Binding ContactName}" verticaloptions="CenterAndExpand">
                                    <label grid.row="1" text="{Binding ContactNumber}" verticaloptions="StartAndExpand">
                                </label></label></grid>
                            </grid>
                            <boxview heightrequest="1" backgroundcolor="#EEEEEE">
                        </boxview></stacklayout>
                    </datatemplate>
                </listview:sflistview.itemtemplate>
            </listview:sflistview>
        
    

C#

internal class Behavior : Behavior<contentpage>
{
    #region Fields

    SfListView ListView;
    Button UpdateButton;
    ListViewScrollView ScrollView;
    #endregion
    
    #region Overrides
    
    protected override void OnAttachedTo(ContentPage bindable)
    {
        ListView = bindable.FindByName<sflistview>("listView");
        UpdateButton = bindable.FindByName</sflistview></contentpage></button><button>("updateButton");
        
        UpdateButton.Clicked += UpdateButton_Clicked;
        
        base.OnAttachedTo(bindable);
    }
    
    protected override void OnDetachingFrom(ContentPage bindable)
    {
        UpdateButton.Clicked -= UpdateButton_Clicked;
        UpdateButton = null;
        ListView = null;
        base.OnDetachingFrom(bindable);
    }
    #endregion
    
    #region Callback
    
    private void UpdateButton_Clicked(object sender, EventArgs e)
    {
        var viewModel = ListView.BindingContext as ContactsViewModel;
        viewModel.GenerateInfo();
        ListView.ItemsSource = viewModel.ContactsInfo;
    }
    
    #endregion
}

View sample in GitHub

Take a moment to peruse the documentation to learn more about scrolling in SfListView with code example.

Conclusion

I hope you enjoyed learning about how to maintain scroll while updating Itemsource in.NET MAUI ListView.

You can refer to our .NET MAUI SfListView feature tour page to know about its other groundbreaking feature representations and documentation, and how to quickly get started for configuration specifications. You can also explore our .NET MAUI SfListView example to understand how to create and manipulate data.

For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our other controls.

If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!</contentpage.content>