search

jgero / roesena-app

Cross platform Web-App with user-created content and event manager
https://rösena.de/
0 stars 1 forks source link

animation improvements #267

Open jgero opened 3 years ago

jgero commented 3 years ago

The current fade-in looks a bit like it loaded slow or something. It would be better if the heading is visible first and the rest of the page appears after. If the order of the animations in different sections corresponds to the order the user is supposed to look at the info it would make it way clearer when looking at the app.

jgero commented 3 years ago

The animation when going back an forward between pages on the overview pages is broken. The fix is probably to temporarily set the array of the elements to an empty array and then re-populate it again when the data arrives.

jgero commented 3 years ago

When the value of the variable in ngForchanges it only swaps the content int the generated components and does not re-render the elements. By adding some id that changes when switching pages and triggering the animation on every state transition you get the desired behavior.

jgero commented 3 years ago

In some pages it is fixed now. The trick is using a state in the animation to tell angular when to trigger the animation. Then only the animation state has to be changed to trigger the animation.