使用 x:Bind 显示列表 <T>？

Question

我目前正在研究如何使用 UWP/xaml 中的 x:Bind 内容。我每天都在学习更多，而且我目前正在编写的应用程序变得更易于管理，因为我现在可以实施 MVVM 模式。

但是我现在遇到了一件事...

我有一个 List<T>，我想在我的 UI 中显示。如何在使用 x:Bind 时将此列表分类？

还是我必须先将它转换成其他东西？

此致，丹尼尔

Answer 1

您当然可以使用 List<T> 进行绑定，但通常 ObservableCollection<T> 更可取，因为它还允许 UI 观察列表更改，而不是 List<T> 在先绑定后不会更新。您可以使用构造函数从 List 创建一个 ObservableCollection：

ObservableCollection<T> data = new ObservableCollection<T>( list );

无论如何，您首先必须在视图模型中创建一个属性（但 x:Bind 也支持字段）：

public ObservableCollection<T> Data { get; } = new ObservableCollection<T>();

请记住绑定连接到实例，因此如果您将新实例设置为 Data 属性，绑定将不会更新。为此，您需要在视图 mdoel 上实现 INotifyPropertyChanged 接口，并在 setter.

中引发 PropertyChanged 事件

现在，要显示 UI 中的项目，您需要一个列表控件，如 ListView 或 GridView，并将其绑定到 collection:

<ListView ItemsSource="{x:Bind Data, Mode=OneWay}">
    <ListView.ItemTemplate>
        <DataTemplate>
            <!-- your template -->
            <TextBlock Text="{Binding SomePropertyOfT}" />
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

您也可以在 documentation 中找到完整的数据绑定演练。

Answer 2

如果您希望拥有一个可能随时间变化的集合，并且您希望 UI 收到此类修改的通知，则不应使用 List<T>！

改用 ObservableCollection<T>，它实现了 INotifyPropertyChanged 和 INotifyCollectionChanged，这是 MVVM 的核心，允许 ViewModel/View 相互通信。这样的集合自动为你自动处理addiction/removal个元素！

无论如何，这是一个简单的示例，展示了如何使用 List 与视图进行通信。

MainPage.xaml.cs

public MainPage()
{
    this.InitializeComponent();

    RandomList = new List<string>() {
        "random 1", "random 2", "random 3"
    };
}

List<string> RandomList { get; set; }

MainPage.xaml:

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <ComboBox ItemsSource="{x:Bind RandomList}" 
                PlaceholderText="List of Random things"/>
</Grid>

这里我们定义了一个 {x:Bind } 来填充 ItemsSource 的依赖项属性，它接受一个 Collection。

此绑定是使用默认绑定模式定义的，对于已编译的绑定，它是 OneTime。例如，如果您要使用 {Binding } 标记执行绑定，则默认模式为 OneWay;
由于您使用 List 而不是 ObservableCollection 创建了一个集合，因此没有理由指定默认模式以外的任何其他模式，因为您还没有为 CLR 集合实现一种机制来实际通知视图更新。

使用 x:Bind 显示列表 <T>？

Display a List<T> by using x:Bind?

c#

xaml

uwp

win-universal-app