UIVirtualization in .NET MAUI Carousel View (SfCarousel)

19 Dec 20232 minutes to read

In the UI virtualization concept, only the number of items that can be adaptable to the viewport of our device are arranged. Even, if numerous items have been added to the collection, it only loads the viewport adaptable count of the carousel items. Items are added at the right of the view when swiping the countable items in the forward direction. At the same time, the same number of items are removed at the left of the view to maintain the same viewport items count. Similarly, items are added at the left of the view when swiping backward to maintain the same viewport items count. At the same time, the same number of items are removed at the right of the view. Using this mechanism, the virtualization concept is achieved in the carousel control.

The following property has been used in UIVirtualization support:

• EnableVirtualization

EnableVirtualization

The UI virtualization concept is implemented by enabling the EnableVirtualization property in SfCarousel Linear mode.

NOTE

The default value of the EnableVirtualization property is false.

XAML

<carousel:SfCarousel x:Name="carousel"
                     ItemsSource="{Binding ImageCollection}"
                     ItemHeight="200"
                     ItemWidth="200"
                     ItemSpacing="2"
                     ViewMode="Linear"
                     EnableVirtualization="true">
</carousel:SfCarousel>

C#

SfCarousel carousel = new SfCarousel()
{
    ItemHeight = 200,
    ItemWidth = 200,
    ItemSpacing = 2,
    EnableVirtualization = true,
    ViewMode = ViewMode.Linear
};

carousel.SetBinding(SfCarousel.ItemsSourceProperty, "ImageCollection");

Find the complete UIVirtualization sample from this link.