# Incremental Loading

The RadListView incremental loading feature allows you to load the data in separate batches when you reach the end of the scrollbar or click on a button.

To enable incremental loading, the ItemsSource collection of RadListView should implement the **ISupportIncrementalLoading** interface. You can also take advantage of the **IncrementalLoadingCollection** which is our default implementation.

The **IncrementalLoadingMode** property specifies how new items are requested. Two loading modes are supported:

* **Automatic**: Scrolling to the end of the control automatically loads more items.
* **Explicit**: The user has to explicitly request more items by click/tap on the button.

The RadListView also supports **LoadMoreDataCommand** that by default is executed to load new data. Read more about commands in the [Commands](https://www.telerik.com/winui/documentation/controls/radlistview/features/listview-commands) article.

## Using IncrementalLoading Collection

The following example demonstrates how to enable data virtualization using the incremental loading functionality. This approach works for both Automatic and Explicit loading modes.

#### **Example 1: Creating data models**

```C#
public class ViewModel
{
	private int currentCount = 0;

	public ViewModel()
	{
		this.Items = new IncrementalLoadingCollection<Item>(this.GetMoreItems) { BatchSize = 5 };
	}

	public IncrementalLoadingCollection<Item> Items { get; set; }

	private async Task<IEnumerable<Item>> GetMoreItems(uint count)
	{
		await Task.Delay(1000);
		var result = Enumerable.Range(this.currentCount, (int)count).Select(x => new Item { Text = "item " + x }).ToList();
		currentCount += (int)count;
		return result;
	}	
}

public class Item 
{
	public string Text { get; set; }
}
```

#### **Example 2: Defining RadListView in XAML**

```XAML
<telerikData:RadListView x:Name="listView" IncrementalLoadingMode="Explicit" ItemsSource="{Binding Items}">
	<telerikData:RadListView.DataContext>
		<local:ViewModel/>
	</telerikData:RadListView.DataContext>
	<telerikData:RadListView.ItemTemplate>
		<DataTemplate>
			<TextBlock Text="{Binding Text}"/>
		</DataTemplate>
	</telerikData:RadListView.ItemTemplate>
</telerikData:RadListView>
```

![WinUI RadListView incremental loading](https://www.telerik.com/winui/documentation/assets/8a6da20e823b35f8531772fe4602a178/radlistview-incremental-loading-0.png)

## Using LoadMoreDataCommand

This example demonstrates how to utilize LoadMoreDataCommand to load items. The approach works for both Automatic and Explicit loading modes.

#### **Example 3: Creating the view model**

```C#
public class ViewModel
{
	public ViewModel()
	{
		this.Items = new ObservableCollection<int>();
		this.AddItems(40);
	}

	public ObservableCollection<int> Items { get; }

	public void AddItems(int count)
	{
		for (int i = 0; i < count; i++)
		{
			this.Items.Add(this.Items.Count);
		}
	}
}	
```

#### **Example 4: Implementing LoadMoreDataCommand**

```C#
public class CustomLoadOnDemandCommand : LoadMoreDataCommand
{
	private int lodCounter;

	public CustomLoadOnDemandCommand()
		:base()
	{
		this.Id = CommandId.LoadMoreData;
	}

	public override bool CanExecute(object parameter)
	{
		LoadMoreDataContext context = (LoadMoreDataContext)parameter;
		LoadOnDemandCommand.ViewModel viewModel = (LoadOnDemandCommand.ViewModel)context.DataContext;

		bool canExecute = viewModel.Items.Count < 100;
		return canExecute;
	}

	public async override void Execute(object parameter)
	{
		base.Execute(parameter);

		LoadMoreDataContext context = (LoadMoreDataContext)parameter;
		LoadOnDemandCommand.ViewModel viewModel = (LoadOnDemandCommand.ViewModel)context.DataContext;
		this.lodCounter++;

		if (this.lodCounter % 3 == 0)
		{
			// If we do not need to get new data asynchronously, we can add the new items right away.
			viewModel.AddItems(15);
		}
		else
		{
			// If we need to get new data asynchronously, we must manually update the loading status.

			this.Owner.ChangeDataLoadingStatus(BatchLoadingStatus.ItemsRequested);

			// Mimic getting data from server asynchronously.
			await Task.Delay(2000);

			viewModel.AddItems(15);

			this.Owner.ChangeDataLoadingStatus(BatchLoadingStatus.ItemsLoaded);
		}
	}
}
```

#### **Example 5: Defining RadListView in XAML**

```XAML
<telerikData:RadListView x:Name="ListView" ItemsSource="{Binding Items}" />
```

#### **Example 6: Adding the custom command to RadListView Commands list**

```C#
this.ListView.Commands.Add(new CustomLoadOnDemandCommand());
this.DataContext = new ViewModel();
```