Card Flip Animation

Thread is closed for posting
2 posts, 0 answers
  1. rkoval
    rkoval avatar
    1 posts
    Member since:
    Jun 2007

    Posted 22 Jul 2011 Link to this post


    I'd like to create animation effect on Image or other UI element that simulates card flip. I have tried using RadPlaneAnimation but it only does half of the flip that I need. While animation I need to replace one image with another (face and back of the card). Does anyone have example how this could be done?

    Many thanks

  2. Deyan
    Deyan avatar
    2147 posts

    Posted 27 Jul 2011 Link to this post

    Hello Rkoval,

    Thanks for writing and for your question.

    Currently we do not have an example of this scenario. It is, however, quite easy to implement. You just need to have two RadPlaneAnimation instances that animate each image When the first animation finishes, the second one is started. The difference between both animations will be the start and end values of the animated properties. The first animation would animate its image starting from 0 to 90 degrees, while the second one will animate it from 270 to 360 degrees. In this way you should be able to achieve the desired effect provided that both images are rotated around the same axis, have the same size and location.

    I hope this helps.

    Kind regards,
    the Telerik team

    Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!

Back to Top