.NET Maui：如何在ViewModel中设置按钮背景色？

你的代码存在几个关键问题导致绑定失效或不符合MVVM规范，以下是修正方案：

核心问题分析 #

• 构造函数直接给静态字段赋值，而非绑定属性，易导致多实例状态混乱
• 不必要的静态字段，应该用实例私有字段存储颜色状态
• 按钮点击事件写在页面后台，违背MVVM解耦原则

修正后的ViewModel代码 #

public partial class ChangeColorModeViewModel : INotifyPropertyChanged
{
    // 私有实例字段存储颜色状态
    private Color _btnColor;
    public static Color ColorWin = Color.FromRgb(0, 0, 255);
    public static Color ColorLose = Color.FromRgb(0, 0, 0);

    public ChangeColorModeViewModel()
    {
        // 直接给绑定属性赋值，触发初始UI更新
        BtnColor = ColorLose;
        // 初始化切换颜色命令
        ToggleColorCommand = new Command(ExecuteToggleColor);
    }

    // 绑定属性，遵循PascalCase命名规范（XAML绑定区分大小写）
    public Color BtnColor
    {
        get => _btnColor;
        set
        {
            if (_btnColor != value)
            {
                _btnColor = value;
                OnPropertyChanged(nameof(BtnColor));
            }
        }
    }

    // 按钮点击命令，符合MVVM模式
    public ICommand ToggleColorCommand { get; }

    private void ExecuteToggleColor()
    {
        // 切换颜色逻辑
        BtnColor = BtnColor == ColorWin ? ColorLose : ColorWin;
    }

    public event PropertyChangedEventHandler PropertyChanged;

    protected void OnPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

修正后的XAML代码 #

<ContentPage.BindingContext>
    <viewmodels:ChangeColorModeViewModel/>
</ContentPage.BindingContext> 

<Button
    x:Name="Button1"
    Grid.Row="0"
    Grid.Column="0"
    BackgroundColor="{Binding BtnColor}"
    Command="{Binding ToggleColorCommand}"/>

关键说明 #

1. 属性命名规范：XAML绑定区分大小写，使用PascalCase命名可避免绑定失败
2. 实例状态管理：用私有实例字段存储颜色，保证每个ViewModel实例的独立性
3. 命令替代事件：通过ICommand实现点击逻辑，将业务逻辑完全放在ViewModel中，符合MVVM解耦要求
4. 初始通知触发：构造函数直接给绑定属性赋值，确保页面加载时就能显示初始颜色

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