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

Change animation of list view to collapse/expand

Is there any POC to change the animation of list view to simple collapse/expand?

1 Reply

CI Christopher Issac Sunder K Syncfusion Team April 1, 2019 10:06 AM UTC

Hi Sonam, 

Greetings from Syncfusion!! 

When you are trying to add an animation to the listview, you need to assign animation property to listview component. This property have predefined animation settings like durationeffectseasing(linear,ease,etc). Please refer the below code snippet for your clear understanding, 

//initializing values for animation 
private animation: any = { 
    duration: 2000, 
    effect: "SlideLeft", 
    easing: "ease-in" 
//Assigning animation property 
<ListViewComponent id="list" dataSource={ this.arts } animation={ this.animation } /> 

You can change the animation settings to customize it as per your need. We have created an online sample for using animation in the listview and the link has given below 

Please get back to us if you have any concerns. 


Live Chat Icon For mobile
Up arrow icon