react-native-progress-bar-animated
react-native-progress-bar-animated copied to clipboard
Native Driver warning leads to force close and apps reload.
WARN useNativeDriver
was not specified. This is a required option and must be explicitly set to true
or false
. In my case, after getting this warn, the view reload itself.
me too
I fixed this by adding: userNativeDriver: true,
To AnimatedProgressBar.js
animateWidth() {
const toValue = ((this.props.width * this.state.progress) / 100) - this.props.borderWidth * 2;
Animated.timing(this.widthAnimation, {
easing: Easing[this.props.barEasing],
toValue: toValue > 0 ? toValue : 0,
duration: this.props.barAnimationDuration,
userNativeDriver: true,
}).start();
}
animateBackground() {
Animated.timing(this.backgroundAnimation, {
toValue: 1,
duration: this.props.backgroundAnimationDuration,
userNativeDriver: true,
}).start();
}
I fixed this by adding: userNativeDriver: true,
To AnimatedProgressBar.js
animateWidth() { const toValue = ((this.props.width * this.state.progress) / 100) - this.props.borderWidth * 2; Animated.timing(this.widthAnimation, { easing: Easing[this.props.barEasing], toValue: toValue > 0 ? toValue : 0, duration: this.props.barAnimationDuration, userNativeDriver: true, }).start(); } animateBackground() { Animated.timing(this.backgroundAnimation, { toValue: 1, duration: this.props.backgroundAnimationDuration, userNativeDriver: true, }).start(); }
I already made a pull request on that the day I reported the issue. Still no response from the owner.
Any update?
I resolved. You should add library code useNativeDriver: true (or false)!
I resolved. You should add library code useNativeDriver: true (or false)!
Not Working
Any updates? it's just one row please update it that warn drives me mad.
Any updates? it's just one row please update it that warn drives me mad.
Still waiting for the merge mate.😅
Any updates?? I am also getting this useNativeDriver
warning.
Hi just as a quick fix you can create this file as patches/react-native-progress-bar-animated+1.0.6.patch
in your root repo dir and set it's value to
diff --git a/node_modules/react-native-progress-bar-animated/src/AnimatedProgressBar.js b/node_modules/react-native-progress-bar-animated/src/AnimatedProgressBar.js
index 8ba19be..4963b58 100644
--- a/node_modules/react-native-progress-bar-animated/src/AnimatedProgressBar.js
+++ b/node_modules/react-native-progress-bar-animated/src/AnimatedProgressBar.js
@@ -61,6 +61,7 @@ class ProgressBar extends React.Component {
easing: Easing[this.props.barEasing],
toValue: toValue > 0 ? toValue : 0,
duration: this.props.barAnimationDuration,
+ useNativeDriver: false
}).start();
}
then run yarn patch-package
to fix that.
You can also add it to your package.json
file for a more automated workflow:
"scripts": {
+ "postinstall": "patch-package"
}
Any updates??
Any updates??
Hey man, i dont think this will ever be merged but its easy to apply yourself. Since he probably isn't ever going to be updated again i've made my own patch using https://www.npmjs.com/package/patch-package including Lineargradient from expo-linear-gradient https://docs.expo.dev/versions/latest/sdk/linear-gradient/. I also did as some here have done and added useNativeDriver: false on 3 lines in the AnimatedProgressBar.js file. My full patch is on the LinearGradient issue: #22 Hope this helps !