title: Android BottomNavigationView One tab with different unselected/selected colors
body: <p>I am attempting to match a design like this..</p>
  
  <p><a href="https://i.stack.imgur.com/pKGWf.png" rel="noreferrer"><img src="https://i.stack.imgur.com/pKGWf.png" alt="enter image description here"></a></p>
  
  <p>Notice that the "selected tab color tint" is a blue, but the center tab's icon should always be the green circle with the white clock in the middle.</p>
  
  <p>I've tried a number of things. First trying to do it programmatically by using a layer-list XML resource that had the green circle and clock PNG resource, which didn't work at all. Then I just got the designer to give me the full icon(clock and green circle), but now I'm running into this issue..</p>
  
  <p>(Unselected)</p>
  
  <p><a href="https://i.stack.imgur.com/9NKfh.png" rel="noreferrer"><img src="https://i.stack.imgur.com/9NKfh.png" alt="enter image description here"></a></p>
  
  <p>(Selected)</p>
  
  <p><a href="https://i.stack.imgur.com/rJR2f.png" rel="noreferrer"><img src="https://i.stack.imgur.com/rJR2f.png" alt="enter image description here"></a></p>
  
  <p>I'm failing at finding the correct terms to search for on Google to fix this.</p>
  
  <p>In the end, I need the selected tab color to be blue, but I need the center tab icon to always be the actual icon with no additional coloring(essentially it needs to look exactly like the .png).</p>
  
  <p>PS: I am using Xamarin.Forms, FreshMvvm, and the FreshTabbedFONavigationContainer. However, through the Renderer, I have direct access to the BottomNavigationView and all of the other native Android components. So the solution does not have to be a Xamarin solution. A java/kotlin solution would work also and I can just convert it to Xamarin.</p>
  
  <p><strong>======================</strong></p>
  
  <p><strong>EDITED:</strong></p>
  
  <p><strong>======================</strong></p>
  
  <p>So I have gotten a lot further using <a href="https://stackoverflow.com/users/1341538/andres-castro">Andres Castro</a> code below, but I'm still having the same issue as before. Using Andres' code below, I switched back to using FontAwesome for the icons(which works great), but in doing so means I needed to use a <code>LayerDrawable</code> to create the circle/icon center tab icon.</p>
  
  <p>So this is what I have so far..</p>
  
  <p><strong>Unselected center icon</strong></p>
  
  <p><a href="https://i.stack.imgur.com/zwXZ6.png" rel="noreferrer"><img src="https://i.stack.imgur.com/zwXZ6.png" alt="enter image description here"></a></p>
  
  <p><strong>Selected center icon</strong></p>
  
  <p><a href="https://i.stack.imgur.com/TiVut.png" rel="noreferrer"><img src="https://i.stack.imgur.com/TiVut.png" alt="enter image description here"></a></p>
  
  <p>As you can see, the center icon is still gray when unselected and blue when selected(the proper selected/unselected colors of the other 4 icons).</p>
  
  <p>Here is the code I have so far pertaining to the center icon..</p>
  
  <p><strong>UpdateTabbedIcons</strong></p>
  
  <pre><code>private void UpdateTabbedIcons()
  {
      for (var i = 0; i &lt; Element.Children.Count; i++) {
          var tab = _bottomNavigationView.Menu.GetItem(i);
  
          var element = Element.Children[i];
          if (element is NavigationPage navigationPage) {
              //if the child page is a navigation page get its root page
              element = navigationPage.RootPage;
          }
  
          UpdateTabIcon(tab, element);
      }
  }
  </code></pre>
  
  <p><strong>UpdateTabIcon</strong></p>
  
  <pre><code>public void UpdateTabIcon(IMenuItem menuItem, Page page)
  {
      var icon = page?.Icon;
      if (icon == null) return;
  
      var drawable = new IconDrawable(Context, icon, "fa-regular-pro-400.ttf");
  
      var element = Element.CurrentPage;
      if (element is NavigationPage navigationPage) {
          //if the child page is a navigation page get its root page
          element = navigationPage.RootPage;
      }
  
      if (page is DoNowTabPage) { //Page for center icon
          drawable.Color(Helpers.Resources.White.ToAndroid());
          var finalDrawable = GetCombinedDrawable(drawable);
          menuItem.SetIcon(finalDrawable);
          return;
      } else if (element == page) {
          drawable.Color(BarSelectedItemColor.ToAndroid());
      } else {
          drawable.Color(BarItemColor.ToAndroid());
      }
  
      menuItem.SetIcon(drawable);
  }
  </code></pre>
  
  <p><strong>GetCombinedDrawable</strong></p>
  
  <pre><code>private Drawable GetCombinedDrawable(IconDrawable iconDrawable)
  {
      var displayMetrics = Resources.DisplayMetrics;
  
      GradientDrawable circleDrawable = new GradientDrawable();
      circleDrawable.SetColor(Helpers.Resources.Green.ToAndroid());
      circleDrawable.SetShape(ShapeType.Oval);
      circleDrawable.SetSize((int)TypedValue.ApplyDimension(ComplexUnitType.Dip, 500, displayMetrics), (int)TypedValue.ApplyDimension(ComplexUnitType.Dip, 500, displayMetrics));
      circleDrawable.Alpha = 1;
  
      var inset = (int)TypedValue.ApplyDimension(ComplexUnitType.Dip, 140, displayMetrics);
      var bottomInset = (int)TypedValue.ApplyDimension(ComplexUnitType.Dip, 40, displayMetrics);
      LayerDrawable finalDrawable = new LayerDrawable(new Drawable[] { circleDrawable, iconDrawable });
      finalDrawable.SetLayerHeight(1, iconDrawable.IntrinsicHeight);
      finalDrawable.SetLayerWidth(1, iconDrawable.IntrinsicWidth);
      finalDrawable.SetLayerInset(1, inset, inset, inset, inset + bottomInset);
      finalDrawable.SetLayerInsetBottom(0, bottomInset);
      finalDrawable.ClearColorFilter();
  
      return finalDrawable;
  }
  </code></pre>
  
  <p>As you can see in the <code>GradientDrawable</code> that I'm creating for the circle, I am setting it's color to my Green color(I have a custom class called Resources..that's not the Android <code>Resources</code> class).</p>
  
  <p>So that's where I'm stuck. I am setting the circle drawable to having a green color, but once in the BottomNavigationView, it's color always matches the unselected/selected colors of the other icons.</p>
  
  <p>Hoping to get past this final issue. Thanks for any help.</p>