自定义 TabbedPage 颜色架构 - Xamarin.Forms答案

【问题标题】：Customize TabbedPage color schema - Xamarin.Forms自定义 TabbedPage 颜色架构 - Xamarin.Forms
【发布时间】：2014-09-24 02:08:13
【问题描述】：

有没有办法可以自定义Xamarin.Forms.TabbedPage 对象上选项卡的颜色架构，使其不采用目标平台的默认外观？

我想更改字体颜色、背景和当前选择的标签颜色。

【问题讨论】：

标签： xamarin.ios xamarin xamarin.android xamarin.forms tabbedpage

【解决方案1】：

我建议使用自定义渲染器。

以下是 iOS 的示例：

[assembly: ExportRenderer(typeof(TabbedPage), typeof(TabbedPageRenderer))]
namespace MyApp.iOS
{
    public class TabbedPageRenderer : TabbedRenderer
    {
        protected override void OnElementChanged(VisualElementChangedEventArgs e)
        {
            base.OnElementChanged(e);

            TabBar.TintColor = UIColor.White;
            TabBar.BarTintColor = UIColor.Black;
            TabBar.BackgroundColor = UIColor.Gray;
        }
    }
}

刚刚过去 Xamarin.iOS 项目中的此类。

对于 Xamarin.Android，您还可以使用自定义渲染器来完成相同的任务。自定义渲染器的 Android 实现看起来与 iOS 版本不同。

【讨论】：

如何在 Android 上做到这一点？

【解决方案2】：

聚会迟到了。

现在您可以按如下方式更改标签页背景颜色

BarBackgroundColor = Color.Black;

http://thatcsharpguy.com/post/platformtabbedpage-xamarin-forms-en/

【讨论】：

【解决方案3】：

Xamarin.Forms 中没有内置方法，但在特定于平台的项目中很容易做到这一点。例如通过在iOS 上使用 UIAppearance。

【讨论】：

【解决方案4】：

在标签页中，为了在 xamarin 表单中更改标题颜色，而不是在 android native 中。

标签页代码：

 class MainPage : TabbedPage
    {
        LoginManager app;

        public MainPage(LoginManager ilm)
        {

            app = ilm;
            Title = "Infrastructure";
            Icon = "server.png";            


            this.BarTextColor = Color.White;
            this.BarBackgroundColor = Color.Blue;


            Children.Add(new AssetsView());
            Children.Add(new ServiceView());

            ToolbarItem tbi = new ToolbarItem() {
                Text = "Logout",
                Order = ToolbarItemOrder.Secondary,
                Priority = 0,       



            };

资产查看代码：

 public AssetView()
        {
            Title = "Assets";           



           this.BackgroundColor = Color.FromHex("D3D3D3");

            list = new AssetsList();

            searchbar = new SearchBar()
            {

                Placeholder = "Search",
                TextColor = Color.Black,
                BackgroundColor = Color.White,
                CancelButtonColor = Color.Black,
                PlaceholderColor = Color.Black


            };

服务查看代码：

  public class ServiceView : ContentPage
    {

        ServiceList list;
        SearchBar searchbar;


        public ServiceView()
        {
            Title = "Services";
            this.BackgroundColor = Color.FromHex("D3D3D3");

            list = new ServiceList();

            searchbar = new SearchBar()
            {
                Placeholder = "Search",
                TextColor = Color.Black,
                BackgroundColor = Color.White,
                CancelButtonColor = Color.Black,
                PlaceholderColor = Color.Black
            };

【讨论】：

【解决方案5】：

我可以通过执行以下操作在 Android 中实现这一点：

将 Current.MainPage 转换为 TabbedPage - 这将允许您设置属性。

((TabbedPage)Current.MainPage).BarBackgroundColor = Color.FromHex(settings.AppSecondaryColour);

您应该能够以相同的方式更改您希望的其他属性。我还没有在 IOS 中测试过。

【讨论】：

【解决方案6】：

你可以这样做：

<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
            xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
            xmlns:d="http://xamarin.com/schemas/2014/forms/design"
            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
            mc:Ignorable="d"
            xmlns:views="clr-namespace:SilCoyLuhn.Views"
            x:Class="SilCoyLuhn.Views.MainPage"
            BarBackgroundColor="{StaticResource Primary}"
            BarTextColor="{StaticResource LightTextColor}">

    <TabbedPage.Resources>
        <ResourceDictionary>
            <Color x:Key="Primary">#9DD69F</Color>
            <Color x:Key="Accent">#E1F4E0</Color>
            <Color x:Key="LightTextColor">#999999</Color>
        </ResourceDictionary>
        </TabbedPage.Resources>
</TabbedPage>

在<TabbedPage.Resources> 中，我定义了用作BarBackgroundColor 和BarTextColor 的静态资源。

【讨论】：