Rodrigo Vasconcelos
Rodrigo Vasconcelos

Reputation: 1290

showInAppNotification - notification does not dismiss on Android

I'm using the library react-native-navigation on my app, but whenever I try to add notifications using the showInAppNotification method, the notification is not dismissed on swipe as expected. The notifications can be dismissed with a swipe normally on iOS. Has anyone ever had this problem?

Steps to Reproduce

1 - Add a notification using the showInAppNotification method:

this.props.navigator.showInAppNotification({
    screen: "example.InAppNotification",
    passProps: { ...notificationProps },
    autoDismissTimerSec: 5,
  });

2 - Run the application on an Android device;
3 - Trigger the notification display;
4 - Try to swipe to notification up to dismiss


Environment

Upvotes: 0

Views: 283

Answers (1)

Rodrigo Vasconcelos
Rodrigo Vasconcelos

Reputation: 1290

Got the swipe dismiss on Android working using the react-native-swipe-gestures library and and LayoutAnimation.
Here's the general idea of the workaround, in case anyone stumbles here with the same problem:

class MyNotification extends React.PureComponent {

   state = {
      isNotificationDismissed: false,
  };

  render() {
      return (
        <GestureRecognizer
          style={this.getDisplayStyle()}
          onSwipeUp={this.handleSwipeUp}>
          {this.renderNotificationContent()}
        </GestureRecognizer>
      );
    }

    getDisplayStyle = () => {
      if (this.state.isNotificationDismissed) return styles.hiddenNotification;
      return styles.visibleNotification;
    };

    handleSwipeUp = () => {
      LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);
      this.setState({ isNotificationDismissed: true });
    };

   . 
   .
   .
}

const styles = StyleSheet.create({
    visibleNotification: {
      height: 64,
    },
    hiddenNotification: {
      height: 0,
    },
});

Upvotes: 0

Related Questions