Windwos フォームアプリケーションで「ツールバー」を使うと直感的な操作を行えるので便利です。
今回は、コーディングのみでToolStripコントロールを使ってツールバーを作る方法を紹介します。
Windows フォームにコーディングでコントロールを追加する
Windows フォームにコード上でコントロールを追加するときには、ちょっとした「お作法」があります。
それは、コントロールをフォームに追加(配置して表示)するときに、「レイアウトを一時停止」して
フォームに追加が終わったら「レイアウトを再開」するようにすることです。
(レイアウトを一時停止しなくてもフォームに追加はできますが、数が増えるとちょっとみっともない見え方になったりします)
コードとしては、下記のようなコードを追加することになります。
// レイアウトを一時停止 this.SuspendLayout(); // // ここにフォーム上に追加するコントロールを用意して配置する // // レイアウトを再開 this.ResumeLayout(false); this.PerformLayout();
これは通常のフォームデザイナで追加・配置をしているコントロールはすべてInitializeComponent()が用意してくれます。
InitializeComponent()の実装個所は”<フォーム名>.Designer.cs”になります。
このInitializeComponent()の最初と最後に上記と同じようなコードがあります。
ツールバーの元(ToolStrip)を追加する
フォームに、ToolStrip(System.Windows.Forms名前空間)クラスオブジェクトを追加してツールバーを表示させます。
private System.Windows.Forms.ToolStrip toolStrip1; // ツールバーの土台となるオブジェクト
このオブジェクトを先ほどのコードと組み合わせて、ツールバーを表示させます。
private void frmMain_Load(object sender, EventArgs e) { // フォームをロードした時の処理 // レイアウトを一時停止 this.SuspendLayout(); // ToolStripクラスを生成します this.toolStrip1 = new ToolStrip(); // フォームにToolStrip(ツールバー)を追加 this.Controls.Add(this.toolStrip1); // レイアウトを再開 this.ResumeLayout(false); this.PerformLayout(); }
これだけで、「ツールバー」は表示されます。
表示されますが、何もない土台だけのツールバーですので何もできません。
ここにいろいろなものを乗せてツールバーにします。
ツールバーにコントロールを追加する前に
これからツールバーにボタンなどのコントロールを追加していくことになるのですが、このToolStrip自身も「コントロール」です。
このコントロールにさらにいろいろなコントロールを乗せていくと、ゆくゆくはフォームにコントロールを乗せるときと同じような問題が発生します。
これを防ぐために、ツールバーにコントロールを乗せる前後にもフォームと同じような「レイアウトの一時停止」を行います。
private void frmMain_Load(object sender, EventArgs e) { // フォームをロードした時の処理 // レイアウトを一時停止 this.SuspendLayout(); // ToolStripクラスを生成します this.toolStrip1 = new ToolStrip(); // ツールバーのレイアウトを一時停止 this.toolStrip1.SuspendLayout(); // フォームにToolStrip(ツールバー)を追加 this.Controls.Add(this.toolStrip1); // ツールバーのレイアウトを再開 this.toolStrip1.ResumeLayout(false); this.toolStrip1.PerformLayout(); // レイアウトを再開 this.ResumeLayout(false); this.PerformLayout(); }
ツールバーにボタンを追加する
ツールバーにボタンを追加する場合、通常のボタン(System.Windows.Forms.Buttonクラス)ではなく
System.Windows.Forms.ToolStripButtonクラスのボタンを追加します。
private System.Windows.Forms.ToolStripButton toolStripButton1; // ツールバーのボタン1
ツールバーのボタンでよく見る画像だけのボタンを追加するには、下記のようなコードになります。
Textプロパティに文字列を追加しているのは、こうしておくと「ツールチップ」としてこの文字列を表示させることができます。
private void frmMain_Load(object sender, EventArgs e) { // フォームをロードした時の処理 // レイアウトを一時停止 this.SuspendLayout(); // ToolStripクラスを生成します this.toolStrip1 = new ToolStrip(); // ツールバーのレイアウトを一時停止 this.toolStrip1.SuspendLayout(); // // ツールバーの中に追加するコントロールを生成する // ここから ---> // ToolStripButtonを作成 this.toolStripButton1 = new ToolStripButton(); // テキストを設定 this.toolStripButton1.Text = "開く(&O)"; // 画像を設定 this.toolStripButton1.Image = Image.FromFile(@"btn_open.gif"); // 画像だけを表示するボタンにします this.toolStripButton1.DisplayStyle = ToolStripItemDisplayStyle.Image; // ToolStripにボタンを追加します this.toolStrip1.Items.Add(this.toolStripButton1); // フォームにToolStrip(ツールバー)を追加 this.Controls.Add(this.toolStrip1); // ---> ここまで // ツールバーの中に追加するコントロールを生成する // // ツールバーのレイアウトを再開 this.toolStrip1.ResumeLayout(false); this.toolStrip1.PerformLayout(); // レイアウトを再開 this.ResumeLayout(false); this.PerformLayout(); }