Skip to content

withRepeat using array will not reverse #6799

Closed
@odogono

Description

Description

A shared value which contains a number array will not behave as expected with a withRepeat hook.

If the parameters of the withRepeat hook are set to reverse, the sharedValue will increment to the desired value correctly, but then instead of reversing back to the original value, it will remain.

I have checked the behaviour with object ( {x:0} ) and number values, and they behave as expected.

I did some limited debugging, and I observe that the repeat animation.startValue is referentially the same as the nextAnimation.current when an array is used during the "forward" part of the animation, but when an object or a number is used the value reference is different (within /packages/react-native-reanimated/src/animation/repeat.ts)

Steps to reproduce

  1. create a shared value containing a number array
const arrayValue = useSharedValue([0]);
  1. set up a repeated timing
arrayValue.value = withRepeat(
      withTiming([30], { duration: 1000 } ),
      2,
      true);
  1. Observe the value changing
useAnimatedReaction(
  () => arrayValue.value,
  (value) => {
        console.log('value', value);
   }
);

Snack or a link to a repository

https://snack.expo.dev/@odogono/uplifting-green-waffles

Reanimated version

3.16.3

React Native version

0.76.3

Platforms

Android, iOS

JavaScript runtime

None

Workflow

None

Architecture

Fabric (New Architecture)

Build type

None

Device

iOS simulator

Device model

No response

Acknowledgements

Yes

Metadata

Labels

Platform: AndroidThis issue is specific to AndroidPlatform: iOSThis issue is specific to iOSRepro providedA reproduction with a snippet of code, snack or repo is provided

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions