Xamarin MasterDetailPage看起来很难看

Question

我正在尝试创建一个MasterDetailPage，我不太确定，如果我这样做，但抽屉/主人看起来很难看。例如，导航栏颜色未显示，...：

有关如何改进它的任何想法/提示？

Answer 1

MasterDetailPage信息

在我们跳到答案之前，让我们回顾MasterDetailPage课程，以及如何在您的示例中配置MasterDetailPage。

Xamarin.Forms中的MasterDetailPage类需要两个Page属性：

• MasterDetailPage.Detail属性需要设置为包含NavigationPage实例的ContentPage。

• MasterDetailPage.Master属性需要设置为ContentPage个实例

示例中的Detail页面位于屏幕右侧。 Detail页面是ContentPage内的NavigationPage，NavigationPage.BarBackgroundColor设置为Color.Black。此ContentPage内的NavigationPage ContentPage.BackgroundColor设置为Color.Grey。

示例中的Master页面位于屏幕左侧。这是ContentPage，其中包含ListView。在不知道您的代码的情况下，我的猜测是ContentPage.BackgroundColor设置为Color.White而ListView.BackgroundColor未设置。

选择导航抽屉图标时，将覆盖导航栏。这是因为导航栏位于Detail页面上，而不在Master页面上。

回答您的问题

为什么导航栏颜色未显示在Master页面上？

Master页面只能是ContentPage且不能在NavigationPage内，因此它没有导航栏（只有NavigationPage可以有一个导航栏。）

如何改进用户界面？

首先，验证您使用的是最新版本的Xamarin.Forms，v2.3.2.127。

<强>的iOS

在iOS上，您可以通过设置Detail页面的Padding属性来模仿Master页面的导航栏颜色。将Master页面BackgroundColor属性设置为Color.Black，如下所示：

Master = new ContentPage
{
  BackgroundColor = Color.Black,
  Padding = new Thickness(0, Device.OnPlatform(64, 0, 0), 0, 0)
};

<强>的Android

在Android上，预期的行为是让Master页面从左侧滑入并覆盖Detail页面。要更新Android UI，我建议您更新以下三个项目之一：Master.BackgroundColor属性，ListView.BackgroundColor属性或Master页面上ListView中使用的图标颜色。

如果您不希望导航栏向右移动，则可以在Android FormsApplicationActivity类中扩展MainActivity，这将阻止导航栏移动：

public class MainActivity : Xamarin.Forms.Platform.Android.FormsApplicationActivity

此示例显示当您使用FormsApplicationActivity时，NavigationBar不会在Android应用上滑过：

https://developer.xamarin.com/samples/xamarin-forms/Navigation/MasterDetailPage/

Answer 2

您可以使用片段活动轻松应用于抽象布局中的母版页面应用于母版页和抽象布局中应用于布局中您将自定义龙和公共类的动作事件