如何更改Xamarin.Forms中的MasterDetailPage Actiobar的背景颜色，它将在所有平台中反映出来？

Question

您好，我是Xamarin Development的新手，目前正在从事PCL项目。 我使用MasterDetailsPage概念实现了导航抽屉。它工作正常。 但我面临的问题是，MasterDetailsPage是与蓝色操作栏和菜单图标来打开/关闭导航抽屉。我需要用黑色覆盖它。请提出一些建议。 我已经提到了我目前使用的代码。 此外，还有空白出现，我想摆脱它。 在URl下面他们提到了一些方法，因为我对这个新手无法为每个平台编写CustomRenderer。 https://forums.xamarin.com/discussion/comment/244966/#Comment_244966

请让我知道如何编写一个customrenderer来删除该空白以及更改工具栏的颜色。

代码：

我的XAML文件：

<?xml version="1.0" encoding="utf-8" ?> 
<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms" 
      xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
      xmlns:local="clr-namespace:WYH_XAMARIN.MasterDetailPageNavigation" 
      x:Class="WYH_XAMARIN.MasterDetailPageNavigation.NavigationDrawerPage"> 

    <MasterDetailPage.Master> 
    <ContentPage Title="Menu" 
       BackgroundColor="#e8e8e8"> 

     <StackLayout Orientation="Vertical"> 

     <!-- 
      This StackLayout you can use for other 
      data that you want to have in your menu drawer 
     --> 
     <StackLayout BackgroundColor="#e74c3c" 
        HeightRequest="75"> 

      <Label Text="Some Text title" 
       FontSize="20" 
       VerticalOptions="CenterAndExpand" 
       TextColor="White" 
       HorizontalOptions="Center"/> 
     </StackLayout> 

     <ListView x:Name="navigationDrawerList" 
        RowHeight="60" 
        SeparatorVisibility="None" 
        BackgroundColor="#e8e8e8" 
        ItemSelected="OnMenuItemSelected"> 

      <ListView.ItemTemplate> 
      <DataTemplate> 
       <ViewCell> 

       <!-- Main design for our menu items --> 
       <StackLayout VerticalOptions="FillAndExpand" 
          Orientation="Horizontal" 
          Padding="20,10,0,10" 
          Spacing="20"> 

        <Image Source="{Binding Icon}" 
         WidthRequest="40" 
         HeightRequest="40" 
         VerticalOptions="Center" /> 

        <Label Text="{Binding Title}" 
         FontSize="Medium" 
         VerticalOptions="Center" 
         TextColor="Black"/> 
       </StackLayout> 
       </ViewCell> 
      </DataTemplate> 
      </ListView.ItemTemplate> 
     </ListView> 
     </StackLayout> 

    </ContentPage> 
    </MasterDetailPage.Master> 

    <MasterDetailPage.Detail> 

    <NavigationPage> 

    </NavigationPage> 
    </MasterDetailPage.Detail> 
</MasterDetailPage> 

和我的类文件是：

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Text; 
using System.Threading.Tasks; 
using WYH_XAMARIN.PojoClasses; 
using Xamarin.Forms; 

namespace WYH_XAMARIN.MasterDetailPageNavigation 
{ 
    public partial class NavigationDrawerPage : MasterDetailPage 
    { 
     LoginSuccessfullResponse loginSuccessResponse; 
     public List<MasterPageItem> menuList { get; set; } 

     public NavigationDrawerPage() 
     { 

      InitializeComponent(); 

      NavigationPage.SetHasNavigationBar(this, false); 

      menuList = new List<MasterPageItem>(); 

      // Creating our pages for menu navigation 
      // Here you can define title for item, 
      // icon on the left side, and page that you want to open after selection 
      var page1 = new MasterPageItem() { Title = "My Profile", Icon = "icon.png", TargetType = typeof(TestPage1) }; 
      var page2 = new MasterPageItem() { Title = "Service Booking", Icon = "icon.png", TargetType = typeof(TestPage2) }; 
      var page3 = new MasterPageItem() { Title = "Item 3", Icon = "icon.png", TargetType = typeof(TestPage3) }; 

      // Adding menu items to menuList 
      menuList.Add(page1); 
      menuList.Add(page2); 
      menuList.Add(page3); 

      // Setting our list to be ItemSource for ListView in MainPage.xaml 
      navigationDrawerList.ItemsSource = menuList; 

      // Initial navigation, this can be used for our home page 
      Detail = new NavigationPage((Page)Activator.CreateInstance(typeof(TestPage1))); 
     } 

     public NavigationDrawerPage(LoginSuccessfullResponse loginSuccessResponse) 
     { 
      this.loginSuccessResponse = loginSuccessResponse; 

      InitializeComponent(); 

      NavigationPage.SetHasNavigationBar(this, false); 

      menuList = new List<MasterPageItem>(); 

      // Creating our pages for menu navigation 
      // Here you can define title for item, 
      // icon on the left side, and page that you want to open after selection 
      var page1 = new MasterPageItem() { Title = "My Profile", Icon = "icon.png", TargetType = typeof(TestPage1) }; 
      var page2 = new MasterPageItem() { Title = "Service Booking", Icon = "icon.png", TargetType = typeof(TestPage2) }; 
      var page3 = new MasterPageItem() { Title = "Item 3", Icon = "icon.png", TargetType = typeof(TestPage3) }; 

      // Adding menu items to menuList 
      menuList.Add(page1); 
      menuList.Add(page2); 
      menuList.Add(page3); 

      // Setting our list to be ItemSource for ListView in MainPage.xaml 
      navigationDrawerList.ItemsSource = menuList; 

      // Initial navigation, this can be used for our home page 
      Detail = new NavigationPage((Page)Activator.CreateInstance(typeof(TestPage1))); 
     } 

     // Event for Menu Item selection, here we are going to handle navigation based 
     // on user selection in menu ListView 
     private void OnMenuItemSelected(object sender, SelectedItemChangedEventArgs e) 
     { 

      var item = (MasterPageItem)e.SelectedItem; 
      Type page = item.TargetType; 

      Detail = new NavigationPage((Page)Activator.CreateInstance(page)); 
      IsPresented = false; 
     } 
    } 
} 

伙计们，请帮我解决这个问题。 任何示例代码或工作教程都会有所帮助。 在此先感谢！

Answer 1

但我面临的问题是，MasterDetailsPage是与蓝色操作栏和菜单图标来打开/关闭抽屉导航。

你不需要做客户呈现改变ActionBar颜色 尝试使用

Detail = new NavigationPage((Page)Activator.CreateInstance(typeof(MainPage))) { BarBackgroundColor = Color.Red };

有空格出现

我没有重现您的问题，我的主详细信息页面正常工作，没有写入行。你可以参考my project。

通过检查您提供的链接的答案。我创建了一个用户在Android项目渲染MarstDetialPage：

[assembly: ExportRenderer(typeof(MasterDetailPage), typeof(CustomMasterDetailRenderer))] 
namespace MasterDetialPage_MyTest.Droid 
{ 
    public class CustomMasterDetailRenderer : MasterDetailPageRenderer 
    { 
     public override void AddView(Android.Views.View child) 
     { 
      child.GetType().GetRuntimeProperty("TopPadding").SetValue(child, 0); 
      var padding = child.GetType().GetRuntimeProperty("TopPadding").GetValue(child); 

      base.AddView(child); 
     } 
    } 
} 

它会得到屏幕而不通知栏。

注：我只测试了Android平台

上