简体   繁体   English

WPF数据绑定stackpanel

[英]WPF Databinding stackpanel

Im a beginner in WPF programming, coming from .NET 2.0 C#. 我是WPF编程的初学者,来自.NET 2.0 C#。

Im trying to make a horizontal StackPanel which should be filled with data from a table in a database. 我试图制作一个水平的StackPanel ,它应该填充数据库中的表中的数据。 The problem is that I want it to display an image with some text from the table below and then stack those two items horizontally. 问题是我希望它显示带有下表中某些文本的图像,然后水平堆叠这两个项目。

Here's some pseudo-code to display what I want to do: 这里有一些伪代码来显示我想要做的事情:

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

I simply cannot figure oout how to do this. 我根本无法想象如何做到这一点。

Julien's answer is correct for your written description, however, looking at your XAML, it appears you are looking for something like the following: 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>

You definately need an ItemsControl (or some derivation of) to bind your source to. 你肯定需要一个ItemsControl(或一些派生)来绑定你的源。 Then you can change the the orientation by setting it's items panel (which I believe is a VirtualizingStackPanel with Vertical orientation by default) so just set it to a VirtualizingStackPanel with Horizontal Orientation. 然后你可以通过设置它的项目面板来改变方向(我相信默认情况下是一个具有垂直方向的VirtualizingStackPanel),所以只需将其设置为具有水平方向的VirtualizingStackPanel。 Then you can set the ItemsTemplate for each of your items to the layout you desire (an image stacked on top of text bound from your database). 然后,您可以将每个项目的ItemsTemplate设置为您想要的布局(图像堆叠在从数据库绑定的文本顶部)。

Basically, you want to use a control capable of displaying an enumeration of objects. 基本上,您希望使用能够显示对象枚举的控件。 The control capable of this is the class ItemsControl and all of its descendants ( Selector , ListBox , ListView , etc). 能够控制它的是ItemsControl类及其所有后代( SelectorListBoxListView等)。

Bind the ItemsSource property of this control to a list of objects you want, here a list of users you've fetched from the database. 将此控件的ItemsSource属性绑定到所需的对象列表,此处是您从数据库中提取的用户列表。 Set the ItemTemplate of the control to a DataTemplate that will be used to display each item in the list. 将控件的ItemTemplate设置为DataTemplate ,该DataTemplate将用于显示列表中的每个项目。

Sample code: 示例代码:

In a Resources section (for example Window.Resources ): Resources部分(例如Window.Resources ):

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

In your Window / Page / UserControl : 在您的Window / Page / UserControl

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

In your code behind: 在你的代码背后:

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

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM