WPF Databinding stackpanel

Question

Soy un principiante en la programación de WPF, procedente de .NET 2.0 C#.

Im tratando de hacer un StackPanel horizontal que se debe completar con los datos de una tabla en una base de datos. El problema es que quiero que muestre una imagen con algún texto de la tabla a continuación y luego apilar esos dos elementos horizontalmente.

He aquí algunos pseudo-código para mostrar lo que quiero hacer:

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

simplemente no puedo imaginar oout cómo hacer esto.

Answer 1

Básicamente, desea utilizar un control capaz de mostrar una enumeración de objetos. El control capaz de esto es la clase ItemsControl y todos sus descendientes (Selector, ListBox, ListView, etc.).

Enlace la propiedad ItemsSource de este control a la lista de objetos que desee, aquí una lista de los usuarios que ha extraído de la base de datos. Establezca el ItemTemplate del control en un DataTemplate que se usará para mostrar cada elemento en la lista.

Código de ejemplo:

En un Resources sección (por ejemplo Window.Resources):

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

En su Window/Page/UserControl:

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

En su código detrás:

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

Answer 2

respuesta de Julien es correcta para su descripción por escrito, sin embargo, mirando a su XAML, parece que busca algo como lo siguiente:

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

Es imprescindible disponer de un ItemsControl (o alguna derivación de) a enlazar su fuente a. Luego puede cambiar la orientación configurando su panel de elementos (que creo que es VirtualizingStackPanel con orientación vertical por defecto), así que simplemente configúrelo en un VirtualizingStackPanel con orientación horizontal. A continuación, puede establecer ItemsTemplate para cada uno de sus elementos en el diseño que desee (una imagen apilada sobre el límite de texto de su base de datos).