前回、TreeViewコントロール(System.Windows.Forms名前空間)の基本的な使い方を紹介しました。
今回は、このTreeViewコントロールの表示をいろいろ変えてみます。
まずはデフォルト表示
TreeViewコントロールで、ノードを追加しただけで表示すると下記のような表示になります。
コードは下記のようになります。
private void Form1_Load(object sender, EventArgs e) { // コンピュータ1の子のノードを作成 TreeNode treeNodeHDD1 = new TreeNode("ハードディスク"); TreeNode treeNodeDVD1 = new TreeNode("DVD-ROMドライブ"); // 子のノードをまとめる配列を用意 TreeNode[] treeNodeSubFolder1 = { treeNodeHDD1, treeNodeDVD1 }; // 親のノードを作成(子のノードを入れる) TreeNode treeNodeComuter1 = new TreeNode("コンピュータ1", treeNodeSubFolder1); // コンピュータ2の子のノードを作成 TreeNode treeNodeSSD2 = new TreeNode("ソリッドステートドライブ"); TreeNode treeNodeHDD2 = new TreeNode("外付ハードディスク"); // 子のノードをまとめる配列を用意 TreeNode[] treeNodeSubFolder2 = { treeNodeSSD2, treeNodeHDD2 }; // 親のノードを作成(子のノードを入れる) TreeNode treeNodeComuter2 = new TreeNode("コンピュータ2", treeNodeSubFolder2); TreeNode[] treeNodeRoot = { treeNodeComuter1, treeNodeComuter2 }; // 最上位階層に対してまとめて項目(ノード)を追加 treeView1.Nodes.AddRange(treeNodeRoot); // 先頭のノードを展開する treeView1.TopNode.Expand(); }
ツリーの線を非表示にする
TreeViewコントロールのShowLinesプロパティ(bool型)をfalseにすると、ツリーの階層を繋ぐ線が表示されなくなります。
コードは下記のようになります。
private void Form1_Load(object sender, EventArgs e) { // コンピュータ1の子のノードを作成 TreeNode treeNodeHDD1 = new TreeNode("ハードディスク"); TreeNode treeNodeDVD1 = new TreeNode("DVD-ROMドライブ"); // 子のノードをまとめる配列を用意 TreeNode[] treeNodeSubFolder1 = { treeNodeHDD1, treeNodeDVD1 }; // 親のノードを作成(子のノードを入れる) TreeNode treeNodeComuter1 = new TreeNode("コンピュータ1", treeNodeSubFolder1); // コンピュータ2の子のノードを作成 TreeNode treeNodeSSD2 = new TreeNode("ソリッドステートドライブ"); TreeNode treeNodeHDD2 = new TreeNode("外付ハードディスク"); // 子のノードをまとめる配列を用意 TreeNode[] treeNodeSubFolder2 = { treeNodeSSD2, treeNodeHDD2 }; // 親のノードを作成(子のノードを入れる) TreeNode treeNodeComuter2 = new TreeNode("コンピュータ2", treeNodeSubFolder2); TreeNode[] treeNodeRoot = { treeNodeComuter1, treeNodeComuter2 }; // 最上位階層に対してまとめて項目(ノード)を追加 treeView1.Nodes.AddRange(treeNodeRoot); // 先頭のノードを展開する treeView1.TopNode.Expand(); // ツリービューの線を非表示にする treeView1.ShowLines = false; }
このコードを実行すると、下記のように表示されます。
ツリーの線の色を変える
TreeViewコントロールのLineColorプロパティ(System.Drawing.Color型)に任意の色を設定すると、ツリーの階層を繋ぐ線の色が変更されます。
コードは下記のようになります。
private void Form1_Load(object sender, EventArgs e) { // コンピュータ1の子のノードを作成 TreeNode treeNodeHDD1 = new TreeNode("ハードディスク"); TreeNode treeNodeDVD1 = new TreeNode("DVD-ROMドライブ"); // 子のノードをまとめる配列を用意 TreeNode[] treeNodeSubFolder1 = { treeNodeHDD1, treeNodeDVD1 }; // 親のノードを作成(子のノードを入れる) TreeNode treeNodeComuter1 = new TreeNode("コンピュータ1", treeNodeSubFolder1); // コンピュータ2の子のノードを作成 TreeNode treeNodeSSD2 = new TreeNode("ソリッドステートドライブ"); TreeNode treeNodeHDD2 = new TreeNode("外付ハードディスク"); // 子のノードをまとめる配列を用意 TreeNode[] treeNodeSubFolder2 = { treeNodeSSD2, treeNodeHDD2 }; // 親のノードを作成(子のノードを入れる) TreeNode treeNodeComuter2 = new TreeNode("コンピュータ2", treeNodeSubFolder2); TreeNode[] treeNodeRoot = { treeNodeComuter1, treeNodeComuter2 }; // 最上位階層に対してまとめて項目(ノード)を追加 treeView1.Nodes.AddRange(treeNodeRoot); // 先頭のノードを展開する treeView1.TopNode.Expand(); // ツリービューの線に赤色に設定する treeView1.LineColor = Color.Red; }
このコードを実行すると、下記のように表示されます。
わかりづらいかもしれませんが、ノードを繋ぐ線の色が赤になっています。
ツリーのルートの線の表示/非表示を切り替える
TreeViewコントロールのShowRootLinesプロパティ(bool型)に任意の色を設定すると、ツリーのルートを繋ぐ線の表示/非表示が切り替わります。
コードは下記のようになります。
private void Form1_Load(object sender, EventArgs e) { // コンピュータ1の子のノードを作成 TreeNode treeNodeHDD1 = new TreeNode("ハードディスク"); TreeNode treeNodeDVD1 = new TreeNode("DVD-ROMドライブ"); // 子のノードをまとめる配列を用意 TreeNode[] treeNodeSubFolder1 = { treeNodeHDD1, treeNodeDVD1 }; // 親のノードを作成(子のノードを入れる) TreeNode treeNodeComuter1 = new TreeNode("コンピュータ1", treeNodeSubFolder1); // コンピュータ2の子のノードを作成 TreeNode treeNodeSSD2 = new TreeNode("ソリッドステートドライブ"); TreeNode treeNodeHDD2 = new TreeNode("外付ハードディスク"); // 子のノードをまとめる配列を用意 TreeNode[] treeNodeSubFolder2 = { treeNodeSSD2, treeNodeHDD2 }; // 親のノードを作成(子のノードを入れる) TreeNode treeNodeComuter2 = new TreeNode("コンピュータ2", treeNodeSubFolder2); TreeNode[] treeNodeRoot = { treeNodeComuter1, treeNodeComuter2 }; // 最上位階層に対してまとめて項目(ノード)を追加 treeView1.Nodes.AddRange(treeNodeRoot); // 先頭のノードを展開する treeView1.TopNode.Expand(); // ツリーのルートを繋ぐ線を非表示にする treeView1.ShowRootLines = false; }
このコードを実行すると、下記のように表示されます。
デフォルトの表示などと比べるとわかりますが、全体的にノードの表示位置が左に寄るので、ノードの表示位置の変化などに注意して使ってください。