DevExpress Shimmer View for MAUI
- 2 minutes to read
The DevExpress.Maui.Controls.ShimmerView control allows you to add a shimmer effect when loading data in your mobile app.

Add a Shimmer View to the Page
Download and install the DevExpress.Maui.Controls package to obtain the ShimmerView component.
Refer to the following help topics for more information:
- Install Packages from NuGet.org: Visual Studio, VS Code, and JetBrains Rider
- Get Started with DevExpress Controls for .NET Multi-platform App UI (.NET MAUI)
To show the predefined skeleton screen (a gray rectangle with shimmer effects) above primary content, follow the steps below:
- Add a
ShimmerViewto the page. - Populate ShimmerView.Content with UI elements that appear once the loading operation ends. The
ShimmerView.Contentproperty is a content property. You can skip the<Content>tag in your markup. - Set the ShimmerView.IsLoading property to
trueto show shimmer animation. OnceIsLoadingswitches tofalse, theShimmerViewreplaces the animation with the UI elements you specified. - Additionally, you can set the ShimmerView.WaveDuration property to speed up or slow down animation speed.

<ContentPage
xmlns:dx="http://schemas.devexpress.com/maui">
<VerticalStackLayout>
<Switch x:Name="switch" IsToggled="True" HorizontalOptions="Start" />
<dx:ShimmerView IsLoading="{Binding Source={x:Reference switch}, Path=IsToggled, Mode=TwoWay}"
HeightRequest="500" WaveDuration="00:00:02.00">
<Image Source="devexpress_logo_extra_large_color" WidthRequest="200" HeightRequest="200"/>
</dx:ShimmerView>
</VerticalStackLayout>
</ContentPage>
Next Steps
- Layout
- Explains how to create a custom skeleton screen.
- Custom Appearance
- Describes how to customize shimmer wave appearance settings.
Related Examples
The following examples show how to use the ShimmerView control in your .NET MAUI App: