React-native-paper: Warning - Animated : UseNativeDriver was not specified

[stephpasquini]

Environment

React native : 0.62.1
React native paper : 3.7.0

Description

I have a new warning message after upgrading my project to React Native 0.62.1:
Animated: useNativeDriver was not specified. This is a required option and must be explicitly set to true or false

Reproducible Demo

The warning message is fired after clicking on the Button component.

The Button components and few others components don't have useNativeDriver set to true

[fmsouza]

I'm experiencing the same thing.

[shubhamtakode]

Any work around to fix this temporarily ?

[fmsouza]

@shubhamtakode you can always go directly to the file and modify the code. It's ugly and hard, as it's already compiled, but works.

It's in node_modules/react-native-paper/lib/module/components/Button.js.
Look for Animated.timing, add useNativeDriver: false right after duration:200*scale.
There are two places to do that, though.

Note: it's not a permanent fix. Whenever you change dependencies or reinstall (npm install) the app it might be cleared again.

[ntcong91]

+1 same in react-native 0.62

[Trancever]

For now, you can use patch-package. We have an open PR that fixes it but we need to figure out a good strategy for releasing it cause it requires us to drop support for RN < 0.60 which is a breaking change unfortunately.

[anteeek]

The issue also seems to affect FAB.Group. The same warning is displayed and the animation is delayed by a bit when the group is expanded

[MBach]

The issue also seems to affect FAB.Group. The same warning is displayed and the animation is delayed by a bit when the group is expanded

and the Chip component too

[stephpasquini]

The issue also affects the CheckBox component

[Trancever]

Fixed in v3.8

[stephpasquini]

I still have some issues with the CheckBoxAndroid component

[berksafran]

I still have some issues with the CheckBoxAndroid component

Me too. CheckBox (CheckBox.Android and CheckBox.IOS) needs an update.

[Samranvirk44]

I,m also facing this issue anyone here to help me?

[Hasnain-code]

Solution:
just add useNativeDriver: true to the animation config

Animated.timing(formHeight,{
toValue:height/2.5,
duration:600,
easing:Easing.bezier(0,1.19,0.74,1.2),
useNativeDriver:true. //Add this line
}).start();

[tranhoangduong1994]

I'm using 3.10.1 and it seems fixed now.

[imamrobani]

RN 0.62
Animated.timing(
this.state.fadeAnim,
{
toValue: 1,
duration: 2000,
useNativeDriver: true ---> Add this
}
).start()

[sharmapr25]

Solution:
just add useNativeDriver: false to the animation config

Animated.timing(formHeight,{useNativeDriver:false. //Add this line }).start();

[devamiya]

If still someone is getting this error they can ignore it by placing below two lines of code.

import {YellowBox} from 'react-native';
YellowBox.ignoreWarnings(['Animated: `useNativeDriver` was not specified. This is a required option and must be explicitly set to `true` or `false`']);

[rjbl16]

En mi caso para ignorar esta advertencia, app.js principal y agregue lo siguiente:
de igual manera pueden ir agregando mas advertencia que se desea ignorar dentro del arreglo.
import { LogBox } from "react-native";

LogBox.ignoreLogs([
"Animated: useNativeDriver was not specified. This is a required option and must be explicitly set to true or false",
"Setting a timer"
]);

a mi me funciono, espero los ayude.