How to preserve original icon colors in Shell

Tabbar within a MAUI Shell control has built-in functionality to set tint to selected/unselected icons in bottom bar. Therefore all icons have mono color.

My goal is to highlight background preserving original icons / use two different icons on selected/unselected tabs.

I managed to remove tint on iOS using custom IShellTabBarAppearanceTracker, but cannot figure out Android and Windows version.

• For the Android, you can use the ShellBottomNavViewAppearanceTracker to do that.

Declare the color in the \Platforms\Android\Resource\values\colors.xml:

<color name="unselected">#ffffff</color>
<color name="selected">#264813</color>

Create the \Platforms\Android\Resource\drawable folder and create the drawable_selector file in it:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
      <item android:drawable="@color/selected" android:state_checked="true" />
      <item android:drawable="@color/unselected"/>
</selector>

And then use it in the ShellBottomNavViewAppearanceTracker:

public class MyShellRender : ShellRenderer
 {
     protected override IShellBottomNavViewAppearanceTracker CreateBottomNavViewAppearanceTracker(ShellItem shellItem)
     {
         return new CustomBottomNavAppearance();
     }
 }
 public class CustomBottomNavAppearance : IShellBottomNavViewAppearanceTracker
 {
     public void Dispose()
     {
     }

     public void ResetAppearance(BottomNavigationView bottomView)
     {
     }

     public void SetAppearance(BottomNavigationView bottomView, IShellAppearanceElement appearance)
     {
         bottomView.ItemIconTintList = null;
         var menu = bottomView.Menu;
         var first = menu.GetItem(0);
         first.SetIcon(Resource.Drawable.firstimage);
         var second = menu.GetItem(1);
         second.SetIcon(Resource.Drawable.secondimage);
         bottomView.ItemBackground = AppCompatResources.GetDrawable(Platform.CurrentActivity,Resource.Drawable.drawable_selector);
     }
 }

• For the iOS, you can use custom IShellTabBarAppearanceTracker to do that:

 public class MyShellRender : ShellRenderer
 {
     protected override IShellTabBarAppearanceTracker CreateTabBarAppearanceTracker()
     {
         return new CustomTabBarAppearance();
     }
 }
 public class CustomTabBarAppearance : IShellTabBarAppearanceTracker
 {
     public void Dispose()
     {
     }

     public void ResetAppearance(UITabBarController controller)
     {
     }

     public void SetAppearance(UITabBarController controller, ShellAppearance appearance)
     {
         var tabbar = controller.TabBar;
         if (tabbar.Items != null)
         {
             var item1 = tabbar.Items[0];
             item1.Image = UIImage.FromBundle("first.png").ImageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal);
             var item2 = tabbar.Items[1];
             item1.Image = UIImage.FromBundle("second.png").ImageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal);
         }

     }

But there is no api can change the background color of the selected item on the iOS.

• Finally, for the Windows: the platformview is navigationview, but maui custom the MenuItemTemplate, and not support the color image. So you can try to use OnPlatform to set special image for the windows. Or you can report this on the github repo.