WPF 数据绑定堆栈面板

Question

我是 WPF 编程的初学者，来自 .NET 2.0 C#。

我正在尝试制作一个水平的 StackPanel，它应该填充数据库中表中的数据。问题是我希望它显示带有下表中的一些文本的图像，然后水平堆叠这两个项目。

这是一些伪代码来显示我想要做的事情：

<StackPanel Orientation="horizontal" ItemsSource="{Binding Path=myTable}">
    <StackPanel>
        <Image Source="User.png"/>
        <Label HorizontalAlignment="Center" Content="{Binding Path=UserName}"></Label>
    </StackPanel>
</StackPanel>

我根本不知道如何做到这一点。

Answer 1

Julien 的答案对于您的书面描述来说是正确的，但是，查看您的 XAML，您似乎正在寻找类似以下内容的内容：

<DataTemplate x:Key="UserDataTemplate">
    <StackPanel>
        <Image Source="User.png"/>
        <Label HorizontalAlignment="Center" Content="{Binding Path=UserName}" />
    </StackPanel>
</DataTemplate>

<ItemsControl x:Name="UserList" ItemTemplate="{StaticResource UserDataTemplate}" >
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <VirtualizingStackPanel Orientation="Horizontal"/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
</ItemsControl>

您肯定需要一个 ItemsControl （或其某些派生）来将您的源绑定到。然后，您可以通过设置其项目面板（我认为默认情况下是具有垂直方向的 VirtualizingStackPanel）来更改方向，因此只需将其设置为具有水平方向的 VirtualizingStackPanel 即可。然后，您可以将每个项目的 ItemsTemplate 设置为您想要的布局（堆叠在从数据库绑定的文本顶部的图像）。

Answer 2

基本上，您希望使用能够显示对象枚举的控件。能够实现此功能的控件是类 ItemsControl 及其所有后代（Selector、ListBox、ListView 等） ）。

将此控件的 ItemsSource 属性绑定到所需的对象列表，此处是您从数据库获取的用户列表。将控件的 ItemTemplate 设置为将用于显示列表中每个项目的 DataTemplate。

示例代码：

在 Resources 部分（例如 Window.Resources）：

<DataTemplate x:Key="UserDataTemplate">
  <StackPanel Orientation="Horizontal">
    <Image Source="User.png"/>
    <Label HorizontalAlignment="Center" Content="{Binding Path=UserName}" />
  </StackPanel>
</DataTemplate>

在您的 Window/Page/< code>UserControl：

<ItemsControl x:Name="UserList" ItemTemplate="{StaticResource UserDataTemplate}" />

在您的代码后面：

UserList.ItemsSource = ... // here, an enumeration of your Users, fetched from your db