Vertical Cards View with an animation to transit between cards

I have a requirement that there can be 4 to 10 cards arranged vertically such that the Bottom Card (currently active card) will be fully visible and that card needs to have an expand collapse option to show some additional information. Some portion (a label) of all the cards need to be visible always. Top Card will be behind all other cards. When the Bottom Card is swiped/dragged towards left or right, I need to have an animation that the bottom card goes behind all other cards and becomes the Top Card and the card that was immediately behind(above) the swiped bottom card becomes the new Bottom Card (active card). I am trying to achieve this requirement but I didn't found solution. Can this requirement be achieved using Syncfusion cards control? I have attached the required kind of animation video and images of mock up UI of the card layout to give an idea about the UI and the animation.

Attachment: Card_Animation_Requirement_9ae5298b.zip

2 Replies

SJ Suyamburaja Jayakumar Syncfusion Team July 1, 2020 04:13 PM UTC

Hi Sreenesh Pai, 
 
Greetings from Syncfusion. 
 
We would like to let you know that currently we don’t have a support for Vertical and horizontal alignments of cards. We have planning to consider this as feature and now we are validating the feasibility of achieving the same through feature implementation. Hence, we will update the complete details on July 2,2020. 
 
Regards, 
Suyamburaja J. 



SJ Suyamburaja Jayakumar Syncfusion Team July 2, 2020 02:53 PM UTC

Hi Sreenesh Pai, 
 
We would like to let you know that we have considered this as a feature request and logged a feature request. Please find the below feedback link to track the status of the feature,  
  
   
Please cast your vote to make it count. We will prioritize the features every release based on the demands and we do not have an immediate plan to implement this feature since we committed with already planned work. So, this feature will be available in any of our upcoming releases.   
    
If you have any more specification/suggestions to the feature request, you can add it as a comment in the portal.   
 
Regards, 
Suyamburaja J. 


Loader.
Up arrow icon