WinUI中动态添加UserControl后属性值无法更新的解决方法

嘿，这个问题我太熟了！你遇到的核心问题是你的UCDownloadCard用户控件没有实现属性变化通知机制，导致属性值更新后UI不知道要同步刷新。咱们一步步来解决：

1. 给UCDownloadCard添加INotifyPropertyChanged实现 #

UWP的x:Bind（还有传统的Binding）需要属性变更通知才能自动更新UI。你现在的属性是普通的CLR属性，修改值后不会触发任何通知，所以UI纹丝不动。

修改你的UCDownloadCard后台代码，实现INotifyPropertyChanged接口：

public sealed partial class UCDownloadCard : UserControl, INotifyPropertyChanged
{
    public UCDownloadCard()
    {
        this.InitializeComponent();
    }

    // 实现INotifyPropertyChanged接口的事件
    public event PropertyChangedEventHandler PropertyChanged;

    // 辅助方法，触发属性变更通知
    private void OnPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }

    private string _fileName;
    public string FileName
    {
        get => _fileName;
        set
        {
            if (_fileName != value)
            {
                _fileName = value;
                OnPropertyChanged(nameof(FileName));
            }
        }
    }

    private string _downloadSpeed;
    public string DownloadSpeed
    {
        get => _downloadSpeed;
        set
        {
            if (_downloadSpeed != value)
            {
                _downloadSpeed = value;
                OnPropertyChanged(nameof(DownloadSpeed));
            }
        }
    }

    private string _downloadCompletePercent;
    public string DownloadCompletePercent
    {
        get => _downloadCompletePercent;
        set
        {
            if (_downloadCompletePercent != value)
            {
                _downloadCompletePercent = value;
                OnPropertyChanged(nameof(DownloadCompletePercent));
            }
        }
    }
}

2. 确认XAML中的绑定模式 #

你的XAML里已经用了Mode=OneWay（比如DownloadSpeed）和Mode=OneTime（FileName），这没问题，但要确保需要实时更新的属性用OneWay或者TwoWay模式（这里OneWay足够）。

3. 优化MainPage中的更新逻辑（可选但重要） #

你现在在DownloadProgressChanged里直接用AddedCards[0]，这只适合第一个下载，要是有多个下载就会出错。建议你把DownloadOperation和对应的UCDownloadCard关联起来，比如用字典存储：

在MainPage里替换原来的AddedCards为字典：

public Dictionary<DownloadOperation, UCDownloadCard> DownloadCardMap { get; set; } = new Dictionary<DownloadOperation, UCDownloadCard>();

然后修改AddDownloadProgressCard方法，把当前的downloadOperation和卡片关联：

private void AddDownloadProgressCard(DownloadOperation downloadOperation)
{
    var card = new UCDownloadCard
    {
        Name = $"Card{DownloadCardMap.Count}",
        FileName = downloadOperation.ResultFile.Name, // 用真实的文件名更合理
        DownloadCompletePercent = "0% completed",
        DownloadSpeed = "0 KB/s"
    };
    DownloadCardMap.Add(downloadOperation, card);
    OutputArea.Children.Add(card);
}

在HandleDownloadAsync里调用时传入downloadOperation：

AddDownloadProgressCard(downloadOperation);

最后修改DownloadProgressChanged：

private void DownloadProgressChanged(DownloadOperation downloadOperation)
{
    if (!DownloadCardMap.TryGetValue(downloadOperation, out var card))
        return;

    var downloadPercent = 100 * ((double)downloadOperation.Progress.BytesReceived / (double)downloadOperation.Progress.TotalBytesToReceive);
    var percentText = $"{downloadPercent:F1}% completed"; // 格式化显示更友好
    var speedText = $"{(downloadOperation.Progress.BytesReceived / 1024):F1} KB/s"; // 计算实时下载速度

    this.Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.High, () =>
    {
        card.DownloadCompletePercent = percentText;
        card.DownloadSpeed = speedText;
        Debug.WriteLine($"Updating Progress: {percentText}");
    });
}

为什么这样能解决问题？ #

当你修改UCDownloadCard的属性时，setter里会调用OnPropertyChanged方法，触发PropertyChanged事件。x:Bind会监听这个事件，一旦收到通知，就会自动更新对应的UI元素。之前的普通属性没有这个通知机制，所以UI不会响应变化。

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