[WPF] Listboxにバインドするクラスのプロパティに応じて表示するユーザーコントロールを切り替えたい

Question

お世話になっております。

行いたいこと
・PersonクラスのプロパティにはName(名前)とSex(性別)があります。
・ユーザーコントロールが2種類あります。
・ManUserControl (Person Sexプロパティが男のときに表示するUC)
・WomanUserControl (Person Sexプロパティが女のときに表示するUC)

ObservableCollection<Person> Personsに複数個追加します。
ListBoxにPersonsをバインドさせて、PersonのSexプロパティによって表示するユーザーコントロールを切り替えたいと思っています。
DataTriggerなど試してみましたが、コンパイルが通りませんでした。

方法をご存知の方、教示お願い致します。

コード

public class Person
{
    public string Name { get; set; }
    public string Sex { get; set; }

    public Person(string name, string sex)
    {
        Name = name;
        Sex = sex;
    }
}

public ObservableCollection<Person> Persons { get; set; } = new ObservableCollection<Person>()
{
    new Person("太郎", "男"),
    new Person("花子", "女"),
    new Person("洋子", "女"),
    new Person("次郎", "男")
};

<ListBox ItemsSource="{Binding Persons}">
    <ListBox.ItemTemplate>
        <DataTemplate>

            <!-- 性別が男の場合:MenUserControl、性別が女の場合:WormanUserControlを表示させたい-->

        </DataTemplate>
    </ListBox.ItemTemplate>

    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
             <StackPanel />
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
</ListBox>

環境
VS2017 Pro, WPF, .NET F/W 4.5.2

Answer 1

IYEMON018さんの回答と同じですが、DataTemplateSelectorで切替可能です。
DataTemplateを定義すればUserControlでも大丈夫かと思います。
かなり適当な感じですが、

public class PersonDataTemplateSelector : DataTemplateSelector
{
    public DataTemplate ManTemplate { get; set; }
    public DataTemplate WomanTemplate { get; set; }

    public override DataTemplate SelectTemplate(object item, DependencyObject container)
    {
        return (((Person)item).Sex == "男") ? ManTemplate : WomanTemplate;
    }
}

<ListBox ItemsSource="{Binding Persons}">
    <ListBox.Resources>
        <!--男用テンプレート-->
        <DataTemplate x:Key="Man" >
            <local:ManUserControl Width="100" Height="10"/>
        </DataTemplate>

        <!--女用テンプレート-->
        <DataTemplate x:Key="Woman" >
            <local:WomanUserControl  Width="100" Height="10"/>
        </DataTemplate>
    </ListBox.Resources>

    <ListBox.ItemTemplateSelector>
        <local:PersonDataTemplateSelector  ManTemplate="{StaticResource Man}"  WomanTemplate="{StaticResource Woman}" />
    </ListBox.ItemTemplateSelector>
</ListBox>

みたいな感じでしょうか。

Comments

[kawauso]

回答ありがとうございます。
提示いただいたコードで目的の動作をさせることができました。
勉強になりました。ありがとうございました。

Answer 2

DataTemplateSelector を使用すれば解決できます。
ただし、その場合はUserControlではなくDataTemplateを使用する必要があります。

Comments

[kawauso]

回答ありがとうございます。
今回はUserControlを利用できるebiryoさんの方法で実装しましたが、
次回はDataTemplateを利用する方法をきちんと調べてみたいと思います。
ありがとうございました。

Answer 3

真っ当な答えは他回答のように、DataTemplateSelectorでしょう。
ただ「この程度のことにC#コードを書きたくないなぁ」と思います。

DataTriggerなど試してみましたが、コンパイルが通りませんでした。

この方針で出来なくはありません。
切り替えるのはContentPresenterのContentTemplateです。
ContentPresenterが2重になるので（DataTemplateSelectorと）全く同じ意味というわけではありませんが、実用上は問題ないでしょう^^

<Window
  x:Class="Q103520.MainWindow"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:local="clr-namespace:Q103520"
  Width="800"
  Height="450"
  ThemeMode="System">
  <Grid>
    <ListBox ItemsSource="{Binding People}">
      <ListBox.Resources>
        <DataTemplate x:Key="ManTemplate">
          <!--<local:ManUserControl />-->
          <StackPanel>
            <TextBlock Text="Man" />
            <TextBlock Text="{Binding Name}" />
          </StackPanel>
        </DataTemplate>

        <DataTemplate x:Key="WomanTemplate">
          <!--<local:WomanUserControl />-->
          <StackPanel>
            <TextBlock Text="Woman" />
            <TextBlock Text="{Binding Name}" />
          </StackPanel>
        </DataTemplate>

        <DataTemplate x:Key="DefaultTemplate">
          <StackPanel>
            <TextBlock Text="Unknown" />
            <TextBlock Text="{Binding Name}" />
          </StackPanel>
        </DataTemplate>
      </ListBox.Resources>
      <ListBox.ItemTemplate>
        <DataTemplate>
          <ContentPresenter x:Name="cp" ContentTemplate="{StaticResource DefaultTemplate}" />
          <DataTemplate.Triggers>
            <DataTrigger Binding="{Binding Sex}" Value="男">
              <Setter TargetName="cp" Property="ContentTemplate" Value="{StaticResource ManTemplate}" />
            </DataTrigger>
            <DataTrigger Binding="{Binding Sex}" Value="女">
              <Setter TargetName="cp" Property="ContentTemplate" Value="{StaticResource WomanTemplate}" />
            </DataTrigger>
          </DataTemplate.Triggers>
        </DataTemplate>
      </ListBox.ItemTemplate>
    </ListBox>
  </Grid>
</Window>

using System.Collections.ObjectModel;
using System.Windows;

namespace Q103520;

public partial class MainWindow : Window
{
    public ObservableCollection<Person> People { get; } = [
        new Person("太郎", "男"),
        new Person("花子", "女"),
        new Person("洋子", "女"),
        new Person("次郎", "男"),
    ];

    public MainWindow()
    {
        InitializeComponent();
        DataContext = this;
    }
}

public record Person(string Name, string Sex);

絶対に男女しかないならいいですが、ほかの値が来る可能性がある場合は既定のContentTemplateを設定しておかないと、StackOverflowExceptionになるので注意が必要です。