alexbrillant / react-native-deck-swiper

tinder like react-native deck swiper

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

'Animated' Warnings

JorgeOrozcoP opened this issue · comments

I have a running deck swipper on my application, but whenever I manually move the cards, I get the following two warnings:

Animated: 'useNativeDriver' was not specified. This is a required option and must be explicitly set to 'true' or 'false'

and

Animated.event now requires a second argument for options

I managed to hide these warnings using console.disableYellowBox = true; I'm pretty new to RN, and I'm wondering if there is a better solution to this. I am using React Native v6.14.4

just search animated.timing on folder ~\node_modules\native-base\dist\src\basic\ and add manually useNativeDriver: true or false

@Remato Can you be more specific please ?
Got the same warnings with RN : 0.62
Not a blocking bug tho

@Remato Can you be more specific please ?
Got the same warnings with RN : 0.62
Not a blocking bug tho

you have to set this manually for the component that is giving this warning, so...

you have a folder node_modules with yours components right?
go to src/node_module/{your_component}

where: your_component is react_native_deck_swipper
search for file Swiper.js open it and add this line here:
Screenshot from 2020-04-14 16-18-31

Animated.timing(this.state.pan, {
      toValue: {
        x: x * SWIPE_MULTIPLY_FACTOR,
        y: y * SWIPE_MULTIPLY_FACTOR
      },
      duration: this.props.swipeAnimationDuration,
      useNativeDriver: true // Add This line
      ...

you can fix this errors manually for all components adding this line "useNativeDriver: true".

**if a component uses other components internally that have the same problem, you can define all the lines with that line too

commented

useNativeDriver: false // Add This line

looks like adding false also works.

useNativeDriver: false // Add This line

looks like adding false also works.

yeah, the warning disappear if you determine any value for this variable

useNativeDriver: true
or
useNativeDriver: false

works fine, but this defines whether the native drive will be used or not, if your application does not use it, it can be set to false
🙂

Won't this just come back whenever I refresh my dependencies

as @adavecohen95 points out, this will come back if library needs to be updated. Ideally this would require a PR. I'd be happy to do one, but I'd need more insight into this library... @alexbrillant ?

@Remato this solution still does not solve the second problem stated in OP: Animated.event now requires a second argument for options, any thoughts?

@ all - Is there a reason not to useNativeDriver by default?

see also react-native-modal/react-native-modal#410

Hi, I found this thread while googling the exactly same error I experienced in different react-native code, and I think that my experience can be helpful to solve the second problem:

Animated.event now requires a second argument for options

The second error occurs if Animated.event has only one argument as the message says.
Animated.event probably requires only one argument in previous version, but it looks like it has changed.

The second argument is specified in https://reactnative.dev/docs/animated#event,

listener: Optional async listener.
useNativeDriver: Uses the native driver when true. Default false.

and we have to include useNativeDriver option while listener is optional.
So I use the following code:

Animated.event([null, { dy: someValue }], { useNativeDriver: true, }),

which was previously:

Animated.event([null, { dy: someValue }]), // wrong

Maybe somewhere in the react-native-deck-swiper, there is Animated.event() function with a single arguments.
I don't know where the right place of source code in this library to fix the problem is, so it may need some time for me to send PR fixing this issue.

Before that, I wrote this comment first because I hope this comment would be helpful for other users.

Oh, I'm late 🤦 I found that the following PR already fixes the problem that I said.

fb9fbd6