0

您好,我是Xamarin Development的新手,目前正在從事PCL項目。 我使用MasterDetailsPage概念實現了導航抽屜。它工作正常。 但我面臨的問題是,MasterDetailsPage是與藍色操作欄和菜單圖標來打開/關閉導航抽屜。我需要用黑色覆蓋它。請提出一些建議。 我已經提到了我目前使用的代碼。 此外,還有空白出現,我想擺脫它。 在URl下面他們提到了一些方法,因爲我對這個新手無法爲每個平臺編寫CustomRenderer。 https://forums.xamarin.com/discussion/comment/244966/#Comment_244966如何更改Xamarin.Forms中的MasterDetailPage Actiobar的背景顏色,它將在所有平臺中反映出來?

請讓我知道如何編寫一個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; 
     } 
    } 
} 

夥計們,請幫我解決這個問題。 任何示例代碼或工作教程都會有所幫助。 在此先感謝!

回答

0

但我面臨的問題是,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平臺

enter image description hereenter image description here