Skip to content

Commit 6481cb6

Browse files
authored
fix: Explicitly set "useNativeDriver" to false (#404)
Fixes #402 Users are getting a warn about setting "useNativeDriver" to true or false, so we explicitly set it to false in the modal. Also, minor cleanup.
1 parent b1c893f commit 6481cb6

File tree

1 file changed

+8
-5
lines changed

1 file changed

+8
-5
lines changed

src/Modal.js

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,9 @@ import {
1010
TouchableWithoutFeedback
1111
} from "react-native";
1212

13+
const MODAL_ANIM_DURATION = 300;
14+
const MODAL_BACKDROP_OPACITY = 0.4;
15+
1316
export class Modal extends Component {
1417
static propTypes = {
1518
onBackdropPress: PropTypes.func,
@@ -76,8 +79,8 @@ export class Modal extends Component {
7679
Animated.timing(this.animVal, {
7780
easing: Easing.inOut(Easing.quad),
7881
// Using native driver in the modal makes the content flash
79-
// useNativeDriver: true,
80-
duration: 300,
82+
useNativeDriver: false,
83+
duration: MODAL_ANIM_DURATION,
8184
toValue: 1
8285
}).start();
8386
};
@@ -86,8 +89,8 @@ export class Modal extends Component {
8689
Animated.timing(this.animVal, {
8790
easing: Easing.inOut(Easing.quad),
8891
// Using native driver in the modal makes the content flash
89-
// useNativeDriver: true,
90-
duration: 300,
92+
useNativeDriver: false,
93+
duration: MODAL_ANIM_DURATION,
9194
toValue: 0
9295
}).start(() => {
9396
if (this._isMounted) {
@@ -102,7 +105,7 @@ export class Modal extends Component {
102105
const backdropAnimatedStyle = {
103106
opacity: this.animVal.interpolate({
104107
inputRange: [0, 1],
105-
outputRange: [0, 0.4]
108+
outputRange: [0, MODAL_BACKDROP_OPACITY]
106109
})
107110
};
108111
const contentAnimatedStyle = {

0 commit comments

Comments
 (0)