Articles in this section
Category / Section

How to create a .NET MAUI Carousel (SfCarousel)?

2 mins read

This article demonstrates how to create a .NET MAUI Carousel application.
Step 1: Install the Syncfusion.Maui.Carousel NuGet package and add the namespace for Carousel.

XAML:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"             
             xmlns:local="clr-namespace:Carousel"
             xmlns:carousel="clr-namespace:Syncfusion.Maui.Carousel;assembly=Syncfusion.Maui.Carousel"
             x:Class="Carousel.MainPage">

Step 2: Initialize the .NET MAUI Carousel in XAML.

XAML:

<carousel:SfCarousel />

Step 3: Add Carousel Items.

We can populate the carousel’s items using either CarouselItem or ItemTemplate.

C#

public class CarouselViewModel
{
    public ObservableCollection<SfCarouselItem> CarouselItems;
    public CarouselViewModel()
    {
        CarouselItems = new ObservableCollection<SfCarouselItem>();
        CarouselItems.Add(new SfCarouselItem() { ImageName = "carousel_person1.png" });
        CarouselItems.Add(new SfCarouselItem() { ImageName = "carousel_person2.png" });
        CarouselItems.Add(new SfCarouselItem() { ImageName = "carousel_person3.png" });
        CarouselItems.Add(new SfCarouselItem() { ImageName = "carousel_person4.png" });
        CarouselItems.Add(new SfCarouselItem() { ImageName = "carousel_person5.png" });
    }
}

The following code example illustrates how to add the collection in Carousel.
C#

 <ContentPage.BindingContext>
        <local:CarouselViewModel/>
    </ContentPage.BindingContext>

    <carousel:SfCarousel x:Name="carousel"
                         ItemsSource="{Binding CarouselItems}"/>

Output:

AndroidEmulator-pixel_5_-_api_34_55542024-03-1419-03-22-ezgif.com-video-to-gif-converter.gif

Download the complete sample from GitHub.

Conclusion
I hope you enjoyed learning how to create a .NET MAUI Carousel.

You can refer to our .NET MAUI Carousel feature tour page to learn about its other groundbreaking feature representations. Explore our .NET MAUI Carousel documentation to understand how to present and manipulate data.

For current customers, check out our .NET MAUI components on the License and Downloads page. If you are new to Syncfusion®, try our 30-day free trial to explore our .NET MAUI Navigation Drawer and other .NET MAUI components.

Please let us know in the comments section if you have any queries or require clarification. You can also contact us through our support forums, Direct-Trac, or feedback portal, or the feedback portal. We are always happy to assist you!

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please  to leave a comment
Access denied
Access denied