We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

Problem Actived Shimmer in Template Listview


I have a listview which loads data via a viewmodel. I have inserted a Shimmer in the Itemplate only that I cannot activate and deactivate the Active property when loading the listview data.

In practice I would like the shimmer to be activated when the page is opened and deactivated when the data has been loaded into the Listview.

I attach a folder with the files I use inside.

I ask you to make me understand on my code where I am wrong.

Thank you

Attachment: file_4a1af67.zip

3 Replies

ET Eswaran Thirugnanasambandam Syncfusion Team November 16, 2022 08:30 AM

We checked the provide code snippet and we would like to inform that, when the shimmer is placed inside the SfListView ItemTemplate, the shimmer animation will not be displayed since the shimmer control is not initialized. So, adding the shimmer control inside the SfListView is not a good approach.

Adding the SfListView as content to the shimmer control will achieve your requirement. The shimmer control will now be initialized before the SfListView item source is updated, allowing us to display the shimmer animation.

Using CustomView, we can customize the shimmer control view similar to the SfListView data.  Please refer the below User Guide links to know more details



Now we have modified the sample to achieve your requirement and prepared a video to show shimmer animation before the SfListView data is loaded. Please get the sample and video from the below attachment.

Attachment: Shimmer_ca49a7bd.zip

FA Fabio November 17, 2022 10:17 AM


Thanks for the help I modified the code a little taking inspiration from your example and it's ok but the biggest problem is that the records in the listview are loaded from the viewmodel and from the db and therefore I would like to have the same number of rows loaded in the shimmer (grid ) which I get from the db and not manually like in your example.

I attach the files of the xaml code and the resources code as well as an image of how the shimmer is currently seen.

Thanks for your help

Attachment: File_d41f2517.zip

ET Eswaran Thirugnanasambandam Syncfusion Team November 18, 2022 12:36 PM

Fabio, we checked the provided code snippet, and we would like to inform that SfShimmer control will be loaded first before the SfListview data are fetched from the viewmodel or DataBase. So, we can’t get the total number of rows listed in the SfListview control. Also, instead of creating the layout for total number of rows listed, we recommend you add a aproximate number of custom view layouts based on the screen size resolution. We have modified your sample to achieve your requirement and please get it from the below attachment.

Attachment: Shimmer_677314fb.zip

Live Chat Icon For mobile
Up arrow icon