ListBoxをMVVMで実装したい

Question

表題の通り、MVVMで構築しているアプリケーションでListBoxを使おうと思っています。
ネットサンプルは一応見たのですが、理解できなかったこともあり自分なりの組み方で動作を確認しました。

コードは以下になります。

//View
    <Grid>
        <ListBox HorizontalAlignment="Left" Margin="80,65,0,126" Width="361" ItemsSource="{Binding list}" SelectedItem="{Binding selectList}" SelectedIndex="{Binding selectIndex}" SelectionMode="Extended" SelectionChanged="ListBox_SelectionChanged"/>
        <Button Content="Button1" HorizontalAlignment="Left" Height="19" Margin="80,263,0,37" Width="70" Click="Button_Click"/>
        <Button Content="Button2" HorizontalAlignment="Left" Height="19" Margin="371,263,0,37" Width="70" Click="Button_Click2"/>
    </Grid>

//コードビハインド
    public partial class MainWindow : Window
    {
        private MainViewModel viewmodel;
        public MainWindow()
        {
            InitializeComponent();
            viewmodel = new MainViewModel();
            this.DataContext = viewmodel;
        }

        //データ追加イベント
        private void Button_Click(object sender, RoutedEventArgs e)
        {
            viewmodel.list.Add("abc1");
            viewmodel.list.Add("abc2");
            viewmodel.list.Add("abc3");
            viewmodel.list.Add("abc4");
            viewmodel.list.Add("abc5");
            viewmodel.list.Add("abc6");
            viewmodel.list.Add("abc7");
            viewmodel.list.Add("abc8");
            viewmodel.list.Add("abc9");
            viewmodel.list.Add("abc10");
            viewmodel.list.Add("abc11");
            viewmodel.list.Add("abc12");
            viewmodel.selectList.Clear();  //初期化状態だと"abc1"にselect状態になってしまうのでリセットさせる
        }

        //abc7をselect状態にするためのクリックイベント
        private void Button_Click2(object sender, RoutedEventArgs e)
        {
            for (int i = 0; i < viewmodel.list.Count; i++)
            {
                string s1 = viewmodel.list[i];

                if (s1 == "abc7")
                {
                    viewmodel.selectList.Add(s1);
                    viewmodel.selectIndex = i;
                }
            }
        }

        //select状態が変化した時にVMとデータを同期させるためのイベント
        private void ListBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            ListBox listBox = (ListBox)sender;
            viewmodel.selectList.Clear();

            for (int i = 0; i < listBox.SelectedItems.Count; i++)
            {
                string s1 = listBox.SelectedItems[i].ToString();
                viewmodel.selectList.Add(s1);
            }
        }
    }

//ViewModel
    public class MainViewModel : INotifyPropertyChanged
    {

        private ObservableCollection<string> listVal = new ObservableCollection<string>();
        public ObservableCollection<string> list
        {
            get { return listVal; }
            set
            {
                listVal = value;
                NotifyPropertyChanged("list");
            }
        }



        private int selectIndexVal = new int();
        public int selectIndex
        {
            get { return selectIndexVal; }
            set
            {
                selectIndexVal = value;
                NotifyPropertyChanged("selectIndex");
            }
        }


        private ObservableCollection<string> selectListVal = new ObservableCollection<string>();
        public ObservableCollection<string> selectList
        {
            get { return selectListVal; }
            set
            {
                selectListVal = value;
                NotifyPropertyChanged("selectList");
            }
        }


        public event PropertyChangedEventHandler PropertyChanged;
        private void NotifyPropertyChanged(String info)
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(info));
            }
        }
    }

まだテスト段階でのコードなので大雑把ですが、実アプリケーションでは
・ListBoxの中身を全て取得する
・現在選択されているListの中身を全て取得する
・ListBoxの中身を動的に更新する(中身を全ていれかえる、選択するリストを指定する、の２つしかしません)
の３点ができれば問題ないです。

(そのため現コードでは、ListBoxに「SelectionMode="Extended"」と指定してるにも関わらず、選択されている中身のインデックス位置を取得できないですが、実アプリケーションでは問題ないです)

ただネットのサンプルは他の方法でやっているように見えたので、このコードが間違えた実装になっているのではないかと思っています。
コードは自分が管理するのでできれば複雑なコードではないように修正できればと思うのですが、ご助言いただけないでしょうか。よろしくお願いいたします。

Comments

[len_souko]

回答とは全く関係ないけど、VS2015以降を使ってるなら　NotifyPropertyChanged("selectList");　は　NotifyPropertyChanged(nameof(selectList));にした方が間違いが起きにくいですよ。あと、publicの名前は先頭を大文字で、privateを小文字にするのがC#のコーディング規約ですが、正直privateように名前を考える手間が省けるのでお勧めです（実際に使いたい名前をpublicプロパティに付けて、保持するprivateフィールドは先頭を小文字にするだけで解決）

[siksmtt]

len_souko様　ご助言ありがとうございます。VS2017なので nameof は問題なさそうです。質問を投稿する前に大文字小文字のミスで上手く動かないことがあったので、そういうのはとても有難いですね...。そのコーディング規約は初耳でした！たしかにすごく便利な命名規則ですね、いつも悩んでました...。ありがとうございます！

Answer 1

MVVMではコードビハインドを使わないのが原則です。
絶対に使ってはダメって訳ではありませんが、ほぼいじる必要がありません。

WPF自体は大分理解されているようですので、以下のページを読んでみてください。
Livetの中の人が書かれています。
MVVMパターンの常識
一度読んだぐらいでは、なかなか理解できないと思いますが、MVVMのバイブルとでも呼ぶべき名著です。
一通り読んで、サンプルを動かして、もう一度読むと理解が深まります。
私も何度も繰り返して読んで、最近ようやく理解できました。

Comments

[siksmtt]

hihijiji様　ご助言ありがとうございます。コードビハインドについてはICommandを実装すれば薄くできるかと思っている(もしかしたら勘違い？)ので、慣れたら実装してみようと思います。また参考ページまでご丁寧にありがとうございます！MVVM自体始めたばかりなので、ぜひ読んでみようと思います。

[hihijiji]

読んだらわかると思いますが、INotifyPropertyChangedもICommandも自分で実装するのではなく、あるものを使ったほうが良いです。
それこそ無駄に複雑にしたいなら都度自分で実装しても良いかもしれませんが

[siksmtt]

hihijiji様　ありがとうございます。参考にさせていただきます！

[siksmtt]

hihijiji様　度々申し訳ありません。もしお時間あればご回答いただけますと幸いです。今コードビハインドに書いているイベント処理をMVVM化しようと思い、ListBox_SelectionChangedを試しにMVVM化しているところなのですが、selectListプロパティのsetterに処理を書いてもsetterに入りません(setterにブレークポイントを置いていますが引っかからないということです)。状態遷移系のイベントはできないのでしょうか？

[hihijiji]

ListBox の SelectedItems は DependencyProperty ではないので、直接 Bind できません。
色々方法はありますが、わたしは
https://github.com/xceedsoftware/wpftoolkit/wiki/CheckListBox
を使ってます。
サンプル
https://teratail.com/questions/121682

[siksmtt]

hihijiji様　丁寧にURLまでありがとうございます！ChackListBoxに変えてみましたがやはり想定通りの動きにはなりませんでした...。別途質問として建てようと思います。アドバイス等ありがとうございました！