UWP ObservableCollection 通知视图发生变化

Question

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

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

亲切的问候，沃尔夫冈

Answer 1

Can anyone give me a small working example code from Model, View and ViewModel?

好的，请检查以下代码。并且 ObservableCollection 可以在添加或删除项目时通知 UI 更改而无需 NotifiyPropertyChanged。

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>

UWP ObservableCollection 通知视图发生变化

UWP ObservableCollection notifies View on change

mvvm

uwp

observablecollection