MAUI中MVVM绑定后UI未随OnPropertyChanged更新问题排查

问题描述 #

将Xamarin应用迁移至MAUI后，语言选择器切换语言时，UI无法通过MVVM的OnPropertyChanged机制更新，原Xamarin环境中功能正常。

相关代码 #

XAML代码 #

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:CustomViews="clr-namespace:HeatLoadApp_MAUI.CustomViews"
             NavigationPage.HasNavigationBar="False"
             x:Class="HeatLoadApp_MAUI.SettingsPage"
             xmlns:ViewModels="clr-namespace:HeatLoadApp_MAUI.ViewModels"
             x:DataType="ViewModels:SettingsViewModel">

    <ContentPage.Content>
        <VerticalStackLayout>
                <!--NAVIGATION BAR-->
            <CustomViews:CustomNavigationBar Grid.Row="0" TitleText="{Binding Settings}"/>

            <Grid RowSpacing="20" Padding="20">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="2*" />
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>

                <!--LANGUAGE SELECTION-->
                    <Label
                        x:Name="lblLanguage"
                        Grid.Row="0"
                        Grid.Column="0"
                        Text="{Binding Language}"/>

                    <Picker
                        x:Name="pickerLanguage"
                        Grid.Row="0"
                        Grid.Column="1"
                        Title="Select language"
                        ItemsSource="{Binding LanguageList}"
                        SelectedIndex="{Binding SelectedIndex}"/>

            </Grid>
        </VerticalStackLayout>
    </ContentPage.Content>
</ContentPage>

页面后台代码 #

using HeatLoadApp_MAUI.ViewModels;

namespace HeatLoadApp_MAUI;

public partial class SettingsPage : ContentPage
{
    SettingsViewModel settingsViewModel = new SettingsViewModel();

    public SettingsPage()
    {
        InitializeComponent();
        BindingContext = settingsViewModel;
    }
}

ViewModel代码 #

using System;
using System.ComponentModel;
using System.Data;
using System.Runtime.CompilerServices;
using HeatLoadApp_MAUI.Utilities;

namespace HeatLoadApp_MAUI.ViewModels
{
    public class SettingsViewModel: NotifyPropertyChanged
    {
        public SettingsViewModel()
        {
            RefreshLanguagesOnAppearing();
        }

        public void RefreshLanguagesOnAppearing()
        {
            Settings = "";
            Language = "";
        }

        private string settings;
        public string Settings
        {
            get { return settings; }
            set
            {
                settings = FilterTranslationDatabase(StaticShareProperties.selectedLanguageIndex);
                OnPropertyChanged();
            }
        }

        private string language;
        public string Language
        {
            get { return language; }
            set
            {
                //alternative call for stackoverflow question
                language = WorkAroundForStackOverflow();

                //standard call
                language = FilterTranslationDatabase(StaticShareProperties.selectedLanguageIndex);
                OnPropertyChanged();
            }
        }

        public string WorkAroundForStackOverflow()
        {
            string dummy = null;
            if (selectedIndex == 0) dummy = "lingua";
            else if (selectedIndex == 1) dummy = "language";
            return dummy;
        }

        private int selectedIndex;
        public int SelectedIndex
        {
            get { return selectedIndex; }
            set
            {
                selectedIndex = value;
                StaticShareProperties.selectedLanguageIndex = selectedIndex + 3;
                //plus 3 beacuse tranlations start from third column of database
                RefreshLanguagesOnAppearing();
            }
        }

        //language list to be shown in picker menu
        public List<string> LanguageList
        {
            get
            {
                return new List<string> { "Italiano", "English" };
            }
        }

        private string FilterTranslationDatabase(int indexLanguage, [CallerMemberName] string callerMember = "")
        {
            DataView dataview = App.dtTranslations.DefaultView;
            dataview.RowFilter = App.dtTranslations.Columns[2].ToString() + "='" + callerMember.ToString() + "'";

            string translation = dataview.ToTable().Rows[0][indexLanguage].ToString();
            return translation;
        }
    }
}

