如何在 xamarin.forms for android 中设置选定选项卡的背景颜色？

Question

我在 xamarin.forms 工作。 我已经在 android 中实现了底部标签页，如下面的代码

<TabbedPage 
                xmlns="http://xamarin.com/schemas/2014/forms"
                xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                x:Class="Inika.Views.BottomBar.BottomBarPages"
                xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
                BarBackgroundColor="White"
                android:TabbedPage.ToolbarPlacement="Bottom"
                android:TabbedPage.BarItemColor="#A9A9A9"
                android:TabbedPage.BarSelectedItemColor="Black">
</TabbedPage>

我正在使用 xamarin.form 3.1 的新功能，如下链接

https://blog.xamarin.com/xamarin-forms-3-1-improvments/

根据我当前的代码，我的输出如下图所示

但我想设置选定选项卡的背景颜色。 “BarBackgroundColor”属性设置整个Bar的颜色。 我没有找到任何仅在选定选项卡中设置颜色的属性。

我需要这样的输出

请建议通过自定义渲染或任何解决方法，但我不想使用任何自定义插件。

Answer 1

这个问题已经在 SO 上得到了回答。 尽管如此，请尝试以下操作。

如果您使用的是 FormsAppCompatActivity，则可以使用

app:tabIndicatorColor="#FF3300" <!-- Set indicator color here, sets it to red-->

编辑

您需要创建一个自定义渲染器。

在 github 上查看此示例。

Answer 2

Xamarin Android 有 2 种 Bars：TabLayout 和 BottomNavigationView。 TabLayout 的样式不适用于 BottomNavigationView。 我找不到好的答案。 但我可以进行自定义渲染。 tab.SetBackgroundColor 可以设置任何颜色。

using System.ComponentModel;
using Android.Content;
using Android.Views;
using Droid.Renderers;
using Google.Android.Material.BottomNavigation;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;
using Xamarin.Forms.Platform.Android.AppCompat;
using Color = Android.Graphics.Color;

using BottomNavigationView = Google.Android.Material.BottomNavigation.BottomNavigationView;

[assembly: ExportRenderer(typeof(TabbedPage), typeof(MyTabbedRenderer))]
namespace Droid.Renderers
{
    public sealed class MyTabbedRenderer : TabbedPageRenderer
    {
        private int tIndex = 0;

        public MyTabbedRenderer(Context context) : base(context) { }


        protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            base.OnElementPropertyChanged(sender, e);
            tIndex = (sender as TabbedPage).Children.IndexOf((sender as TabbedPage).CurrentPage);
            GetBottomNavigationView(this.ViewGroup);
        }

        protected override void OnElementChanged(ElementChangedEventArgs<TabbedPage> e)
        {
            base.OnElementChanged(e);
            if (e.NewElement == null) return;
            GetBottomNavigationView(ViewGroup);
        }

        private void GetBottomNavigationView(ViewGroup viewGroup)
        {
            for (int i = 0; i < viewGroup.ChildCount; i++)
            {
                Android.Views.View childView = viewGroup.GetChildAt(i);
                if (childView is ViewGroup)
                {
                    ViewGroup childViewGroup = (ViewGroup)childView;
                    for (int j = 0; j < childViewGroup.ChildCount; j++)
                    {
                        var bottomNavigationView = childViewGroup.GetChildAt(j);
                        if (bottomNavigationView is BottomNavigationView)
                        {
                            BottomNavigationMenuView bnMenuViev = ((BottomNavigationView)bottomNavigationView).MenuView as BottomNavigationMenuView;
                            for (int n = 0; n < bnMenuViev.ChildCount; n++)
                            {
                                var tab = bnMenuViev.GetChildAt(n);
                                if (tIndex == n)
                                {
                                    tab.SetBackgroundColor(Color.Yellow);
                                }
                                else
                                {
                                    tab.SetBackgroundColor(Color.Black);

                                }
                            }
                        }
                    }
                }
            }
        }
    }
}