How to remove the shadow from Shell's Navigation bar

iooovoltsiooovolts ✭✭Member ✭✭
edited August 21 in Xamarin.Forms

I have a Xamarin Forms Shell application and I am trying to get rid of the shadow below the navigation bar for a more flat and consistent UI. Please see screenshot below to grasp what I am referring to.

Answers

  • LeonLuLeonLu Xamurai Member, Xamarin Team Xamurai

    I test many ways to remove the shadow, but I just could achieve the following result. The frist time show the navigation bar, it have a shadow, but if I navigate to the other page, then back the mainpage, the shadow was disappear. That's so weird.

    I create a custom renderer for shell with following code.

      [assembly: ExportRenderer(typeof(MyshellDemo.AppShell), typeof(MyshellDemo.Droid.MyShellRenderer))]
      namespace MyshellDemo.Droid
     {
       public class MyShellRenderer : ShellRenderer
     {
        public MyShellRenderer(Context context) : base(context)
        {
        }
    
        protected override IShellToolbarAppearanceTracker CreateToolbarAppearanceTracker()
        {
            return new MyShellToolbarAppearanceTracker(this);
        }
       }
    }
    
         internal class MyShellToolbarAppearanceTracker : IShellToolbarAppearanceTracker
    {
        private MyShellRenderer myShellRenderer;
    
        public MyShellToolbarAppearanceTracker(MyShellRenderer myShellRenderer)
        {
            this.myShellRenderer = myShellRenderer;
        }
    
        public void Dispose()
        {
    
        }
    
        public void ResetAppearance(Toolbar toolbar, IShellToolbarTracker toolbarTracker)
        {
    
        }
    
        public void SetAppearance(Toolbar toolbar, IShellToolbarTracker toolbarTracker, ShellAppearance appearance)
        {
    
            toolbar.SetBackgroundColor(Android.Graphics.Color.White);
            var viewParent = (Android.Support.Design.Widget.AppBarLayout)toolbar.Parent;
            viewParent.Elevation = 0.1f;
    
            //toolbar.Elevation = 0;
        }
    }
    
  • iooovoltsiooovolts ✭✭ Member ✭✭

    @LeonLu do I need to initialise it in anyway before this code will work? I have never worked with renderers before. Also did you manage to get a fully working solution? Either way thank you so much, this helps me see there's a knowledge gap I can fill!

  • LeonLuLeonLu Xamurai Member, Xamarin Team Xamurai
    edited August 26

    I test it with navigation bar it works normally, it is related to the shell renderer. I will test it in real device.

  • iooovoltsiooovolts ✭✭ Member ✭✭
    edited August 30

    Okay thanks!

  • LeonLuLeonLu Xamurai Member, Xamarin Team Xamurai
    edited September 10

    I have reported this issue, this is a renderer know issue.

  • iooovoltsiooovolts ✭✭ Member ✭✭

    @LeonLu thanks for doing that! can you please link the issue ? I would love to see when it is resolved

Sign In or Register to comment.