How to update the navigation bar color in UIImagePickerController in Xamarin Forms (via WebView/JS)

Question

question

SagarSKadookkunnan-2821 asked Nov 24, '20 ColeXia-MSFT edited Nov 27, '20

How to update the navigation bar color in UIImagePickerController in Xamarin Forms (via WebView/JS)

In one of my Xamarin Forms project, I am in a situation where the webview triggers the opening of native UIImagePickerController (iOS) for Photo selection/Camera via JavaScript. In my app we use Transparent/Clear color for the Navigation bar mostly and only when the UIImagePickerController is presented, we want to change it to default color or some other Tint colour for the Navigation Bar (appearance).

Is there a way for us to do it easily? I did some research and looks like UIImagePickerController does not like to be wrapped up and so there is no Custom Renderers written in Xamarin Forms SDK for that.

How can I detect initialization of a UIImagePickerController natively and make the UINavigationBar appearance change for that change? Also, I want to detect the closing/photo picking from the UIImagePickerController and reverse the UINavigationBar appearance to the normal (clear color) one for our app as well.

Any suggestions would be greatly appreciated and Thank you in advance!

Sincerely,
Sagar S. Kadookkunnan

dotnet-xamarinforms dotnet-ios

5 |1600 characters needed characters left characters exceeded

Attachments: Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Answer 1 · 2020-11-24T10:01:27.563Z

ColeXia-MSFT answered Nov 24, '20 ColeXia-MSFT edited Nov 27, '20

Hello,

Welcome to Microsoft Q&A!

You could try to detect if the UIImagePickerController present/dismiss in ViewWillDisappear/ViewWillAppear method of a ViewController, so you need to create a custom renderer of Page.

Sample code

[assembly : ExportRenderer(typeof(YourPage),typeof(MyRenderer))]
namespace CollectionViewFooterRefreshViewRepro.iOS
{
    class MyRenderer : PageRenderer
    {
        public override void ViewWillDisappear(bool animated)
        {
            base.ViewWillDisappear(animated);

            if(UIApplication.SharedApplication.KeyWindow.RootViewController is UIImagePickerController)
            {
                UINavigationBar.Appearance.BarTintColor = UIColor.Red;
            }
        }


        public override void ViewWillAppear(bool animated)
        {
            base.ViewWillAppear(animated);

            if (UIApplication.SharedApplication.KeyWindow.RootViewController is UIImagePickerController)
            {
                UINavigationBar.Appearance.BarTintColor = UIColor.Clear;
            }
        }
    }
}

Thank you.

If the response is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

· 2

5 |1600 characters needed characters left characters exceeded

Attachments: Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

sagarkadookkunnan · Nov 24, 2020 at 10:02 PM

Hi @ColeXia-MSFT,

Thank you for your answer. I tried this in my custom page renderer and does not seem to work. Even though the Page disappearing event gets fired for the bottom ViewController/ContentPage, the UIImagePicker presentation does not fire an appearing event, so the code does not work, I tried the reverse approach as well, but the ImagePicker is not found the navigation stack or modal stack.

Did this renderer work for you correctly?

Sincerely,
Sagar S. Kadookkunnan

0 ·

ColeXia-MSFT sagarkadookkunnan · Nov 27, 2020 at 07:14 AM

The problem may be related with the presenting modal style , after ios 13 the default style is not full screen(ViewWillDisappear/ViewWillAppear will not trigger) ,we should specify it explicitly when present it .

Check https://stackoverflow.com/questions/56435510/presenting-modal-in-ios-13-fullscreen.

However , we can not get the uiimagepickercontroller since it is triggered on the webview ....

1 ·

question