Xamarin 表单更改导航栏的背景颜色答案

【问题标题】：Xamarin forms change background color of navigation barXamarin 表单更改导航栏的背景颜色
【发布时间】：2015-03-16 12:21:22
【问题描述】：

我正在使用 Xamarin.Forms 并尝试更改 iOS 上导航栏的背景颜色。

我有一个从 NavigationPage 继承的自定义导航栏类，具有可绑定的属性和构造函数，用于设置导航栏的颜色。据我了解，导航栏顶部有一个默认背景（黑色） Xamarin.Forms 导航背景。我可以使用 SetColor() 方法设置背景颜色（见下文）。但是，它留下了一条黑线，这是导航栏（iOS）的背景，如图所示。 Picture Link

现在，我正在尝试将 iOS 导航栏背景颜色设置为白色或透明。我花了很多时间，但没有任何效果。有人可以帮助如何将背景设置为白色。

//PCL class
public class CustomNavigationalPage : NavigationPage
{
    public  static readonly BindableProperty BarBgColorProperty = 
        BindableProperty.
        Create<CustomNavigationalPage, UIColor>  
            (p => p.BarBackgroundColorR, null);

    public UIColor BarBackgroundColorR
    {
        get { return (UIColor)base.GetValue (BarBgColorProperty); }
        set { base.SetValue (BarBgColorProperty, value); }
    }

    public NavigationalPageCustomized() : base()
    {
        SetColor();
    }

    void SetColor()
    {
        BarBackgroundColor = Color.Transparent; 
        BarTextColor = Color.Blue;
    }
}

导航栏渲染器类：

[assembly: ExportRenderer (typeof (CustomNavigationalPage), typeof (CustomNavigationPageRenderer))]

 namespace project.iOS
 {
     public class CustomNavigationPageRenderer : NavigationRenderer
     {
         public CustomNavigationPageRenderer()
         {
             // UINavigationBar.Appearance.SetBackgroundImage (UIImage.FromFile ("navbg.png"), UIBarMetrics.Default);
         }

         protected override void OnElementChanged (VisualElementChangedEventArgs args)
         {
             base.OnElementChanged (args);

             var nb = (NavigationalPageCustomized) Element;

             if (nb != null) 
             { 
                 nb.BarBackgroundColorR = UIColor.White;
             }
         }
     }
  }

【问题讨论】：

标签： c# xamarin.forms

【解决方案1】：

在 Xamarin.forms 的 PCL 中尝试此代码。 在 App.xaml.cs 的构造函数。

public App()
{
    MainPage = new NavigationPage(new Page1())
    {
        BarBackgroundColor = Color.Gray
    };
}

【讨论】：

【解决方案2】：

您可以在全局 App.xaml 文件中进行设置

<Style TargetType="NavigationPage">
       <Setter Property="BarBackgroundColor" Value="Blue"/>
       <Setter Property="BarTextColor" Value="White"/>
</Style>

换成你自己的颜色

【讨论】：

【解决方案3】：

试试下面的代码。祝你好运

[assembly: ExportRenderer (typeof (CustomNavigationalPage), typeof (CustomNavigationPageRenderer))]

namespace project.iOS
{
  public class CustomNavigationPageRenderer : NavigationRenderer
  {
      public CustomNavigationPageRenderer()
      {

      }
      public override void ViewDidLoad ()
      {
          base.ViewDidLoad ();
          //Background image
          this.NavigationBar.BarTintColor = UIColor.FromPatternImage (UIImage.FromFile ("AnyResourceImage.png"));
          //Your desire color
          this.NavigationBar.BarTintColor = UIColor.Red; 
          //Right item color
          this.NavigationBar.TopItem.RightBarButtonItem.TintColor = UIColor.FromPatternImage (UIImage.FromFile ("AnyResourceImage.png"));
          //Left item color
          this.NavigationBar.TopItem.LeftBarButtonItem.TintColor = UIColor.Black;
      }
   }
}

//Note : Please remove any background color you set in forms shared or pcl project. Hint in this class > CustomNavigationalPage

【讨论】：

Bg img 和按钮颜色设置对我有用，但是，bg 颜色或条形颜色仍然像img 一样留下一条线。我试图获得像this this这样的skype iphone应用程序的bg颜色
我相信它的底部发际线。我不太确定如何删除这个

【解决方案4】：

这过去需要自定义渲染器，但在 XF 1.3 中不再需要。 NavigationPage 现在具有 BarBackgroundColor 和 BarTextColor 属性，它们似乎运行良好。不幸的是，虽然没有自定义渲染器（我已经找到），但无法更改字体。

【讨论】：

我在帖子中提到我可以设置导航栏颜色，也可以显示在图片中。问题 iOS 有自己的背景颜色（默认为黑色）。我试图将此颜色设置为白色，所以它不会像图片中那样留下任何线条

【解决方案5】：

对我来说，这很好用：

(App.Current.MainPage as NavigationPage).BarBackgroundColor = Color.FromHex("#4388CC");

我已将此代码放入页面 ViewModel 的构造函数中。

希望这对你也有用。

【讨论】：

【解决方案6】：

NavigationController.NavigationBar.TitleTextAttributes = new UIStringAttributes() { ForegroundColor = UIColor.White };

【讨论】：