UWP ObservableCollection 通知 View 发生变化答案

【问题标题】：UWP ObservableCollection notifies View on changeUWP ObservableCollection 通知 View 发生变化
【发布时间】：2020-11-16 12:24:58
【问题描述】：

我想创建一个带有页面的 UWP 应用程序，该页面显示项目列表，这些项目列在 ObservableCollection 中。当我从列表中添加或删除一个项目时，它也应该从 GUI 的视图中添加或删除。或者当我更改项目的属性时，它也应该在 GUI 的视图中更改。我尝试了another page on this platform 的代码，但没有成功。

在 ObservableCollection 中的更改（新项目、删除的项目、项目内的值已更改）时通知使用 ObservableCollection 作为 ItemsSource 的视图（ListView 或 TreeView）需要什么？ NotifiyPropertyChanged() 在这种情况下不起作用，但适用于简单的字符串成员。谁能给我一个来自 Model、View 和 ViewModel 的小型工作示例代码？

亲切的问候，沃尔夫冈

【问题讨论】：

标签： mvvm uwp observablecollection

【解决方案1】：

谁能给我一个来自模型、视图和视图模型的小型工作示例代码？

好的，请检查以下代码。并且ObservableCollection 在添加或删除项目时可以在没有NotifiyPropertyChanged 的情况下通知 UI Change。

public sealed partial class MainPage : Page
{

    private ObservableCollection<Book> Books { get; set; } = new ObservableCollection<Book>();
    public MainPage()
    {
        this.InitializeComponent();
        GetData();
    }

    private void GetData()
    {
        for (int i = 0; i < 25; i++)
        {
            var book = new Book { Name = $" Book{i}", Author = $"Author{i}" };
            Books.Add(book);

        }
        MyListView.ItemsSource = Books;
    }



    private int count;
    private void AddClick(object sender, RoutedEventArgs e)
    {

        count++;
        Books.Insert(0, new Book { Name = $"NewBook{count}", Author = $"NewAuthor{count}" });
    }

    private void DelClick(object sender, RoutedEventArgs e)
    {
        if (Books.Count != 0)
        {
            Books.RemoveAt(0);
        }


    }
}
public class Book
{
    public string Name { get; set; }
    public string Author { get; set; }
}

Xaml

<Page.BottomAppBar>
    <CommandBar>
        <AppBarButton
            Click="AddClick"
            Icon="Add"
            Label="Add"
            />
        <AppBarButton
            Click="DelClick"
            Icon="Delete"
            Label="Delete"
            />
    </CommandBar>
</Page.BottomAppBar>
<Grid>

    <ListView x:Name="MyListView">
        <ListView.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding Name}" />
                    <TextBlock Margin="23,0,0,0" Text="{Binding Author}" />
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</Grid>

【讨论】：

非常感谢。我看不出与我的代码有什么不同，但我会将您的（工作！）代码更改为我的版本，看看与我的原始代码有什么不同:)
在我的原始代码中，我使用了带有附加代码的 TreeView，以便能够定义多个模板。也许这段代码没有更新 TreeViewItems。但是现在我创建了一个 ListView，它看起来与我以前的 TreeView 非常相似，但没有多个模板（顶部项目具有相同的类型并包含具有另一种类型的成员列表，这些成员显示在顶部项目的 ListView 模板中的 ListView 中）。