Live Chat Icon For mobile
Live Chat Icon
Popular Categories.NET  (161).NET Core  (29).NET MAUI  (64)Angular  (74)ASP.NET  (50)ASP.NET Core  (79)ASP.NET MVC  (88)Azure  (36)Blazor  (153)DocIO  (23)Essential JS 2  (85)Essential Studio  (174)File Formats  (29)Flutter  (123)JavaScript  (187)Microsoft  (113)PDF  (67)React  (62)Succinctly series  (128)Syncfusion  (610)TypeScript  (31)Uno Platform  (3)UWP  (4)Vue  (39)Webinar  (35)Windows Forms  (59)WinUI  (52)WPF  (138)Xamarin  (155)XlsIO  (25)Other CategoriesBarcode  (5)BI  (29)Bold BI  (5)Build conference  (6)Business intelligence  (54)Button  (4)C#  (120)Chart  (57)Cloud  (12)Company  (445)Dashboard  (8)Data Science  (3)Data Validation  (6)DataGrid  (55)Development  (400)Doc  (7)DockingManager  (1)eBook  (96)Enterprise  (22)Entity Framework  (5)Essential Tools  (14)Excel  (23)Extensions  (18)File Manager  (4)Gantt  (11)Gauge  (11)Git  (4)Grid  (28)HTML  (11)Installer  (2)Knockout  (2)Language  (1)LINQPad  (1)Linux  (2)M-Commerce  (1)Metro Studio  (11)Mobile  (312)Mobile MVC  (9)OLAP server  (1)Open source  (1)Orubase  (12)Partners  (21)PDF viewer  (30)Performance  (9)PHP  (1)PivotGrid  (4)Predictive Analytics  (6)Report Server  (3)Reporting  (10)Reporting / Back Office  (11)Rich Text Editor  (7)Road Map  (10)Scheduler  (36)SfDataGrid  (9)Silverlight  (21)Sneak Peek  (22)Solution Services  (3)Spreadsheet  (11)SQL  (8)Stock Chart  (1)Surface  (4)Tablets  (5)Theme  (11)Tips and Tricks  (92)UI  (224)Uncategorized  (68)Unix  (2)User interface  (68)Visual State Manager  (2)Visual Studio  (23)Visual Studio Code  (17)Web  (375)What's new  (213)Windows 8  (19)Windows App  (2)Windows Phone  (15)Windows Phone 7  (9)WinRT  (26)
Share on twitter
Share on facebook
Share on linkedin
Introducing the New WinUI Busy Indicator Control

Introducing the New WinUI Busy Indicator Control

We at Syncfusion are happy to announce the inclusion of the new WinUI Busy Indicator control in the 2022 Volume 3 release.

The WinUI Busy Indicator control is used to display a predefined animation when an operation runs in the background of an application and the user waits for its completion. It can be customized in terms of size, color, duration, and content.

Its key features are:

Let’s cover each briefly and see the steps to get started with the WinUI Busy Indicator control.

Animation types

It supports the following seven prebuilt animation types, and you can pick the one that satisfies your need:

  • Dotted Circle
  • Dotted Circular Fluent
  • Dotted Linear
  • Double Circle
  • Linear Box
  • Linear Oscillating Box
  • Single Circle

You can see each animation type in action in the following graphic.

Busy Indicator Animation Types
Busy Indicator Animation Types

Busy content

You can set a custom message that indicates the busy status of the control to users. You can also place the busy content at the top, bottom, left, or right of the Busy Indicator, as well as customize it using the DataTemplate support.

Refer to the following images.

Placing Busy Content at the Top of the WinUI Busy Indicator
Placing Busy Content at the Top of the WinUI Busy Indicator
Customizing the WinUI Busy Indicator’s Content with Template Support
Customizing the WinUI Busy Indicator’s Content with Template Support

Duration

The WinUI Busy Indicator control allows users to customize the animation speed with values ranging from 0 to 1.

Busy Indicator with Custom Duration
Busy Indicator with Custom Duration

Size

You can customize the size of the Busy Indicator with values ranging from 0 to 1.

Busy Indicator with Custom Size
Busy Indicator with Custom Size

Color

Also, customize the color of the indicator based on your requirements.

Busy Indicator with Custom Color
Busy Indicator with Custom Color

Getting started with the WinUI Busy Indicator control

Now that we’ve seen the features of the WinUI Busy Indicator control, let’s see the steps to get started with it.

Step 1: Create a WinUI application.

First, follow the guidelines in the Create your first WinUI 3 (Windows App SDK) project documentation to create a simple WinUI project.

Step 2: Add the Syncfusion.Notifications.WinUI NuGet package.

Then, install the latest Syncfusion.Notifications.WinUI NuGet package in your project from the NuGet Gallery or from the installed location, C:\Program Files (x86)\Syncfusion\Essential Studio\WinUI\xx.x.x.xx\NuGetPackages.

Note: xx.x.x.xx denotes the version of the installed Syncfusion WinUI Notifications package.

Step 3: Add the namespace.

Now, include the Syncfusion.UI.Xaml.Notifications namespace in your XAML file with the following code.

xmlns:syncfusion="using:Syncfusion.UI.Xaml.Notifications"

Step 4: Initialize the Busy Indicator control.

Finally, initialize the WinUI Busy Indicator control with the required animation type and content as shown in the following code example.

<Page
   x:Class="GettingStarted.MainPage"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:local="using:GettingStarted"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:syncfusion="using:Syncfusion.UI.Xaml.Core"
     mc:Ignorable="d"
     Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
 
 <Grid>
  <syncfusion:SfBusyIndicator  IsActive="True"
                               AnimationType="DottedCircle"
                               BusyContent="Loading…" />
 </Grid>
 
</Page>

After executing the above code, we will have a page populated with the Busy Indicator control like in the following output image.

WinUI Busy Indicator Control
WinUI Busy Indicator Control

Conclusion

Thanks for reading! I hope you enjoyed learning about the new Syncfusion WinUI Busy Indicator control and its features available in our 2022 Volume 3 release. Also, check out our Release Notes and What’s New pages to see all the new updates in this release. Try them out and leave your feedback in the comments section below!

You can download and check out our WinUI demo app in the Microsoft Store.

For current customers, the new version is available for download from the License and Downloads page. If you are not yet a Syncfusion customer, you can try our 30-day free trial to check out our newest features.

You can also contact us through our support forums, support portal, or feedback portal. We are always happy to assist you!

Related blogs

Tags:

Share this post:

Share on twitter
Share on facebook
Share on linkedin
Popular Now

Be the first to get updates

Subscribe RSS feed
Scroll To Top