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

Animated.loop doesn't work as expected in combination with Animated.sequence #20560

Closed
sokki opened this issue Aug 7, 2018 · 2 comments
Closed
Labels
API: Animated Stale There has been a lack of activity on this issue and it may be closed soon.

Comments

@sokki
Copy link
Contributor

sokki commented Aug 7, 2018

Environment

  React Native Environment Info:
    System:
      OS: macOS High Sierra 10.13.6
      CPU: x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
      Memory: 720.97 MB / 16.00 GB
      Shell: 5.3 - /bin/zsh
    Binaries:
      Node: 8.9.4 - ~/.nvm/versions/node/v8.9.4/bin/node
      Yarn: 1.6.0 - /usr/local/bin/yarn
      npm: 6.1.0 - ~/.nvm/versions/node/v8.9.4/bin/npm
      Watchman: 4.9.0 - /usr/local/bin/watchman
    SDKs:
      iOS SDK:
        Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
      Android SDK:
        Build Tools: 25.0.3, 26.0.1, 27.0.3
        API Levels: 23, 26
    IDEs:
      Xcode: 9.4.1/9F2000 - /usr/bin/xcodebuild
    npmPackages:
      react: ^16.4.2 => 16.4.2
      react-native: ^0.56.0 => 0.56.0
    npmGlobalPackages:
      create-react-native-app: 1.0.0
      react-native-cli: 2.0.1

Description

Currently, Animated.loop calls animation.reset() before each iteration. That makes sense in most cases. However, when looping a Animated.sequence one might want to loop between the animations in the sequence without falling back to the initial value on each iteration.

Some people faced the same issue:

I would propose to add a new a config to Animated.loop like:

Animated.loop(Animated.sequence(animations), {resetBeforeIteration:false})

Reproducible Demo

MCVE: https://snack.expo.io/@sokki/animated-loop

  state = {
    animated: new Animated.Value(0),
  };

  animate() {
    // What I want:
    // 0-1-2-1-2-1-2 etc.
    // What I get:
    // 0-1-2-0-1-2 etc.
    Animated.loop(
      Animated.sequence([
        Animated.timing(this.state.animated, {
          toValue: 1,
        }),
        Animated.timing(this.state.animated, {
          toValue: 2,
        }),
      ])
    ).start();
  }
@stale
Copy link

stale bot commented Dec 21, 2018

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as "For Discussion" or "Good first issue" and I will leave it open. Thank you for your contributions.

@stale stale bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label Dec 21, 2018
@stale
Copy link

stale bot commented Dec 28, 2018

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.

@stale stale bot closed this as completed Dec 28, 2018
@facebook facebook locked as resolved and limited conversation to collaborators Dec 29, 2018
facebook-github-bot pushed a commit that referenced this issue Feb 15, 2019
Summary:
Fixes #20560
Pull Request resolved: #20561

Differential Revision: D14103437

Pulled By: cpojer

fbshipit-source-id: 35f2b3426304248e1a28f6a88812f07414618ea2
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
API: Animated Stale There has been a lack of activity on this issue and it may be closed soon.
Projects
None yet
Development

No branches or pull requests

3 participants