Reputation: 1290
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?
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
Upvotes: 0
Views: 283
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