Alex Rivera | Logout

WPF Databinding stackpanel

Asked 2009-10-06T13:06:24.267
24

Im a beginner in WPF programming, coming from .NET 2.0 C#.

Im trying to make a horizontal StackPanel which should be filled with data from a table in a database. 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.

c# wpf data-binding stackpanel
Edit
Report

1 Answer

29

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).

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. Set the ItemTemplate of the control to a DataTemplate that will be used to display each item in the list.

Sample code:

In a Resources section (for example 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:

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

In your code behind:

UserList.ItemsSource = ... // here, an enumeration of your Users, fetched from your db
answered 2009-10-06T13:20:31.600

Your Answer