--- title: "Introducing the New .NET MAUI PullToRefresh Control" published_at: "2024-01-03T12:46:55+00:00" modified_at: "2026-02-10T05:46:11+00:00" url: "https://www.syncfusion.com/blogs/post/dotnet-maui-pull-to-refresh" excerpt: "This blog explains the features of the new Syncfusion .NET MAUI PullToRefresh control rolled out in the 2023 Volume 4 release." taxonomy_category: - ".NET MAUI" - "Desktop" - "Mobile" - "Syncfusion" - "UI" - "What's new" taxonomy_post_tag: - ".NET MAUI" - "desktop" - "MAUI" - "Mobile" - "What's New" --- # Introducing the New .NET MAUI PullToRefresh Control [Piruthiviraj Malaimelraj](https://www.syncfusion.com/blogs/author/piruthiviraj-malaimelraj) ![Introducing the New .NET MAUI PullToRefresh Control](https://www.syncfusion.com/blogs/wp-content/uploads/2024/01/Introducing-the-New-.NET-MAUI-PullToRefresh-Control-1.png) In Syncfusion’s [Essential Studio® 2023 Volume 4](https://www.syncfusion.com/forums/185916/essential-studio-2023-volume-4-main-release-v24-1-41-is-available-for-download) release, we introduced a new PullToRefresh control for the [.NET MAUI](https://www.syncfusion.com/maui-controls/) platform. The [.NET MAUI PullToRefresh](https://www.syncfusion.com/maui-controls/maui-pull-to-refresh) (SfPullToRefresh) control allows you to refresh the content displayed within it through a simple pull-to-refresh action. It can load various UI views in its pulling pane, enabling users to initiate the refresh action by pulling down from the top of the view. Additionally, the control offers support for different transition modes and allows comprehensive customization of the user interface. Let’s explore the key features of this new control and the steps to get started with it! ## Key features The key features of the .NET MAUI PullToRefresh control are: - [Pullable content](#Pullable) - [Transition modes](#Transition) - [Custom appearance](#Custom) - [View templating](#View) - [Programmatic support](#Programmatic) ### Pullable content The .NET MAUI PullToRefresh control allows us to display complex views like the ListView, DataGrid, and other customized layouts within the pullable pane using the**PullableContent** property and update the data by performing a pull action. ### Transition modes You can enhance the user experience with animated transitions between the pullable content and the refresh indicator when a user performs a pull action. This can be achieved by setting the **TransitionMode** property. The PullToRefresh control supports the following two types of built-in transitions: - **TransitionMode.SlideOnTop**: The progress animation slides over the pullable content. - **TransitionMode.Push**: The pullable content gets pushed aside to reveal the progress animation. Refer to the following images. | | | | --- | --- | *Different transition modes in .NET MAUI PullToRefresh control* ### Custom appearance You can customize the stroke color, stroke thickness, background, height, and width of the refresh indicator. ![Customizing the appearance of the refresh indicator in the .NET MAUI PullToRefresh control](https://www.syncfusion.com/blogs/wp-content/uploads/2024/01/NET-MAUI-PullToRefresh-with-appearance-customized-progress-indicator.gif) Customizing the appearance of the refresh indicator in the .NET MAUI PullToRefresh control ### View templating Display any view or control in the progress indicator view for both pulling and refreshing actions by setting the [SfPullToRefresh.PullingViewTemplate](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PullToRefresh.SfPullToRefresh.html#Syncfusion_Maui_PullToRefresh_SfPullToRefresh_PullingViewTemplate) and [SfPullToRefresh.RefreshingViewTemplate](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PullToRefresh.SfPullToRefresh.html#Syncfusion_Maui_PullToRefresh_SfPullToRefresh_RefreshingViewTemplate) properties, respectively. ![Custom view template feature in .NET MAUI PullToRefresh control](https://www.syncfusion.com/blogs/wp-content/uploads/2024/01/NET-MAUI-PullToRefresh-with-pulling-and-refreshing-templates.gif) Custom view template feature in .NET MAUI PullToRefresh control ### Programmatic support The PullToRefresh control also allows programmatic refreshing support without UI interaction: - **StartRefreshing()**: To refresh the content without interaction in pullable content. - **EndRefreshing()**: To end the progress animation once the content is refreshed. **Note:** For more details, refer to the .[NET MAUI PullToRefresh control documentation](https://help.syncfusion.com/maui/pull-to-refresh/getting-started) . ## Getting started with the .NET MAUI PullToRefresh control We have seen the key features of the .NET MAUI PullToRefresh control. Let’s see how to add it to your application. ### Step 1: Create a .NET MAUI project First, [create a .NET MAUI project](https://learn.microsoft.com/en-us/dotnet/maui/get-started/first-app?view=net-maui-7.0&tabs=vswin&pivots=devices-android) . ### Step 2: Add the required NuGet package Syncfusion .NET MAUI controls are available in the [NuGet Gallery](https://www.nuget.org/) . To add the .NET MAUI PullToRefresh control to your project, open the NuGet package manager in [Visual Studio](https://visualstudio.microsoft.com/) , and search for [Syncfusion.Maui.PullToRefresh](https://www.nuget.org/packages/Syncfusion.Maui.PullToRefresh) , and then install it. ### Step 3: Register the handler In the **MauiProgram.cs** file, register the handler for Syncfusion core. Refer to the following code. ``` using Syncfusion.Maui.Core.Hosting; public static class MauiProgram { public static MauiApp CreateMauiApp() { var builder = MauiApp.CreateBuilder(); builder .UseMauiApp() .ConfigureSyncfusionCore() .ConfigureFonts(fonts => { fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular"); fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold"); fonts.AddFont("Roboto-Medium.ttf", "Roboto-Medium"); fonts.AddFont("Roboto-Regular.ttf", "Roboto-Regular"); }); return builder.Build(); } } ``` ### Step 4: Add the namespace Add the **Syncfusion.Maui.PullToRefresh** namespace in your XAML page. ``` ``` ### Step 5: Initialize the .NET MAUI PullToRefresh control Then, initialize the .NET MAUI PullToRefresh control using the included namespace. ``` ``` ### Step 6: Defining the PullableContent You can set any view as the **PullableContent** for the ** SfPullToRefresh**control. Refer to the following code example. ``` ....... ....... ....... ....... ....... ....... ....... ``` ### Step 7: Refresh the content by executing the pull-to-refresh action Users can initiate the refresh action by pulling down from the top of the view. Display the progress indicator by setting the **SfPullToRefresh.IsRefreshing** property to ** True** before updating the content. To hide it, set the property to ** False** after updating the content in the ** SfPullToRefresh.Refreshing** event. ``` this.pullToRefresh.Refreshing += this.PullToRefresh_Refreshing; private void PullToRefresh_Refreshing(object? sender, EventArgs args) { this.pullToRefresh!.IsRefreshing = true; Dispatcher.StartTimer( new TimeSpan( 0, 0, 0, 1, 3000), () => { this.UpdateData(); this.pullToRefresh.IsRefreshing = false; return false; }); } ``` After executing these code examples, we’ll get output like in the following image. ![Integrating PullToRefresh control in .NET MAUI app](https://www.syncfusion.com/blogs/wp-content/uploads/2024/01/Integrating-PullToRefresh-control-in-.NET-MAUI-app.gif) Integrating PullToRefresh control in the .NET MAUI app ## GitHub reference For more details, refer to the [.NET MAUI PullToRefresh control demo on GitHub](https://github.com/SyncfusionExamples/getting-started-with-.net-maui-pull-to-refresh) . ## Conclusion Thanks for reading! In this blog, we’ve explored the features of the new Syncfusion [.NET MAUI PullToRefresh](https://www.syncfusion.com/maui-controls/maui-pull-to-refresh) control rolled out in the [2023 Volume 4](https://www.syncfusion.com/forums/185916/essential-studio-2023-volume-4-main-release-v24-1-41-is-available-for-download) release. Try out them and leave your feedback in the comments section given below! Check out our [Release Notes](https://help.syncfusion.com/common/essential-studio/release-notes/v23.1.36) and [What’s New](https://www.syncfusion.com/products/whatsnew) pages to see other controls and features available with this release. For existing Syncfusion customers, the new version is available on the [License and Downloads](https://www.syncfusion.com/account/login) page. If you’re not yet our customer, you can sign up for a [30-day free trial](https://www.syncfusion.com/downloads) to evaluate these features. For questions, you can reach us through our [support forums](https://www.syncfusion.com/forums) , [support portal](https://support.syncfusion.com/) , or [feedback portal](https://www.syncfusion.com/feedback/) . ## Related blogs - [Syncfusion Essential Studio® 2023 Volume 4 Is Here!](https://www.syncfusion.com/blogs/post/essential-studio-2023-volume-4.aspx) - [Chart of the Week: Create a .NET MAUI Stacked Area Chart to Visualize US School Revenue as a Share of GDP by Funding Sources](https://www.syncfusion.com/blogs/post/dotnet-maui-stacked-area-chart-gdp.aspx) - [Introducing the .NET MAUI Navigation Drawer Control](https://www.syncfusion.com/blogs/post/dotnet-maui-navigation-drawer.aspx) - [Chart of the Week: Creating a .NET MAUI Dynamic Bar Race Chart for the Top 10 Populations in the World](https://www.syncfusion.com/blogs/post/dotnet-maui-bar-race-chart.aspx)