.NET MAUI自定义AvtorizeEntry控件绑定失效原因咨询

问题描述 #

自定义了一个MAUI的AvtorizeEntry控件，相关代码如下：

控件XAML代码 #

<ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="SWMClient.Infrastructure.Controls.AvtorizeEntry"
             x:Name="AvtorizeEntryControl"
             BindingContext="{x:Reference AvtorizeEntryControl}">

    <Border
                WidthRequest="320"
                Opacity="0.7"
                StrokeThickness="1"
                Stroke="black"
                HorizontalOptions="Center">

        <HorizontalStackLayout>
            <Image Margin="5" Source="{Binding ImageEntry}" WidthRequest="35"/>
            <Entry TextColor="Black" WidthRequest="250" Text="{Binding EntryText }"/>
        </HorizontalStackLayout>
    </Border>
    
</ContentView>

控件后台属性代码 #

public static readonly BindableProperty EntryTextProperty =
                 BindableProperty.Create("EntryText", typeof(string), typeof(AvtorizeEntry));
public string EntryText
{
    get => (string)GetValue(EntryTextProperty);
    set => SetValue(EntryTextProperty, value);
}

public static readonly BindableProperty ImageEntryProperty =
                 BindableProperty.Create("ImageEntry", typeof(ImageSource), typeof(AvtorizeEntry));
public ImageSource ImageEntry
{
    get => (ImageSource)GetValue(ImageEntryProperty);
    set => SetValue(ImageEntryProperty, value);
}

将控件绑定到页面ViewModel的Login属性时：

<controls:AvtorizeEntry EntryText="{Binding Login}" ImageEntry="profel.png"/>

ViewModel代码：

partial class RegistrationViewModel : ObservableObject
{
#region Propertys
    [ObservableProperty]
    private string pasword = "pasword";

    [ObservableProperty]
    private string login = "login";
#endregion
}

绑定完全未生效，初始值无法显示，输入内容也无法同步回ViewModel。

核心原因 #

1. 自定义BindableProperty默认绑定模式为单向：EntryTextProperty创建时未指定BindingMode.TwoWay，MAUI中BindableProperty的默认模式是OneWay，仅能实现从ViewModel到控件的单向值传递，无法反向同步用户输入内容。
2. （潜在检查点）页面未正确绑定ViewModel：若页面未将RegistrationViewModel实例设置为自身的BindingContext，控件的EntryText="{Binding Login}"会找不到对应属性。

修复方案 #

1. 修改EntryTextProperty的绑定模式 #

创建EntryTextProperty时显式指定双向绑定模式，同时用nameof替代硬编码字符串避免拼写错误：

public static readonly BindableProperty EntryTextProperty =
    BindableProperty.Create(
        nameof(EntryText),
        typeof(string), 
        typeof(AvtorizeEntry),
        defaultBindingMode: BindingMode.TwoWay);

public string EntryText
{
    get => (string)GetValue(EntryTextProperty);
    set => SetValue(EntryTextProperty, value);
}

2. （可选）明确控件内部Entry的双向绑定 #

虽然Entry的Text属性默认绑定模式是TwoWay，显式声明可让代码意图更清晰：

<Entry TextColor="Black" WidthRequest="250" Text="{Binding EntryText, Mode=TwoWay}"/>

3. 确认页面BindingContext设置 #

确保页面已将ViewModel实例设为BindingContext，比如在页面后台代码中添加：

public RegistrationPage()
{
    InitializeComponent();
    BindingContext = new RegistrationViewModel();
}

或在XAML中通过静态资源声明：

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

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