WPF

C#WPFの道#21!ListBoxの書き方と使い方を解りやすく解説

ListBox(リストボックス)とは?

ListBoxとは,一覧表示から任意の行を選択できるコントロールです。選択は単一でも,複数でも可能です。

ListBoxの使い方

ListBox上のコントロールを追加して並べることもできますが,基本的には一覧表示に使うので,データバインディングをして使うことになると思います。データバインディングの方法は,ListViewやComboBoxと同様にItemTemplateやDataTemplateを使って実装します。

SelectionMode

ListViewやComboBoxと異なる点として,SelectionModeというプロパティがあるので,その部分を説明します。SelectionModeは,ListBoxの項目を単一で選択させるか,複数選択を可能とするかの設定です。設定は次の3パターンになります。

Single

1つの項目のみ選択可能となります。

Extended

キーボードのControlキーや,Shiftキーを押している最中にクリックをすると,複数選択が可能となります。使い方はExcelの行選択をするときと同じで,Controlを押しながらであれば,クリックした行を選択でき,Shiftを押している場合は,最初に選択した行から,その次に選択した行までを,まとめて選択することができます。

Multiple

キーボードのキーを押さなくても,複数選択が可能となります。クリックした行が選択状態になり,もう一度クリックすると,選択が解除されます。

サンプルコード

  • ItemTemplateとDataTemplateを使用して,ListBoxにデータバインディングするレイアウトを作成しています。
  • 1行分のレイアウトは画像と名前を表示するようにしています。
  • ListBoxの下に,ラジオボタンを3つ設置し,SelectionModeを選択できるようにしています。
  • RadioButtonの下にボタンを設置し,クリックイベントにブレークポイントを置くことで,ListBoxの選択状態のときの中身を確認するために使用します。
  • 一番下に,別のクラスとしてDtoクラスを作成しています。内容は画面のファイル名と名称の2項目です。このクラスのリストをデータバインドします。
  • PrivateフィールドにDtoのリストを生成しています。
  • Dtoのリストに3件のデータを作成しています。
  • ListBoxのItemsSourceにDtoのリストを設定しています。
  • ラジオボタンの初期値はSingleを選択しています。
  • ラジオボタンのチェック状態変更イベントに応じて,ListBoxのSelectionModeを変更しています。

実行結果

  • Singleモードのときは1行しか選択できません。
  • Extendedモードのときは,ControlかShiftを押して複数選択が可能です。

Multipleモードのときは,キーボードを押さずにクリックのみで,複数選択が可能です。選択されている行をクリックすると,選択が解除されます。

選択中のSelectionItemsの中身

  • 「check」ボタンのクリックイベントにブレークポイントを置きます。
  • 3行目を選択した後,1行目を選択した状態で「check」ボタンを押下します。
  • ブレークポイントでデバッグが停止されている状態で,ListBoxのSelectedItemとSelectionItemsの中身を確認してみましょう。
  • SelectedItemには3行目の値が入っています。最初に選択された行が格納されていることがわかります。
  • SelectionItemsの中身には3行目,1行目の順番でデータが格納されています。行を選択した順番で格納されていることがわかります。
WPFの道!

C#プログラマーのための正しい3層構造が分かる「C#アーキテクチャー解説動画」をここで公開しています。よかったら見てみてください。

 

参考図書

C#のWPFでPrismを使ってMVVMで実装する方法