Swiping gesture isn't visible and modal wont hide before releasing the finger

Info:

System: OS: Windows 10 CPU: (8) x64 Intel® Core™ i7-6700HQ CPU @ 2.60GHz Memory: 834.24 MB / 11.90 GB Binaries: Node: 10.15.0 - C:\Program Files\nodejs\node.EXE Yarn: 1.15.2 - C:\Program Files (x86)\Yarn\bin\yarn.CMD npm: 6.9.0 - C:\Program Files\nodejs\npm.CMD Watchman: 4.9.4 - C:\watchman\watchman.EXE IDEs: Android Studio: Version 3.1.0.0 AI-173.4907809 Visual Studio Code: Version 1.36

Versions:

• Android: 9
• react-native-modal:11.1.0
• react-native:0.60
• react:16.8.6

Platform: Android

Description:

When I try to close the modal by swiping, it won’t move but the backDrop starts to hide. and when the finger is released, the modal is closed. I mean the modal wouldn’t move with my finger.

Reproducible Demo

<Modal
  animationInTiming={700}
  animationOutTiming={700}
  useNativeDriver={true}
  hideModalContentWhileAnimating={true}
  swipeDirection="down"
  onSwipeComplete={this.toggleModal}
  isVisible={this.state.isModalVisible}
  onBackButtonPress={this.toggleModal}
  onBackdropPress={this.toggleModal}
  style={{
    backgroundColor: "white",
    marginTop: 300,
    marginBottom: 0,
    marginHorizontal: 0
  }}>
  <View
    style={{ flex: 1, padding: 30, justifyContent: "space-between" }}>
    <View>
      <Text
        style={{
          fontFamily: fonts.bold,
          textAlign: "center",
          color: "black",
          fontSize: 16
        }}>
        ایجاد سوال جدید
      </Text>
      <Divider />
    </View>

    <Input
      underlineColorAndroid="transparent"
      inputStyle={{ fontFamily: fonts.default }}
      containerStyle={{
        borderColor: "black",
        borderWidth: 1,
        borderRadius: 4
      }}
      multiline={true}
      numberOfLines={10}
      placeholder="متن سوال"
      textAlignVertical="top"
      shake={true}
    />
    <Button
      type="outline"
      style={{}}
      title="ثبت"
      containerStyle={{ borderColor: "black" }}
      titleStyle={{ fontFamily: fonts.bold, color: "black" }}
      onPress={this.toggleModal}
    />
  </View>
</Modal>

[mahdinba97]

Thanks for the answer and the digging @kenyontu. And yes, I found that out just after I created this issue.

[kenyontu]

I did some digging and this is the expected behaviour when useNativeDriver={true}.

The PR #247 has the discussion on it. In addition, this part in the docs about Animations, mentions that useNativeDriver does not support position properties, which are required to make the modal move while the user is swiping.