自定义ContentView的XAML数据绑定失效，代码后置绑定正常

核心原因 #

你的自定义控件PillToggle的Pills集合属性未正确实现可绑定属性（BindableProperty），也没有监听集合元素的变更通知，导致XAML绑定ViewModel集合时，控件无法感知数据变化并更新UI。

分步解决方案 #

1. 正确定义Pills的BindableProperty #

在PillToggle控件类中，将Pills属性声明为BindableProperty，并处理集合变更事件：

using System.Collections.ObjectModel;
using System.Collections.Specialized;
using Microsoft.Maui.Controls;

public class PillToggle : ContentView
{
    // 定义可绑定属性
    public static readonly BindableProperty PillsProperty =
        BindableProperty.Create(
            nameof(Pills),
            typeof(ObservableCollection<PillItem>),
            typeof(PillToggle),
            defaultValueCreator: bindable => new ObservableCollection<PillItem>(),
            propertyChanged: OnPillsChanged);

    public ObservableCollection<PillItem> Pills
    {
        get => (ObservableCollection<PillItem>)GetValue(PillsProperty);
        set => SetValue(PillsProperty, value);
    }

    // 集合属性变更时的回调
    private static void OnPillsChanged(BindableObject bindable, object oldValue, object newValue)
    {
        var control = (PillToggle)bindable;

        // 取消旧集合的事件订阅，避免内存泄漏
        if (oldValue is ObservableCollection<PillItem> oldCollection)
        {
            oldCollection.CollectionChanged -= control.PillsCollectionChanged;
        }

        // 订阅新集合的变更事件
        if (newValue is ObservableCollection<PillItem> newCollection)
        {
            newCollection.CollectionChanged += control.PillsCollectionChanged;
            // 初始化渲染新集合的所有项
            control.RenderAllPills(newCollection);
        }
    }

    // 集合元素增删改时的UI更新逻辑
    private void PillsCollectionChanged(object sender, NotifyCollectionChangedEventArgs e)
    {
        switch (e.Action)
        {
            case NotifyCollectionChangedAction.Add:
                foreach (PillItem item in e.NewItems)
                {
                    AddPillToUI(item);
                }
                break;
            case NotifyCollectionChangedAction.Remove:
                foreach (PillItem item in e.OldItems)
                {
                    RemovePillFromUI(item);
                }
                break;
            case NotifyCollectionChangedAction.Reset:
                ClearPillUI();
                RenderAllPills(Pills);
                break;
        }
    }

    // 以下是你的UI操作辅助方法，根据控件布局调整
    private StackLayout PillsContainer { get; set; }

    public PillToggle()
    {
        // 初始化控件容器（示例用StackLayout，根据你的实际布局修改）
        PillsContainer = new StackLayout { Orientation = StackOrientation.Horizontal, Spacing = 8 };
        Content = PillsContainer;
    }

    private void RenderAllPills(ObservableCollection<PillItem> pills)
    {
        ClearPillUI();
        foreach (var pill in pills)
        {
            AddPillToUI(pill);
        }
    }

    private void ClearPillUI()
    {
        PillsContainer.Children.Clear();
    }

    private void AddPillToUI(PillItem pill)
    {
        // 创建单个Pill视图（这里用自定义PillView示例，替换成你的实现）
        var pillView = new PillView
        {
            Text = pill.Text,
            IsSelected = pill.IsSelected
        };
        // 绑定选中状态变更逻辑
        pillView.Tapped += (s, e) => TogglePillSelection(pill);
        PillsContainer.Children.Add(pillView);
    }

    private void RemovePillFromUI(PillItem pill)
    {
        var targetView = PillsContainer.Children.FirstOrDefault(v => ((PillView)v).Text == pill.Text);
        if (targetView != null)
        {
            PillsContainer.Children.Remove(targetView);
        }
    }

    private void TogglePillSelection(PillItem selectedPill)
    {
        // 切换选中状态逻辑
        foreach (var pill in Pills)
        {
            pill.IsSelected = pill == selectedPill;
        }
    }
}

2. 确保PillItem实现属性变更通知 #

如果需要Pill的选中状态、文本等属性变更时同步更新UI，PillItem必须实现INotifyPropertyChanged：

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

public class PillItem : INotifyPropertyChanged
{
    private string _text;
    public string Text
    {
        get => _text;
        set
        {
            _text = value;
            OnPropertyChanged();
        }
    }

    private bool _isSelected;
    public bool IsSelected
    {
        get => _isSelected;
        set
        {
            _isSelected = value;
            OnPropertyChanged();
        }
    }

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

3. ViewModel中的集合定义 #

ViewModel中的MyPills必须是ObservableCollection类型，确保集合变更能通知控件：

public class MainViewModel
{
    public ObservableCollection<PillItem> MyPills { get; set; } = new ObservableCollection<PillItem>();

    public MainViewModel()
    {
        // 初始化测试数据
        MyPills.Add(new PillItem { Text = "首页", IsSelected = true });
        MyPills.Add(new PillItem { Text = "分类", IsSelected = false });
        MyPills.Add(new PillItem { Text = "我的", IsSelected = false });
    }
}

4. 页面XAML绑定配置 #

确保页面的BindingContext指向ViewModel，并正确绑定Pills属性：

<?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:local="clr-namespace:YourNamespace"
             x:Class="YourNamespace.MainPage">

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

    <StackLayout Padding="20">
        <!-- 绑定自定义控件的Pills属性 -->
        <local:PillToggle Pills="{Binding MyPills}" />
    </StackLayout>
</ContentPage>

关键注意点 #

• 必须使用ObservableCollection作为集合类型，普通List没有CollectionChanged事件，无法通知控件更新。
• 在BindableProperty的变更回调中，一定要订阅/取消订阅集合的CollectionChanged事件，避免内存泄漏。
• 如果Pill的属性（如选中状态）需要双向绑定，需在PillView中定义对应的BindableProperty并绑定到PillItem的属性。

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