[Bug] navigationBarcolor and tabscolor in IOS is giving a lighter color when compared to original color & with android devices

[uday-lucky]

Description

1.Navigationbar color & also the tabs background color is very light , when compared to the original color(#132241). It is fine in android . When i deploy in IOS, the color is very light and not matching the original.

2. Also, there is a slight colour difference between the top tab bar background color and navigationbar color

Steps to Reproduce

1. Download xaminals sample project from https://docs.microsoft.com/en-gb/samples/xamarin/xamarin-forms-samples/userinterface-xaminals/

2. Replace "Shell.BackgroundColor" with "#132241" in "DomesticShell" style (AppShell.Xaml) as shown below.

<Style x:Key="DomesticShell" TargetType="Element" BasedOn="{StaticResource BaseStyle}"> <Setter Property="Shell.BackgroundColor" Value="#132241" />

3. Just Deploy in android and Ios devices.

Expected Behavior

Same as the colour in android device

Actual Behavior

Difference in both platforms;

Basic Information

• Version with issue: Latest as of 2020 jan 27th
• Last known good version: Xamarin forms 4.4.099..
• IDE: VS2019 mac
• Platform Target Frameworks:
  • iOS: SDK 13.2, version 11.3.1
  • Android: API Level 28
  • UWP:
• Android Support Library Version:
• Nuget Packages:
• Affected Devices:

Screenshots

Reproduction Link

Workaround

I tried adding the following line in appdelegate.cs

       UINavigationBar.Appearance.Translucent = false;
        UITabBar.Appearance.BackgroundColor = UIColor.FromRGB(19, 34, 65);

succeeded in getting the navigationbar color and bottom tab background color , but the top tabbed page background color still appears different from original color. Please find below screenshot for reference.

[PureWeen]

duplicate https://github.com/xamarin/Xamarin.Forms/issues/6298

[GeorgeVelikov]

duplicate #6298

The workaround for the duplicate only affects the actual navbar and does not affect the top tab bar which the shell creates

[samueljoos]

6298 only works for the navigationbar.

I managed to fix it by creating a custom AppShellRenderer

using System;
using YourApp;
using YourApp.iOS.Renderers;
using UIKit;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;
[assembly: ExportRenderer(typeof(AppShell), typeof(MyShellRenderer))]
namespace YourApp.iOS.Renderers
{
    public class TabbarAppearanceTracker : ShellTabBarAppearanceTracker
    {
        public override void SetAppearance(UITabBarController controller, ShellAppearance appearance)
        {
            controller.TabBar.Translucent = false;
            base.SetAppearance(controller, appearance);
        }
    }
    public class MyShellRenderer:ShellRenderer
    {
        protected override IShellTabBarAppearanceTracker CreateTabBarAppearanceTracker()
        {
            return new TabbarAppearanceTracker();
        }
    }
}

[AdamDiament]

@samhouts I still have this issue in iOS using xamarin forms 4.6 - is this expected and going to be in a future release or should I raise another issue?