How to improve performance when doing bulk changes in .NET MAUI ListView (SfListView) ?
The .NET MAUI ListView (SfListView) offers a way to enhance performance when applying bulk changes to a bound collection. This can be achieved by suspending and resuming the refresh of the ListView using the DataSource’s BeginInit and EndInit methods.
Step 1: Install Refractored.MVVMHelpers NuGet package to utilize the ObservableRangeCollection within your project.
Step 2: Create an ObservableRangeCollection in the ViewModel class.
public class ContactsViewModel
{
public ObservableRangeCollection<Contacts> ContactsInfo { get; set; }
public ContactsViewModel()
{
ContactsInfo = new ObservableRangeCollection<Contacts>();
}
}
Step 3: Bind the ObservableRangeCollection to the SfListView.ItemsSource property.
<ContentPage.Content>
<StackLayout>
<Button x:Name="addButton" Text="Populate ListView items" HeightRequest="50"/>
<ListView:SfListView x:Name="listView"
ItemSize="60"
ItemsSource="{Binding ContactsInfo}"
HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand">
</StackLayout>
</ContentPage.Content>
Step 4: Use the AddRange method to add items to your ViewModel collection, and apply the BeginInit and EndInit methods to update the UI efficiently.
public class Behavior : Behavior<ContentPage>
{
SfListView ListView;
Button AddButton;
ContactsViewModel ViewModel;
protected override void OnAttachedTo(ContentPage bindable)
{
ListView = bindable.FindByName<SfListView>("listView");
AddButton = bindable.FindByName<Button>("addButton");
ViewModel = bindable.BindingContext as ContactsViewModel;
AddButton.Clicked += AddButton_Clicked;
base.OnAttachedTo(bindable);
}
private void AddButton_Clicked(object sender, EventArgs e)
{
this.GenerateInfo();
}
private void GenerateInfo()
{
Random r = new Random();
var contactsInfo = new List<Contacts>();
for (int i = 0; i < 15; i++)
{
var contact = new Contacts(ViewModel.CustomerNames[i], r.Next(720, 799).ToString() + " - " + r.Next(3010, 3999).ToString());
contact.ContactImage = ImageSource.FromResource("ListViewXamarin.Images.Image" + r.Next(0, 28) + ".png");
contactsInfo.Add(contact);
}
ListView.DataSource.BeginInit();
ViewModel.ContactsInfo.AddRange(contactsInfo);
ListView.DataSource.EndInit();
}
}Download the complete sample on GitHub.
Conclusion
I hope you enjoyed learning how to improve performance when doing bulk changes in .NET MAUI ListView.
You can refer to our .NET MAUI ListView feature tour page to learn about its other groundbreaking feature representations and documentation, and how to quickly get started with configuration specifications. Explore our .NET MAUI ListView example to understand how to create and manipulate data.
For current customers, check out our components from the License and Downloads page. If you are new to Syncfusion®, try our 30-day free trial to check out our other controls.
Please let us know in the comments section if you have any queries or require clarification. Contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!
