Xamarin.Forms - 为 MasterDetailPage 应用设置一致的背景答案

【问题标题】：Xamarin.Forms - Setting a consistent background for MasterDetailPage appXamarin.Forms - 为 MasterDetailPage 应用设置一致的背景
【发布时间】：2020-12-11 14:52:05
【问题描述】：

我正在构建一个移动应用程序作为学习/爱好项目，我很好奇我可以在 xamarin 应用程序中推动设计多远。有没有办法在主视图中使用 MasterDetailPage 的应用程序中呈现一致的背板或图像？我想要实现的效果是当显示每个页面时，该页面将具有透明背景，应用程序背景永远不会改变或完全是页面转换的一部分。

【问题讨论】：

标签： xamarin.forms

【解决方案1】：

一个。

由于派生自 Page 的任何页面类型（Shell、NavigationPage、ContentPage 等）都具有 BackgroundImageSource 属性，因此您可以在 App.xaml 中全局定义该值。

    <Application.Resources>
        <Style ApplyToDerivedTypes="True" TargetType="Page">
            <Setter Property="BackgroundImageSource" Value="your_image.png" />
        </Style>
    </Application.Resources>

好吧，如果你只想为 MasterDetail 页面应用它，你可以只为 NavigationPage 设置样式。

    <Application.Resources>
        <Style TargetType="NavigationPage">
            <Setter Property="BackgroundImageSource" Value="your_image.png" />
        </Style>
    </Application.Resources>

【讨论】：

【解决方案2】：

如果您希望项目中的所有页面都具有相同的背景，您可以创建一个 BaseContentPage，其中包含 background image 或 backgroundColor，然后所有其他页面都继承自 BaseContentPage ：

基本内容页面：

public class BasePage : ContentPage
{
    public BasePage()
    {
        this.BackgroundImageSource = "logo.jpg";
    }
}

您项目中的其他页面：

public partial class Page1 : BasePage
{
    public Page1()
    {
        InitializeComponent();
    }
}

在 Xaml 中：

<?xml version="1.0" encoding="utf-8" ?>
<xaminals:BasePage  xmlns:xaminals="clr-namespace:Xaminals"
                    xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d"
             x:Class="Xaminals.Page1">
    
    <xaminals:BasePage.Content>
        <StackLayout>
            <Label Text="Welcome to Xamarin.Forms!"
                VerticalOptions="CenterAndExpand" 
                HorizontalOptions="CenterAndExpand" />
        </StackLayout>
    </xaminals:BasePage.Content>
</xaminals:BasePage>

那么所有的页面都会有logo图片作为背景图片。

【讨论】：