Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

(iOS) Cannot present datetimepicker alert inside of BottomNavigation tab #81

Open
alpha-nero1 opened this issue Oct 23, 2020 · 0 comments

Comments

@alpha-nero1
Copy link

Make sure to check the demo app(s) for sample usage

Make sure to check the existing issues in this repository

If the demo apps cannot help and there is no issue for your problem, tell us about it

Please, ensure your title is less than 63 characters long and starts with a capital
letter.

Which platform(s) does your issue occur on?

  • iOS - all.
  • device used is iPhone. XR

Please, provide the following version numbers that your issue occurs with:

  • CLI: (run tns --version to fetch it)
    6.5.1
  • Cross-platform modules: (check the 'version' attribute in the
    node_modules/tns-core-modules/package.json file in your project)
    iOS: 6.5.2
    Android: 6.5.3
  • Runtime(s): (look for the "tns-android" and "tns-ios" properties in the package.json file of your project)
  • Plugin(s): (look for the version numbers in the package.json file of your
    project and paste your dependencies and devDependencies here)

Please, tell us how to recreate the issue in as much detail as possible.

Describe the steps to reproduce it.

HI, I have noticed that I can use the date time picker field outside of the BottomNavigation but from within the BottomNavigation I am receiving this warning:

Warning: Attempt to present <UIAlertView: 0x13c9f2e00> on <UINavigationControllerImpl: 0x13c085000> whose view is not in the window hierarchy!

And thus the modal for picking date does not show (This is preventing users of our app from editing their DOB after sign up)

Is there any code involved?

  • provide a code example to recreate the problem

I have meddled with the plugin code and I can observe that somehow (I suspect because of how the bottom navigation is built) the UINavigationControllerImpl that the BottomNavigation makes is not actually a part of the window hierarchy and thus when the plugin tries to show the modal, the modal does not show.

I have also observed that other plugins like nativescript-camera have the same problem and I also cannot use it in the main part of the app (BottomNavigation).

So this leads me to the code. Insise datetimepicker.ios.js in the _showNativeDialog I can see:

DateTimePicker._showNativeDialog = function (nativeDialog, nativePicker, style) {
        var currentPage = datetimepicker_common_1.getCurrentPage();
        if (currentPage) {
            var view = currentPage;
            var viewController = currentPage.ios;
            if (currentPage.modal) {
                view = currentPage.modal;
                if (view.ios instanceof UIViewController) {
                    viewController = view.ios;
                }
                else {
                    var parentWithController = view_1.ios.getParentWithViewController(view);
                    viewController = parentWithController ? parentWithController.viewController : undefined;
                }
            }
            if (viewController) {
                if (nativeDialog.popoverPresentationController) {
                    nativeDialog.popoverPresentationController.sourceView = viewController.view;
                    nativeDialog.popoverPresentationController.sourceRect = CGRectMake(viewController.view.bounds.size.width / 2.0, viewController.view.bounds.size.height / 2.0, 1.0, 1.0);
                    nativeDialog.popoverPresentationController.permittedArrowDirections = 0;
                }
                viewController.presentViewControllerAnimatedCompletion(nativeDialog, true, function () {
                });
            }
        }
    };

However, I believe that changing the function to something along the lines of this could do the trick:

DateTimePicker._showNativeDialog = function (nativeDialog, nativePicker, style) {
        var currentPage = datetimepicker_common_1.getCurrentPage();
        if (currentPage) {
            var view = currentPage;
            var rootViewController = UIApplication.sharedApplication.keyWindow.rootViewController;
            if (rootViewController) {
                if (nativeDialog.popoverPresentationController) {
                    nativeDialog.popoverPresentationController.sourceView = rootViewController.view;
                    nativeDialog.popoverPresentationController.sourceRect = CGRectMake(rootViewController.view.bounds.size.width / 2.0, rootViewController.view.bounds.size.height / 2.0, 1.0, 1.0);
                    nativeDialog.popoverPresentationController.permittedArrowDirections = 0;
                }
                rootViewController.presentViewControllerAnimatedCompletion(nativeDialog, true, function () {
                });
            }
        }
    };

This way the root view controller is alwasy in the window hierarchy and we can rely on it to show every time.

I would be delighted to contribute and launch a PR (after some good testing), but from what I can see I don't have access so I may just fork for the time being.

Please let me know what you think.
Thanks and Kind regards!

  • (EVEN BETTER) provide a .zip with application or refer to a repository with application where the problem is reproducible.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant