The person expertise of an software begins from the second it’s launched till the person exits, and it performs a significant function in participating the person. Subsequently, guaranteeing an exemplary person interface is important for any app.
Exhibiting an empty display whereas loading information within the background can mess up the person expertise. Loading indicators assist us make the app look responsive as a substitute. Within the Important Studio 2023 Quantity 1 launch, Syncfusion launched a brand new loading indicator management within the .NET MAUI platform, the Shimmer management.
The brand new .NET MAUI Shimmer management gives a seamless person expertise whereas the app fetches information from both native or distant sources. It really works by exhibiting a preview of the particular view displayed on the app moderately than a loading animation. This helps us simply perceive the loaded content material whereas offering a extra visually interesting person expertise.
On this weblog, we’ll see the important thing options of the .NET MAUI Shimmer management and the steps to get began with it.
Constructed-in shimmer impact views
The .NET MAUI Shimmer management helps seven built-in shimmer impact views that may be assigned utilizing the Kind property. These shimmer sorts are: circle, sq., profile, article, video, feed, and procuring. By default, the circle persona view is assigned to the management.
Every view has its distinctive shimmer impact, permitting builders to decide on the one that most closely fits their app’s UI design. The flexibleness of customizing the shimmer view in keeping with particular necessities may help builders improve their app’s general person expertise.
 |
 |
Customized shimmer impact view
You too can simply create and combine a customized shimmer impact view. To take action, set the CustomView property to the specified view, after which the shimmer impact will likely be utilized. This may present a extra customized and interesting person expertise.
To customise the form of the customized view, you need to use the ShimmerView class with totally different ShapeTypes. It helps three shapes: rectangle, circle, and rounded rectangle. By default, the form kind is about to rectangle.
Customizing the shimmer view and its results
Customizing the .NET MAUI Shimmer management is straightforward. You may alter the colour, wave colour, wave width, repeat rely, animation period, and wave route properties to create a shimmer impact that matches your app’s design.
As an example, you possibly can set the repeat rely to find out how typically the shimmer impact ought to be rendered or change the wave route to make the shimmer transfer horizontally or vertically. By experimenting with totally different mixtures of properties, you possibly can obtain a novel and attention-grabbing shimmer impact.
 |
 |
 |
 |
 |
 |
Integrating .NET MAUI Shimmer management into your app
Word: Earlier than continuing, please consult with the .NET MAUI Shimmer management getting began documentation.
The .NET MAUI Shimmer is a content material view that accepts any structure and reveals it with a shimmer impact. The shimmer animation impact will likely be displayed if the IsActive property worth is about to true, and both built-in or customized views can be utilized to outline the shimmer animation view.
Consult with the next code instance. In it, we have now used the Article shimmer impact kind.
<ContentPage
. . .
xmlns:shimmer="clr-namespace:Syncfusion.Maui.Shimmer;meeting=Syncfusion.Maui.Core">
<shimmer:SfShimmer x:Identify="Shimmer" Kind="Article">
<Grid>
…
</Grid>
</shimmer:SfShimmer>
</ContentPage>
Conclusion
Thanks for studying! The Syncfusion .NET MAUI Shimmer is a strong device for enhancing your app’s person expertise. By utilizing its built-in views or creating customized views, you possibly can add a shimmer impact to any view and make it extra visually interesting. With its varied customization choices, you possibly can tailor the shimmer impact to suit your particular design wants.
This management is on the market in our 2023 Quantity 1 launch. Try our Launch Notes and What’s New pages to see the opposite new updates on this launch.
Additionally, attempt our .NET MAUI management demos on GitHub and share your suggestions or ask questions within the feedback part beneath. If you’re not a Syncfusion buyer, attempt our 30-day free trial to see how our elements can improve your tasks.
For questions, you may also attain us by way of our help discussion board, help portal, or suggestions portal. We’re at all times completely happy to help you!