PropertyChanged基类代码 #

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

namespace HeatLoadApp_MAUI.Utilities
{
    public class NotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        public void OnPropertyChanged([CallerMemberName] string name = null)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));
        }
    }
}

问题分析与修复方案 #

1. 核心问题：NotifyPropertyChanged未实现INotifyPropertyChanged接口 #

MAUI的绑定系统严格要求视图模型类实现INotifyPropertyChanged接口才能正确响应属性变更通知。原代码中的NotifyPropertyChanged类仅定义了PropertyChanged事件，但未继承接口，这在Xamarin中可能因兼容性宽松正常工作，但MAUI会忽略未实现接口的变更通知。

修复代码：

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

namespace HeatLoadApp_MAUI.Utilities
{
    // 添加INotifyPropertyChanged接口实现
    public class NotifyPropertyChanged : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        public void OnPropertyChanged([CallerMemberName] string name = null)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));
        }
    }
}

2. 属性setter逻辑滥用，依赖副作用更新值 #

原ViewModel中Settings和Language的setter完全忽略传入的value参数，直接从数据库获取值，这种设计不仅违反属性的语义，还可能导致MAUI绑定系统无法正确识别属性变更。同时RefreshLanguagesOnAppearing通过赋值空字符串触发setter的方式属于滥用副作用，逻辑不清晰。

修复代码：
重构RefreshLanguagesOnAppearing方法，直接更新字段并触发变更通知：

public void RefreshLanguagesOnAppearing()
{
    // 直接从数据库获取最新翻译并更新字段
    settings = FilterTranslationDatabase(StaticShareProperties.selectedLanguageIndex);
    OnPropertyChanged(nameof(Settings));
    
    language = FilterTranslationDatabase(StaticShareProperties.selectedLanguageIndex);
    OnPropertyChanged(nameof(Language));
}

同时修正属性setter，使其符合正常语义：

private string settings;
public string Settings
{
    get { return settings; }
    set
    {
        if (settings != value)
        {
            settings = value;
            OnPropertyChanged();
        }
    }
}

private string language;
public string Language
{
    get { return language; }
    set
    {
        if (language != value)
        {
            language = value;
            OnPropertyChanged();
        }
    }
}

3. SelectedIndex属性未触发自身变更通知 #

SelectedIndex的setter应触发自身的PropertyChanged通知，确保绑定系统能正确感知选择项的变化：

private int selectedIndex;
public int SelectedIndex
{
    get { return selectedIndex; }
    set
    {
        if (selectedIndex != value)
        {
            selectedIndex = value;
            StaticShareProperties.selectedLanguageIndex = selectedIndex + 3;
            RefreshLanguagesOnAppearing();
            OnPropertyChanged(); // 通知自身属性变更
        }
    }
}

4. 数据库查询逻辑优化 #

FilterTranslationDatabase方法中构造RowFilter时，使用Columns[2].ToString()可能无法正确获取列名，应改为Columns[2].ColumnName，避免潜在的查询错误：

private string FilterTranslationDatabase(int indexLanguage, [CallerMemberName] string callerMember = "")
{
    DataView dataview = App.dtTranslations.DefaultView;
    // 使用ColumnName获取列名，避免ToString()返回非预期结果
    dataview.RowFilter = $"{App.dtTranslations.Columns[2].ColumnName}='{callerMember}'";

    string translation = dataview.ToTable().Rows[0][indexLanguage].ToString();
    return translation;
}

总结 #

以上修复中，实现INotifyPropertyChanged接口是解决UI不更新的核心，其余优化则是提升代码健壮性和语义正确性。修复后，MAUI绑定系统能正确接收属性变更通知，语言切换时UI将正常更新。

内容的提问来源于stack exchange，提问作者Andrea Loris Galvanin