Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Easy way to disable animations #129

Open
almostintuitive opened this issue Jun 20, 2017 · 4 comments
Open

Easy way to disable animations #129

almostintuitive opened this issue Jun 20, 2017 · 4 comments

Comments

@almostintuitive
Copy link
Contributor

Hi!

We're using this library heavily, and we love it!:)

There an issue we've faced lately with react native itself: on older devices, rendering itself is slow. Even without animations, we're dropping frames. But adding appearance animations adds on top of that, and during fast interactions, creates a noticable lag, where react native is just executing the queued up animations.

Currently, I haven't found an easy way to disable animations within the animatable components, but it'd be great if we didn't have to write either an additional wrapper around all animatable components.

A simple animation = "none" would suffice :).

I'm happy to contribute this to the repo - but before forking & submitting a pull request, wanted to ask if it'll be accepted or not.

Thanks!

Mark

@oblador
Copy link
Owner

oblador commented Jun 20, 2017

Hey, passing something falsy as animation should effectively disable the animation, but if you're having perf issues I'd look into the useNativeDriver prop.

@bilalsyed001
Copy link

Try animation={undefined}

@smerkousdavid
Copy link

smerkousdavid commented Aug 12, 2018

I think @itchingpixels has a great idea as some of the more complicated animations - on multiple view levels - can be produce a ton of frame lose on old phones, some properties don't support native driver and it can't be the solution to all custom animations. Nevertheless, having a way to disable animations or enable them would be amazing as I'm planning on having an option to disable them completely for people who want a faster and more functional experience. For the animation promises it could just check if not enabled and return the end with an 'incomplete' or 'disabled' string, and the View wrappers could simply not start the animation. It would be nice to have an easy way to disable animations.

@cjpete
Copy link

cjpete commented Jun 25, 2019

This is relevant for use cases other than just performance. Sometimes you want to use the same list but only animate under certain scenarios. I.e. don't animate items in on first load, or when changing sort order, but do when moving items around in a list.

I think this is currently only possible when using the 'imperative' style API, and creating a custom animation controller, though it does seem to short-circuit the animation if the code in createAnimatableComponent is changed to allow for a duration of 0.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants