fix#29319 - ios dismiss modal (#31500)

Summary:
This PR aims to resolve iOS can't dismiss Modal on swipe gesture.
https://github.com/facebook/react-native/issues/29319

When modal presentationStyle is pageSheet, iOS allows to dismiss the modal using swipe gesture. This PR adds support for that feature
## Changelog

<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://github.com/facebook/react-native/wiki/Changelog
-->

[iOS] [Added] - Support for onRequestClose for iOS Modal component.

Pull Request resolved: https://github.com/facebook/react-native/pull/31500

Test Plan:
- If onRequestClose updates the visibility state, modal will be closed.

```
<Modal
    visible={visible}
    animationType="slide"
    presentationStyle="pageSheet"
    onRequestClose={dismiss}>
</Modal>
```

https://user-images.githubusercontent.com/23293248/117590263-36cd7f00-b14c-11eb-940c-86e700c0b8e7.mov

## Notes
- In this PR, only support for partial drag is added. i.e. user can't drag the modal up and down completely. I added full user dragging but reverted in this [commit](https://github.com/facebook/react-native/commit/bb65b9a60d54b61652d608661eba876b49be3b17) to support controllable onRequestClose. If someone has any suggestion to have full draggable support + controllable onRequestClose, please let me know.

<!--

 the code is solid. Example: The exact commands you ran and their output, screenshots / videos if the pull request changes the user interface. -->

Reviewed By: p-sun

Differential Revision: D30041625

Pulled By: sammy-SC

fbshipit-source-id: 9675da760bd5c070c4f0e1d30271c8af5c50b998
This commit is contained in:
Nishan Bende
2021-08-16 11:25:57 -07:00
committed by Facebook GitHub Bot
parent eb93886306
commit c29ec46b0e
3 changed files with 18 additions and 1 deletions
+1 -1
View File
@@ -16,7 +16,7 @@
@protocol RCTModalHostViewInteractor;
@interface RCTModalHostView : UIView <RCTInvalidating>
@interface RCTModalHostView : UIView <RCTInvalidating, UIAdaptivePresentationControllerDelegate>
@property (nonatomic, copy) NSString *animationType;
@property (nonatomic, assign) UIModalPresentationStyle presentationStyle;
+16
View File
@@ -24,6 +24,7 @@
RCTTouchHandler *_touchHandler;
UIView *_reactSubview;
UIInterfaceOrientation _lastKnownOrientation;
RCTDirectEventBlock _onRequestClose;
}
RCT_NOT_IMPLEMENTED(-(instancetype)initWithFrame : (CGRect)frame)
@@ -57,6 +58,18 @@ RCT_NOT_IMPLEMENTED(-(instancetype)initWithCoder : coder)
}
}
- (void)setOnRequestClose:(RCTDirectEventBlock)onRequestClose
{
_onRequestClose = onRequestClose;
}
- (void)presentationControllerDidAttemptToDismiss:(UIPresentationController *)controller
{
if (_onRequestClose != nil) {
_onRequestClose(nil);
}
}
- (void)notifyForOrientationChange
{
if (!_onOrientationChange) {
@@ -169,6 +182,9 @@ RCT_NOT_IMPLEMENTED(-(instancetype)initWithCoder : coder)
if (self.presentationStyle != UIModalPresentationNone) {
_modalViewController.modalPresentationStyle = self.presentationStyle;
}
if (@available(iOS 13.0, *)) {
_modalViewController.presentationController.delegate = self;
}
[_delegate presentModalHostView:self withViewController:_modalViewController animated:[self hasAnimationType]];
_isPresented = YES;
}
+1
View File
@@ -121,6 +121,7 @@ RCT_EXPORT_VIEW_PROPERTY(identifier, NSNumber)
RCT_EXPORT_VIEW_PROPERTY(supportedOrientations, NSArray)
RCT_EXPORT_VIEW_PROPERTY(onOrientationChange, RCTDirectEventBlock)
RCT_EXPORT_VIEW_PROPERTY(visible, BOOL)
RCT_EXPORT_VIEW_PROPERTY(onRequestClose, RCTDirectEventBlock)
// Fabric only
RCT_EXPORT_VIEW_PROPERTY(onDismiss, RCTDirectEventBlock)