WPF数据绑定：在XAML中加载ViewModel列表中的多实例对象

结合Caliburn.Micro的便捷绑定特性和WPF的ItemsControl，你完全能告别硬编码XAML，让UI自动根据ViewModel里的列表生成对应实例的展示。下面给你一步步讲怎么弄：

第一步：ViewModel层准备好可观察列表 #

首先确保你的主ViewModel里有一个**ObservableCollection<T>**类型的列表（它会自动通知UI更新，比普通List好用多了），比如：

using Caliburn.Micro;
using System.Collections.ObjectModel;

public class MainViewModel : Screen
{
    // 把MyItemViewModel换成你实际的实例类型
    public ObservableCollection<MyItemViewModel> ItemInstances { get; }

    public MainViewModel()
    {
        // 初始化列表，塞进去你的4个实例
        ItemInstances = new ObservableCollection<MyItemViewModel>
        {
            new MyItemViewModel { Title = "实例1", Value = 10 },
            new MyItemViewModel { Title = "实例2", Value = 20 },
            new MyItemViewModel { Title = "实例3", Value = 30 },
            new MyItemViewModel { Title = "实例4", Value = 40 }
        };
    }
}

// 单个实例的ViewModel，记得继承PropertyChangedBase来支持属性通知
public class MyItemViewModel : PropertyChangedBase
{
    private string _title;
    public string Title
    {
        get => _title;
        set => Set(ref _title, value);
    }

    private int _value;
    public int Value
    {
        get => _value;
        set => Set(ref _value, value);
    }
}

第二步：XAML里用ItemsControl自动渲染 #

然后在你的View里用ItemsControl绑定到这个列表，再通过ItemTemplate定义每个实例的UI布局。Caliburn.Micro还能帮你简化绑定语法，省掉一堆Binding代码：

<Window x:Class="YourAppNamespace.MainView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:cal="http://www.caliburnproject.org">
    <Grid Margin="10">
        <!-- 绑定到ViewModel的ItemInstances列表 -->
        <ItemsControl ItemsSource="{Binding ItemInstances}">
            <!-- 定义单个实例的UI模板 -->
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <!-- 这里就是你每个实例要展示的UI，和你之前硬编码的单个实例布局一致就行 -->
                    <Border BorderBrush="#E0E0E0" BorderThickness="1" 
                            CornerRadius="4" Padding="8" Margin="5">
                        <StackPanel>
                            <!-- 用Caliburn.Micro的自动绑定：控件Name和属性名一致就不用写Binding -->
                            <TextBlock x:Name="Title" FontWeight="SemiBold" FontSize="14"/>
                            <TextBlock x:Name="Value" Margin="0,4,0,0" Foreground="#666"/>
                            <!-- 如果有命令，也能自动绑定，比如： -->
                            <!-- <Button Content="操作" cal:Message.Attach="[Event Click] = [Action DoSomething]"/> -->
                        </StackPanel>
                    </Border>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
            <!-- 可选：调整布局方式，比如横向排列或者自动换行 -->
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapPanel/>
                    <!-- 换成StackPanel Orientation="Horizontal"就是横向排列 -->
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>
    </Grid>
</Window>

额外小技巧：不同实例类型对应不同UI #

如果你的列表里有不同类型的实例，需要展示不同的UI，Caliburn.Micro的ViewLocator能自动帮你匹配ViewModel对应的View。比如你有TypeAViewModel和TypeBViewModel，分别创建TypeAView和TypeBView，然后在ItemTemplate里直接用ContentControl：

<DataTemplate>
    <ContentControl cal:View.Model="{Binding}"/>
</DataTemplate>

这样列表里每个实例都会自动渲染对应的View，超方便！

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