Стеклопанель WPF для привязки данных - PullRequest
Новая
       18

Стеклопанель WPF для привязки данных

18 голосов
/ 06 октября 2009

Я новичок в программировании 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>

Я просто не могу понять, как это сделать.

Ответы [ 2 ]

30 голосов
/ 06 октября 2009

Ответ Жюльена верен для вашего письменного описания, однако, глядя на ваш 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 с горизонтальной ориентацией. Затем вы можете установить для ItemTemplate для каждого из ваших элементов макет по вашему желанию (изображение, накладываемое поверх текста, связанного с вашей базой данных).

25 голосов
/ 06 октября 2009

По сути, вы хотите использовать элемент управления, способный отображать перечисление объектов. Элемент управления, способный на это, - класс 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 / UserControl: 

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

В вашем коде позади: 

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