[image_picker] Transparent pressing on iOS 26 (#173453) #10533
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -38,6 +38,15 @@ @interface FLTImagePickerPlugin () | |
| @property(strong, nonatomic) | ||
| NSMutableArray<UIImagePickerController *> *imagePickerControllerOverrides; | ||
|
|
||
| /// A temporary UIWindow placed above Flutter's window to swallow all user | ||
| /// interactions while UIImagePickerController is dismissing. This prevents | ||
| /// stray taps from leaking to the Flutter view during the dismissal animation. | ||
| @property(strong, nonatomic) UIWindow *interactionBlockerWindow; | ||
|
|
||
| /// The previously active key window before the interactionBlockerWindow is | ||
| /// shown. Stored so we can restore the original key window after dismissal. | ||
| @property(weak, nonatomic) UIWindow *previousKeyWindow; | ||
|
|
||
| @end | ||
|
|
||
| typedef NS_ENUM(NSInteger, ImagePickerClassType) { UIImagePickerClassType, PHPickerClassType }; | ||
|
|
@@ -323,6 +332,7 @@ - (void)showCamera:(UIImagePickerControllerCameraDevice)device | |
| [UIImagePickerController isCameraDeviceAvailable:device]) { | ||
| imagePickerController.sourceType = UIImagePickerControllerSourceTypeCamera; | ||
| imagePickerController.cameraDevice = device; | ||
| [self addInteractionBlocker]; | ||
| [[self viewControllerWithWindow:nil] presentViewController:imagePickerController | ||
| animated:YES | ||
| completion:nil]; | ||
|
|
@@ -532,7 +542,11 @@ - (void)picker:(PHPickerViewController *)picker | |
| - (void)imagePickerController:(UIImagePickerController *)picker | ||
| didFinishPickingMediaWithInfo:(NSDictionary<NSString *, id> *)info { | ||
| NSURL *videoURL = info[UIImagePickerControllerMediaURL]; | ||
| __weak typeof(self) weakSelf = self; | ||
| [picker dismissViewControllerAnimated:YES | ||
| completion:^{ | ||
| [weakSelf removeInteractionBlocker]; | ||
| }]; | ||
| // The method dismissViewControllerAnimated does not immediately prevent | ||
| // further didFinishPickingMediaWithInfo invocations. A nil check is necessary | ||
| // to prevent below code to be unwantly executed multiple times and cause a | ||
|
|
@@ -618,7 +632,11 @@ - (void)imagePickerController:(UIImagePickerController *)picker | |
| } | ||
|
|
||
| - (void)imagePickerControllerDidCancel:(UIImagePickerController *)picker { | ||
| __weak typeof(self) weakSelf = self; | ||
| [picker dismissViewControllerAnimated:YES | ||
| completion:^{ | ||
| [weakSelf removeInteractionBlocker]; | ||
| }]; | ||
| [self sendCallResultWithSavedPathList:nil]; | ||
| } | ||
|
|
||
|
|
@@ -674,4 +692,58 @@ - (void)sendCallResultWithError:(FlutterError *)error { | |
| self.callContext = nil; | ||
| } | ||
|
|
||
| /// Why a separate UIWindow for the touch blocker? | ||
| /// Flutter renders inside a UIWindow owned by FlutterViewController. UIImagePickerController is | ||
| /// presented in that same window and dismisses with an animation; during that brief transition, | ||
| /// taps can “leak” to the Flutter view underneath. | ||
| /// | ||
| /// A view-based blocker (added to the host view hierarchy) isn’t reliable because the host view’s | ||
| /// bounds/constraints/rotation/transitions can change during presentation/dismissal, causing the | ||
| /// blocker to move or be removed. | ||
| /// | ||
| /// Instead we create a dedicated UIWindow (windowLevel + 1) with its own root VC to swallow all | ||
| /// touches during the dismissal window, then restore the previous key window afterward. | ||
| - (void)addInteractionBlocker { | ||
| if (self.interactionBlockerWindow != nil) { | ||
| return; | ||
| } | ||
| UIViewController *topController = [self viewControllerWithWindow:nil]; | ||
| UIWindow *presentingWindow = topController.view.window; | ||
| if (!presentingWindow) { | ||
| return; | ||
| } | ||
| self.previousKeyWindow = presentingWindow; | ||
| UIWindow *blockerWindow; | ||
|
Contributor
There was a problem hiding this comment. why do we need a
Author
There was a problem hiding this comment. Hi, @hellohuanlin We’re using a separate UIWindow instead of dropping a view in the Flutter hierarchy to make the touch blocker reliable:
The following 2 screenshots are using view and image picker will replace the flutter view controller. The first one shows we are in flutter view controller, the second one shows when we trigger the camera page from flutter, the flutter view become invisible and image picker takes place all the view.
The following is using a window for camera In the first 2 hierarchy snapshots, the picker is full screen, so the Flutter view is temporarily out of the visible view tree. In the third snapshot, both the picker stack and FlutterViewController appear under the same key UIWindow, showing they share one window for event delivery. That’s why a blocker tied to the host view can shift or disappear during the modal transition, while a separate window stays put and reliably swallows taps.
Contributor
There was a problem hiding this comment. thanks for the detailed reply! for the benefit of future engineers looking at this code, do you think you could at a shortened version of ^ as a comment? |
||
| if (@available(iOS 13.0, *) && presentingWindow.windowScene) { | ||
| blockerWindow = [[UIWindow alloc] initWithWindowScene:presentingWindow.windowScene]; | ||
| } else { | ||
| blockerWindow = [[UIWindow alloc] initWithFrame:presentingWindow.bounds]; | ||
| } | ||
| blockerWindow.frame = presentingWindow.bounds; | ||
| blockerWindow.autoresizingMask = | ||
| UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight; | ||
| blockerWindow.windowLevel = presentingWindow.windowLevel + 1; | ||
| UIViewController *vc = [[UIViewController alloc] init]; | ||
| vc.view.backgroundColor = [UIColor clearColor]; | ||
| vc.view.userInteractionEnabled = YES; | ||
| blockerWindow.rootViewController = vc; | ||
| [blockerWindow makeKeyAndVisible]; | ||
| self.interactionBlockerWindow = blockerWindow; | ||
| } | ||
|
|
||
| /// Removes the temporary interaction-blocking window and restores the previous | ||
| /// key window. This is called after UIImagePickerController has fully dismissed, | ||
| /// once it is safe for Flutter to receive user input again. | ||
| - (void)removeInteractionBlocker { | ||
| if (!self.interactionBlockerWindow) { | ||
| return; | ||
| } | ||
| self.interactionBlockerWindow.hidden = YES; | ||
| if (self.previousKeyWindow) { | ||
| [self.previousKeyWindow makeKeyWindow]; | ||
| } | ||
| self.interactionBlockerWindow = nil; | ||
| self.previousKeyWindow = nil; | ||
| } | ||
|
|
||
| @end | ||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
this needs some documentation on why we need it.