web-dev-qa-db-ja.com

WPFデータバインディングスタックパネル

.NET 2.0 C#からのWPFプログラミングの初心者です。

データベース内のテーブルからのデータで埋められるべき水平方向のStackPanelを作成しようとしています。問題は、下の表のテキストを含む画像を表示してから、これら2つのアイテムを水平方向にスタックすることです。

これが私がやりたいことを表示するためのいくつかの擬似コードです:

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

私は単にこれを行う方法を理解することはできません。

18
Kaare

ジュリアンの答えはあなたの書面による説明には正しいですが、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を希望のレイアウト(データベースからバインドされたテキストの上にスタックされた画像)に設定できます。

30
Scott

基本的には、オブジェクトの列挙を表示できるコントロールを使用する必要があります。これが可能なコントロールは、クラスItemsControlとそのすべての子孫(SelectorListBoxListViewなど)です。

このコントロールのItemsSourceプロパティを、必要なオブジェクトのリスト(ここでは、データベースからフェッチしたユーザーのリスト)にバインドします。コントロールのItemTemplateDataTemplateに設定します。これは、リスト内の各項目を表示するために使用されます。

サンプルコード:

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
26