›

How to remove the blue box in ios when select that page from navigation drawer?

SreeeeSreeee INMember ✭✭✭✭✭
edited June 7 in Xamarin.Forms

I have implemented the Navigation Drawer on my xamarin forms project. I am following this blog for this feature.

It is working fine in the Android part, but when I test it in ios a blue box is showing on each page of drawer items. See the screenshot below:

In UWP the navigation drawer is not dismissing after selecting an item from it.

I searched a lot, Can you suggest any solution for these 2 issues?

Tagged:

Best Answers

  • ColeXColeX Xamurai
    edited June 7 Accepted Answer

    but when I test it in ios a blue box is showing on each page of drawer items.

    I test with your code , everything works fine on iOS , there is no blue box ,could you share your sample ?

    In UWP the navigation drawer is not dismissing after selecting an item from it.

    Change MasterBehavior as Popover in the constructor of MasterDetailPage.

  • SreeeeSreeee IN ✭✭✭✭✭
    Accepted Answer

    Hi @ColeX and @Harshita

    I have added the below codes on all of my pages because of padding issues and blue header issues in ios. That causes the blue box in ios, I removed those codes and now ios part is working fine.

    <StackLayout>
                <StackLayout.Padding>
                    <OnPlatform x:TypeArguments="Thickness" 
                        Android="0, -10, 0, 0" 
                        WinPhone="0, 0, 0, -15" 
                        iOS="0, 15, 0, 0"/> 
                </StackLayout.Padding>
            </StackLayout>

            <BoxView BackgroundColor="#0091da">
                <BoxView.Margin>
                    <OnPlatform x:TypeArguments="Thickness"
                          Android="0, -30, 0, -15"
                        WinPhone="0, -30, 0, -15"
                          iOS="0, -30, 0, -15"/>
                </BoxView.Margin>
        </BoxView>

    For UWP I added below codes in MasterDetailPage constructor for solving the navigation drawer dismissing issues:

    if (Device.RuntimePlatform == Device.UWP)
        {
            MasterBehavior = MasterBehavior.Popover;
        }

    Thanks @ColeX and @Harshita :)

Answers

  • HarshitaHarshita INMember ✭✭✭✭

    @Sreeee
    Set The Page BackgroundColor=White

  • ColeXColeX Member, Xamarin Team Xamurai
    edited June 7 Accepted Answer

    but when I test it in ios a blue box is showing on each page of drawer items.

    I test with your code , everything works fine on iOS , there is no blue box ,could you share your sample ?

    In UWP the navigation drawer is not dismissing after selecting an item from it.

    Change MasterBehavior as Popover in the constructor of MasterDetailPage.

  • SreeeeSreeee INMember ✭✭✭✭✭
    Accepted Answer

    Hi @ColeX and @Harshita

    I have added the below codes on all of my pages because of padding issues and blue header issues in ios. That causes the blue box in ios, I removed those codes and now ios part is working fine.

    <StackLayout>
                <StackLayout.Padding>
                    <OnPlatform x:TypeArguments="Thickness" 
                        Android="0, -10, 0, 0" 
                        WinPhone="0, 0, 0, -15" 
                        iOS="0, 15, 0, 0"/> 
                </StackLayout.Padding>
            </StackLayout>

            <BoxView BackgroundColor="#0091da">
                <BoxView.Margin>
                    <OnPlatform x:TypeArguments="Thickness"
                          Android="0, -30, 0, -15"
                        WinPhone="0, -30, 0, -15"
                          iOS="0, -30, 0, -15"/>
                </BoxView.Margin>
        </BoxView>

    For UWP I added below codes in MasterDetailPage constructor for solving the navigation drawer dismissing issues:

    if (Device.RuntimePlatform == Device.UWP)
        {
            MasterBehavior = MasterBehavior.Popover;
        }

    Thanks @ColeX and @Harshita :)

Sign In or Register to comment.