search

PowerlineApp / powerline-rn

GNU Affero General Public License v3.0
0 stars 6 forks source link

Advanced Animations/Interactions #285

Closed jterps08 closed 6 years ago

jterps08 commented 6 years ago

https://github.com/oblador/react-native-animatable (Bounce, Bouncing Entrance, Zooming Entrance/Exit) https://github.com/wix/react-native-interactable (Collapsible Header) https://facebook.github.io/react-native/docs/performance.html

In Order of Priority Upvote Button - Tada (attention seeker) Sign Button - Tada (attention seeker) Downvote Button - Shake (attention seeker) Reply Button - Flash (attention seeker) New Item Menu - BounceInUp (open) / BounceInOut (close) New Post - fadeInUp / fadeOutDown New Petition - fadeInUp / fadeOutDown Item Detail Screen - fadeIn / fadeOut... Item Detail Screen - Collapsible Header (already working / skip) Group Feed Header - Collapsible Header

We will use react-native-interactable for a future effort called Branded Announcements.

piubellofelipe commented 6 years ago

@jterps08 -Reply Button - Flash (attention seeker) <- this one I just implemented, but it's practically imperceptible - the screen navigates before the animation even starts.

piubellofelipe commented 6 years ago

also, animations for "New Post", "New Petition", "Item Detail Screen" were implemented without react-native-animatable, but using react-native-router-flux "" props. need you to check if it's enough for ours needs.

I found it difficult to implement for "New Menu Item" because of current "react-native-popup-menu" being used for "New Item Menu", might take some time to discover how to do this / find another tool supporting this animation / implement it myself, might leave it for later because of priority.

jterps08 commented 6 years ago

@piubellofelipe we can discuss. It's low priority, but we might need to replace this popup and the dropdown popup. The performance on those pop ups should be much better.