DataContextで複数のクラスを使用するには

Question

###前提・実現したいこと
クラスと関連付けられたComboBoxを複数配置したいと考え、以下のようなコードを書きました。
このコードでは省略してますが、コンボボックスで選択した項目に設定されている変数をBindingで表示や変更させることなどもできています。
(Personを選んだら年齢を表示。Bookを選んだら著作者表示など)

しかし、以下のコードではPersonAddのボタンの処理と、BookAddのボタンの処理を共存させられません。

###該当のソースコード

using System.Windows;

namespace WpfApplication2
{
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>

    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }
      
        private void PersonAddButton_Click(object sender, RoutedEventArgs e)
        {
            var List = this.DataContext as PersonList;
            List.PersonList_Items.Add(new Person { Name = "新しいPerson" });
        }

        private void BookAddButton_Click(object sender, RoutedEventArgs e)
        {
            var List = this.DataContext as BookList;
            List.BookList_Items.Add(new Book { Name = "新しいBook" });
        }
    }
}

using System.Collections.ObjectModel;

namespace WpfApplication2
{
    //Personのクラス
    public class Person
    {
        public string Name { get; set; }
        public int Age { get; set; }
    }

    //Bookのクラス
    public class Book
    {
        public string Name { get; set; }
        public string Author { get; set; }
    }

    //--------------------------------------------

    public class PersonList
    {
        public PersonList()
        {
            PersonList_Items = new ObservableCollection<Person> { };
        }
        public ObservableCollection<Person> PersonList_Items { get; set; }
        public Person PersonList_SelectedItem { get; set; }
    }

    public class BookList
    {
        public BookList()
        {
            BookList_Items = new ObservableCollection<Book> { };
        }
        public ObservableCollection<Book> BookList_Items { get; set; }
        public Book BookList_SelectedItem { get; set; }
    }
}

<Window x:Class="WpfApplication2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApplication2"
        mc:Ignorable="d"
        Title="MainWindow" Height="100" Width="270">

    <Window.DataContext>
        <local:PersonList/>
    </Window.DataContext>

    <Grid>
        <ComboBox x:Name="comboBox" Margin="10,10,132,0" VerticalAlignment="Top"
                   ItemsSource="{Binding Path=PersonList_Items}" DisplayMemberPath="Name" />
        <Button x:Name="PersonAddButton" Content="PersonAdd" Margin="10,37,177,0" VerticalAlignment="Top"
                 Click="PersonAddButton_Click"/>

        <ComboBox x:Name="comboBox1" Margin="135,10,7,0" VerticalAlignment="Top"
                   ItemsSource="{Binding Path=BooktList_Items}" DisplayMemberPath="Name" />
        <Button x:Name="BookAddButton" Content="BookAdd" Margin="135,37,52,0" VerticalAlignment="Top"
                 Click="BookAddButton_Click"/>
    </Grid>
</Window>

###問題点

<Window.DataContext>
        <local:PersonList/>
</Window.DataContext>

xamlのこの部分が、"PersonList"か"BookList"どちらかしか設定できません。
"PersonList"にするとBookAddを押したときに。"BookList"にするとPersonAddを押したときにエラーになります。

PersonListとBookListを同一のクラスの入れ子クラスにしたりもしましたが、上手くいきませんでした。

###質問
どのようにすれば２つの処理を共存させられますでしょうか？
ご教授のほどよろしくお願いいたします。

###補足
C#どころかプログラムも初心者なので、盛大な勘違いをしているかもしれませんがご容赦ください。

Answer 1

Windowと1対1で対応するViewModelクラスを作成してDataContextに設定するのが良いかと思います。
例えば以下のようなクラスです。

//新規に追加するクラス
    class MainWindowViewModel
    {
        public PersonList PersonList { get; private set; }
        public BookList BookList { get; private set; }
        
        public MainWindowViewModel()
        {
            PersonList = new PersonList();
            BookList = new BookList();
        }
    }

XAML側は以下のようになります。

//一部省略
    <Window.DataContext>
        <local:MainWindowViewModel/>
    </Window.DataContext>

    <Grid>
        <ComboBox x:Name="comboBox" Margin="10,10,132,0" VerticalAlignment="Top"
                   ItemsSource="{Binding Path=PersonList.PersonList_Items}" DisplayMemberPath="Name" />
        <Button x:Name="PersonAddButton" Content="PersonAdd" Margin="10,37,177,0" VerticalAlignment="Top"
                 Click="PersonAddButton_Click"/>

        <ComboBox x:Name="comboBox1" Margin="135,10,7,0" VerticalAlignment="Top"
                   ItemsSource="{Binding Path=BookList.BookList_Items}" DisplayMemberPath="Name" />
        <Button x:Name="BookAddButton" Content="BookAdd" Margin="135,37,52,0" VerticalAlignment="Top"
                 Click="BookAddButton_Click"/>
    </Grid>

クリックイベント処理は以下のようになります。
※ただ通常WPFではViewであるWindowのコードビハインドに余計なロジックが含まれるのは好ましくなく、
可能であればこのような処理はViewModel側で実装してXAMLでBindすることが多いです。

//一部省略
        private void PersonAddButton_Click(object sender, RoutedEventArgs e)
        {
            var vm = this.DataContext as MainWindowViewModel;
            vm.PersonList.PersonList_Items.Add(new Person { Name = "新しいPerson" });
        }

        private void BookAddButton_Click(object sender, RoutedEventArgs e)
        {
            var vm = this.DataContext as MainWindowViewModel;
            vm.BookList.BookList_Items.Add(new Book { Name = "新しいBook" });
        }

Comments

[退会済みユーザー]

ありがとうございます。
望んだとおりにできました。