Xamarin.Forms - 通过工具栏显示背景图像

Question

我希望我的应用中的每个页面顶部都有一个透明的工具栏，以及一个覆盖整个页面的背景图片。

在App.xaml.cs中，我写了以下内容：

MainPage = new NavigationPage(new MDMaster())
{
     BarBackgroundColor = Color.Transparent,
     BackgroundImage = "background_1.png"
};

这将正确使工具栏透明，但不显示背景图像。我可以添加背景颜色而不是背景图像。

MDMaster是MasterDetailPage的主要组件。在MDMaster页面上，我设置了详细信息页面，如下所示：

Detail = new NavigationPage(new ProfilePage())
{
    BarBackgroundColor = Color.Transparent,
    BackgroundImage = "background_1.png"
};

这甚至都没有显示背景图像。

在ProfilePage上，我可以写：

public ProfilePage()
{
    InitializeComponent();        
    this.BackgroundImage = "background_1.png";
}

这将显示背景图像，但它不会覆盖工具栏后面的区域，即使它是透明的。最终看起来像这样：

Answer 1

首先，正如@Yuri S建议的那样，您不需要用MasterDetailPage包裹NavigationPage。只需将MasterDetailPage设置为MainPage即可。

然后，当您将背景图像设置为根MasterDetailPage时，背景图像未显示的原因是因为顶部NavigationPage不透明且它隐藏了背景图像。

因此，要解决此问题，您还需要设置BackgroundColor的{​​{1}}：

NavigationPage to transparent

然后它将显示如下：

如果您不希望状态栏显示如上，则可以在Droid项目中手动设置：

public App()
{
    InitializeComponent();

    MainPage = new MasterDetailPage()
    {
        Master=new MainPage(),
        Detail=new NavigationPage(new Detail())
        {
            BarBackgroundColor=Color.Transparent,
            BackgroundColor=Color.Transparent
        },
        BackgroundImage="tianyuan.jpg"
    };
}

它将显示如下：