无法将多色图像添加到 Xamarin 表单中的 TabbedPage 导航栏答案

【问题标题】：Can't add multi-colour images to TabbedPage navigation bar in Xamarin Forms无法将多色图像添加到 Xamarin 表单中的 TabbedPage 导航栏
【发布时间】：2019-12-16 12:04:31
【问题描述】：

所以当我为我的 Android 应用程序设计导航栏时，我让它看起来像这样：我在编码时遇到的唯一问题是，当我将每个图标的 .png 图像添加到 MainPage.xaml 上的 XAML 代码中时，图标最终看起来像这样（图标只是变成没有其他颜色的黑色形状） .

android 是否只能处理 Android 的单色图标？有什么办法可以禁用这个默认功能？

我知道 android 样式指南规定您不应为导航栏中的图标使用一种以上的颜色，但我需要为这个应用设置一个例外。

【问题讨论】：

标签： c# android xaml xamarin.forms tabbedpage

【解决方案1】：

如果你想在标签页中使用彩色图标，你应该为标签页创建一个自定义渲染器

using Android.Content;
using Android.OS;
using Android.Runtime;
using Android.Support.Design.Widget;
using Android.Views;
using Android.Widget;
using TabbedDemo.Droid;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;
using Xamarin.Forms.Platform.Android.AppCompat;

[assembly: ExportRenderer(typeof(TabbedPage), typeof(MyTabbedRenderer))]
namespace TabbedDemo.Droid
{
    public class MyTabbedRenderer : TabbedPageRenderer
    {
        public MyTabbedRenderer(Context context) : base(context)
        {
        }
        protected override void OnElementChanged(ElementChangedEventArgs<TabbedPage> e)
        {
            base.OnElementChanged(e);
            if (e.OldElement == null && e.NewElement != null)
            {
                for (int i = 0; i <= this.ViewGroup.ChildCount - 1; i++)
                {
                    var childView = this.ViewGroup.GetChildAt(i);
                    if (childView is ViewGroup viewGroup)
                    {
                        for (int j = 0; j <= viewGroup.ChildCount - 1; j++)
                        {
                            var childRelativeLayoutView = viewGroup.GetChildAt(j);
                            if (childRelativeLayoutView is BottomNavigationView)
                            {
                                ((BottomNavigationView)childRelativeLayoutView).ItemIconTintList = null;
                            }
                        }
                    }
                }
            }
        }
    }
}

这是运行截图。

【讨论】：

谢谢伙计，它成功了——它看起来就像现在的设计一样。
显然这个问题只有当你把工具栏放在底部时才会发生，当它在视图的顶部时（默认情况下），图标看起来就好了。