Introducing the New .NET MAUI Rotator Control
Tags: dotnetmaui, mobile, whatsnew, ui
Published: 2024-03-28 04:08:03

---
title: Introducing the New .NET MAUI Rotator Control
published: true
date: 2024-03-25 15:10:50 UTC
tags: dotnetmaui, mobile, whatsnew, ui
canonical_url: https://www.syncfusion.com/blogs/post/dotnet-maui-rotator-control
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jz949vapkssk3mibijv9.png
---

**TLDR:** Showcasing the features of the new Syncfusion .NET MAUI Rotator control with vivid, picturesque illustrations and the steps to get started with it.

We are happy to introduce the new Syncfusion [.NET MAUI Rotator](https://www.syncfusion.com/maui-controls/maui-rotator ".NET MAUI Rotator Control") control in the [Essential Studio 2024 Volume 1](https://www.syncfusion.com/forums/187257/essential-studio-2024-volume-1-main-release-v25-1-35-is-available-for-download "Essential Studio 2024 Volume 1") release.

The .NET MAUI Rotator is a navigation control used to display image data and navigate through them. The images can be selected either by **thumbnail**  or by **dot**  support.

In this blog, we’ll explore the key features of the .NET MAUI Rotator control and the steps to get started!

## Key features

The key features of the new .NET MAUI Rotator control are:

- [Navigation modes](#Navigation)
- [Navigation strip placement](#strip)
- [Autoplay and looping](#Autoplay)

### <a name="Navigation">Navigation modes</a>

The .NET MAUI Rotator control supports dot and thumbnail navigation modes to quickly navigate to the desired item.

<figure>

  <img src="https://www.syncfusion.com/blogs/wp-content/uploads/2024/03/Different-navigation-modes-in-the-.NET-MAUI-Rotator-control.png" alt="Different navigation modes in the .NET MAUI Rotator control" style="width:100%">

  <figcaption>Different navigation modes in the .NET MAUI Rotator control</figcaption>

</figure>

### <a name="strip">Navigation strip placement</a>

You can set the position of dot and thumbnail strip representations at any of the four sides: left, right, top, or bottom.

<figure>

  <img src="https://www.syncfusion.com/blogs/wp-content/uploads/2024/03/Customizing-the-position-of-the-navigation-strip-in-the-.NET-MAUI-Rotator-control.png" alt="Customizing the position of the navigation strip in the .NET MAUI Rotator control" style="width:100%">

  <figcaption>Customizing the position of the navigation strip in the .NET MAUI Rotator control</figcaption>

</figure>

### <a name="Autoplay">Autoplay and looping</a>

You can use the .NET MAUI Rotator control as a slide show to display a set of items in a defined interval of time with no interactions.

You can also navigate back to the first item when they reach the last item by setting the looping to true. This provides a better review experience when the control is loaded with many items.

<figure>

  <img src="https://www.syncfusion.com/blogs/wp-content/uploads/2024/03/Autoplay-and-looping-features-in-.NET-MAUI-Rotator-control.gif" alt="Autoplay and looping features in .NET MAUI Rotator control" style="width:100%">

  <figcaption>Autoplay and looping features in .NET MAUI Rotator control</figcaption>

</figure>

**Note:** For more details, refer to the [.NET MAUI Rotator documentation](https://help.syncfusion.com/maui/rotator/overview "Getting started with the .NET MAUI Rotator").

## Getting started with the .NET MAUI Rotator control

We have seen the key features of the .NET MAUI Rotator control. Let’s learn how to integrate it into your .NET MAUI app and utilize its features by following these steps:

### Step 1: Create a .NET MAUI app

First, create a new [.NET MAUI application](https://learn.microsoft.com/en-us/dotnet/maui/get-started/first-app?view=net-maui-7.0&tabs=vswin&pivots=devices-android "Build your first .NET MAUI app").

### Step 2: Add the Syncfusion .NET MAUI Rotator control

The Syncfusion .NET MAUI controls are available on the [NuGet Gallery](https://www.nuget.org/ "NuGet Gallery"). To add the .NET MAUI Rotator control to your project, open the  **NuGet package manager**  in [Visual Studio](https://visualstudio.microsoft.com/ "Visual Studio"). Search for [Syncfusion.Maui.Rotator](https://www.nuget.org/packages/Syncfusion.Maui.Rotator "Syncfusion.Maui.Rotator NuGet package"), and then install it.

### Step 3: Register the Syncfusion core handler

In the **MauiProgram.cs** file, register the Syncfusion core handler and configure the fonts. Refer to the following code example.

```csharp
using Microsoft.Maui;
using Microsoft.Maui.Hosting;
using Microsoft.Maui.Controls.Compatibility;
using Microsoft.Maui.Controls.Hosting;
using Microsoft.Maui.Controls.Xaml;
using Syncfusion.Maui.Core.Hosting;
namespace RotatorSample
{
   public static class MauiProgram
   {
      public static MauiApp CreateMauiApp()
      {
         var builder = MauiApp.CreateBuilder();
         builder
             .UseMauiApp<App>()
             .ConfigureSyncfusionCore()
             .ConfigureFonts(fonts =>
             {
                fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
             });
         return builder.Build();
      }
   }
}
```

### Step 4: Add the required namespace

Now, include the **Syncfusion.Maui.Rotator** namespace in your XAML page.

```xml
xmlns:buttons="clr-namespace:Syncfusion.Maui.Rotator;assembly=Syncfusion.Maui.Rotator"
```

### Step 5: Initialize the .NET MAUI Rotator control

Then, initialize the Syncfusion .NET MAUI Rotator control.

```xml
<ContentPage.Content>
 <syncfusion:SfRotator x:Name="rotator" />
</ContentPage.Content>
```

### Step 6: Populate the Rotator items collection

Finally, populate the collection of rotator items in the View model with the image data. Refer to the following code example.

```csharp
public partial class MainPage : ContentPage
{
    public MainPage()
    {
        InitializeComponent();

        List<SfRotatorItem> collectionOfItems =
        [
            new SfRotatorItem() { Image = "image1.png" },
            new SfRotatorItem() { Image = "image2.png" },
            new SfRotatorItem() { Image = "image3.png" },
            new SfRotatorItem() { Image = "image4.png" },
            new SfRotatorItem() { Image = "image5.png" },
            new SfRotatorItem() { Image = "image6.png" },
        ];
        rotator.ItemsSource = collectionOfItems;
    }
}
```

After executing the above code examples, we’ll get the following output.

<figure>

  <img src="https://www.syncfusion.com/blogs/wp-content/uploads/2024/03/Integrating-Rotator-control-into-the-.NET-MAUI-app.gif" alt="Integrating Rotator control into the .NET MAUI app" style="width:100%">

  <figcaption>Integrating Rotator control into the .NET MAUI app</figcaption>

</figure>

## GitHub reference

For more details, refer to the [.NET MAUI Rotator control GitHub demo](https://github.com/SyncfusionExamples/Getting-Started-with-.NET-MAUI-Rotator ".NET MAUI Rotator control GitHub demo").

## Conclusion

Thanks for reading! In this blog, we’ve seen the features of the new [.NET MAUI Rotator](https://www.syncfusion.com/maui-controls/maui-rotator ".NET MAUI Rotator Control") control introduced in the [2024 Volume 1](https://www.syncfusion.com/forums/187257/essential-studio-2024-volume-1-main-release-v25-1-35-is-available-for-download "Essential Studio 2024 Volume 1") release. Check out our [Release Notes](https://www.syncfusion.com/products/release-history "Essential Studio Release Notes") and [What’s New](https://www.syncfusion.com/products/whatsnew "Essential Studio What’s New") pages to see the other updates in this release, and leave your feedback in the comments section below.

For existing Syncfusion customers, the newest version of Essential Studio is available from the [license and downloads page](https://www.syncfusion.com/account/downloads "Essential Studio license and downloads page"). If you are not a customer, try our 30-day [free trial](https://www.syncfusion.com/downloads "Get the free evaluation of the Essential Studio products") to check out these new features.

You can also contact us through our [support forums](https://www.syncfusion.com/forums "Syncfusion Support Forums"), [feedback portal](https://www.syncfusion.com/feedback "Syncfusion Feedback Portal"), or [support portal](https://support.syncfusion.com/ "Syncfusion Support Portal"). We are always happy to assist you!

## Related blogs

- [Syncfusion Essential Studio 2024 Volume 1 Is Here!](https://www.syncfusion.com/blogs/post/essential-studio-2024-vol-1 "Blog: Syncfusion Essential Studio 2024 Volume 1 Is Here!")
- [Chart of the Week: Creating a .NET MAUI Fast Line Chart to Visualize the Arctic Sea Ice Extent Since 2000](https://www.syncfusion.com/blogs/post/maui-fast-line-chart-arctic-ice.aspx "Blog: Chart of the Week: Creating a .NET MAUI Fast Line Chart to Visualize the Arctic Sea Ice Extent Since 2000")
- [Introducing the 11th Set of New .NET MAUI Controls and Features](https://www.syncfusion.com/blogs/post/dotnet-maui-2024-volume-1.aspx "Blog: Introducing the 11th Set of New .NET MAUI Controls and Features")
- [Enhancing User Experience: Implementing Typos Tolerance in .NET MAUI Autocomplete](https://www.syncfusion.com/blogs/post/tolerate-typos-maui-autocomplete.aspx "Blog: Enhancing User Experience: Implementing Typos Tolerance in .NET MAUI Autocomplete")