Thank you once again for the last update that you submitted, so this is what i was planning on designing, checkout this Tinycards game animation that i recorded on my phone.You will notice that when the animation starts the card comes UP from the bottom of the screen then stops at a certain point before it slides off the screen on the X axis. That is what i want to do for this next phase.
My questions is
- Please can you rather than write the code, describe to me how to solve the problem, i want to see if i can write the code instead. I have actually done something but it doesnt work you can check it out @ QuestionsCard.js
The essense of this project is to build a clone of the animations found in the Android app - tinycards from duolingo. Am only trying to replicate one screen for the walk-through, but in that screen there are a couple of animations namely:
- a rotateY transform when you click a card - that is the part that i currently have in the application
- a spring animation (i think) that moves a card with fixed height and width from the bottom of the screen to a certain location and then transforms (using translateX i suppose) the card off the screen.
- The screen i have currently has a TapGesture handler to flip the card but the animation is not exactly correct and am not sure what am doing wrongly. The Component to check is Card.js
- How do i get started with the second animation, please kindly direct me with some resource or general description of a fix.