.NET MAUI中ContentView修改MainPage布局背景色无效问题求助

问题分析 #

你创建新MainPage实例修改属性无效，核心原因是这个新实例和当前显示的页面并非同一个对象，自然无法影响界面上的实际元素。WinForm的单例模式不能直接套用在MAUI中，以下是几种贴合MAUI生态的解决方案：

方案1：数据绑定（推荐，符合MVVM设计思想） #

这种方式无需直接操作页面实例，通过ViewModel传递状态，是MAUI的标准实践。

1. 创建实现INotifyPropertyChanged的ViewModel：

using System.ComponentModel;
using System.Runtime.CompilerServices;

namespace Kone.ViewModels
{
    public class MainViewModel : INotifyPropertyChanged
    {
        private Color _backScreenColor = Colors.Red;
        public Color BackScreenColor
        {
            get => _backScreenColor;
            set
            {
                _backScreenColor = value;
                OnPropertyChanged();
            }
        }

        public event PropertyChangedEventHandler? PropertyChanged;
        private void OnPropertyChanged([CallerMemberName] string propertyName = "")
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}

2. 在MainPage的XAML中绑定背景色并设置ViewModel：

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:Controls="clr-namespace:Kone.Controls"
             xmlns:vm="clr-namespace:Kone.ViewModels"
             x:Class="Kone.MainPage">

    <ContentPage.BindingContext>
        <vm:MainViewModel />
    </ContentPage.BindingContext>

    <AbsoluteLayout x:Name="mybackscreen" 
                    BackgroundColor="{Binding BackScreenColor}" >
    
        <Controls:Options x:Name="myOptions" IsVisible="true" 
                          AbsoluteLayout.LayoutFlags="PositionProportional" 
                          AbsoluteLayout.LayoutBounds="0.99, 0.02, 270, 375" />
    </AbsoluteLayout>
</ContentPage>

3. 在Options的按钮点击事件中修改ViewModel属性：

// Options.xaml.cs中的按钮点击方法
private void ChangeBgButton_Clicked(object sender, EventArgs e)
{
    if (BindingContext is MainViewModel vm)
    {
        vm.BackScreenColor = Colors.Black;
    }
}

方案2：自定义事件传递 #

通过ContentView定义专属事件，让主页面订阅后处理，实现组件间的通信。

1. 在Options（ContentView）中定义自定义事件：

namespace Kone.Controls
{
    public partial class Options : ContentView
    {
        // 定义自定义事件
        public event EventHandler<Color>? BackgroundColorRequested;

        public Options()
        {
            InitializeComponent();
        }

        private void ChangeBgButton_Clicked(object sender, EventArgs e)
        {
            // 触发事件并传递目标颜色
            BackgroundColorRequested?.Invoke(this, Colors.Black);
        }
    }
}

2. 在MainPage的构造函数中订阅事件：

public MainPage()
{
    InitializeComponent();
    // 订阅Options的自定义事件
    myOptions.BackgroundColorRequested += MyOptions_BackgroundColorRequested;
}

private void MyOptions_BackgroundColorRequested(object? sender, Color e)
{
    // 修改当前页面的mybackscreen背景色
    mybackscreen.BackgroundColor = e;
}

方案3：获取当前活跃的MainPage实例 #

若不想使用MVVM或事件机制，可直接获取当前显示的MainPage实例（类似WinForm单例思路，适配MAUI场景）：

在Options的按钮点击方法中添加以下代码：

private void ChangeBgButton_Clicked(object sender, EventArgs e)
{
    // 获取当前显示的MainPage实例
    if (App.Current.MainPage is MainPage currentMainPage)
    {
        currentMainPage.mybackscreen.BackgroundColor = Colors.Black;
    }
}

注意：需保证mybackscreen的x:FieldModifier已设为public（你已在XAML中完成设置）。

内容的提问来源于stack exchange，提问作者Kevin