C# 学習8日目 -学習一区切り- Windowsフォームアプリで作成
学習一区切りです。学習という名目では今日が最後です。
※追加補習1日と習作作成1日も含めることにしましたので、
合計10日目で全体のC#学習最終日 ということに変更しました。
普段の学習は、C#の解説本でやっていて、新規プロジェクト作成時に
空のプロジェクト作成から、手打ちでソースコードを入力後、
作り変える感じでやっています。
最後の学習として、今回は、その本にはない
新規プロジェクト作成時にWindowsフォームアプリを選択して、、
Windowsフォームアプリの作成 → フォーム デザイナーでの
コントロール配置でどうなるのか…?
試してみます。
Windowsフォームアプリで新規作成
プロジェクト名を付ける
適当に
フレームワークを選択
長期的サポート版の 6.0 を選択
開いた!
おおおー デザイナー画面が出てる
しかし部品を置く元のコントロール一覧がない・・・
表示メニュー から ツールボックスを選択
ツールボックスをピン止め
左側にツールボックスが追加された。
しかし、ぴょこっと出ては引っ込むので、ピン止めして固定する。
これで、コントロールをどんどん配置できる
今回この形で並べます。TextBox × 1個、Label × 2個、Button × 3個。
これで何をしたいかというと・・・
これでしたいこと
- TextBoxの入力値をButton3をクリックした際に取得してモーダルで表示する
- Button1とButton2をそれぞれクリックしたときに何が押されたかをラベルに表示する
- 例えば、Button1とButton2のいずれかのボタンをクリックしたら…
- Label1に操作したボタンの表示されている文字の値 を表示する
- Label2に操作したボタンのnameの値 を表示する
- 例えば、Button1とButton2のいずれかのボタンをクリックしたら…
ボタンText(表示文字)を変える
ボタン名(Name)とボタン表示文字(Text)が自動で割り振られていて、
どちらも同じなので、同じだと、、、一見 違いがよくわからないので、
各ボタンを選択した状態で右下にあるプロパティ一覧で、
ボタンのプロパティのTextの値を変えていく。
Button1をボタン1に、Button2をボタン2に、
ついでに、Button3を入力値を取得して表示にした。
するとボタンの表示がこうなる。
Labelの表示はダサいけど、あくまで学習中の実験演習なので、このままにしておく。
ボタンのTextプロパティは変更したが、Nameプロパティは元の英語名ままです。
ボタンイベント用のソースコードを自動挿入
Buttonの3つをそれぞれダブルクリックすると自動でコードが追加される。
デザイナに戻るときは、上部のタブを切り替えるか、
右のソリューションエクスプローラーのForm1.csファイルを右クリックし、
デザイナーの表示を選択すると、デザイナー画面に戻る。
ボタン選択→自動でコード画面→デザイナー画面に戻る を繰り返してこれを行う。
するとソースコードはこうなる。
(選んでダブルクリックしたボタンの順番でソースコード側の順番も変わる。
コードを番号順にきれいになるように入れ替えても問題ないが、コードを一部消したままだと、
デザイナー画面で全部見えなくなる場合があるので注意)
namespace WinFormsAppSample1
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}
private void button1_Click(object sender, EventArgs e)
{
}
private void button2_Click(object sender, EventArgs e)
{
}
private void button3_Click(object sender, EventArgs e)
{
}
}
}
ここにそれぞれイベント処理を記述する
button1がクリックされたときは、button1_Clickの中に処理を記述する…
button2がクリックされたときは、button2_Clickの中に処理を記述する…
button3がクリックされたときは、button3_Clickの中に処理を記述する…
という形になる。
senderはobject型になるが、これは操作元のコントロールオブジェクトが来るそうです。
イベント処理を記述したら… ?!
これだけで良いようです。5行追加!
namespace WinFormsAppSample1
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}
private void button1_Click(object sender, EventArgs e)
{
label1.Text = ((Button)sender).Text;
label2.Text = ((Button)sender).Name;
}
private void button2_Click(object sender, EventArgs e)
{
label1.Text = ((Button)sender).Text;
label2.Text = ((Button)sender).Name;
}
private void button3_Click(object sender, EventArgs e)
{
MessageBox.Show(textBox1.Text, "テキストボックスの入力値");
}
}
}
実行結果
デバッグなしで開始▷ をクリック
テキストボックスに文字を入力し、入力値を取得して表示ボタン(button3)をクリック
button3_Clickの処理が実行されるはず。
(右下に出ています)
成功!
モーダルを閉じます。
ボタン1ボタン(button1)をクリック
button1_Clickの処理が実行されるはず。
- 上のLabel1に操作したボタンの表示されている文字の値 を表示する
- 下のLabel2に操作したボタンのnameの値 を表示する
無事成功!
ボタン2ボタン(button1)をクリック
- 上のLabel1に操作したボタンの表示されている文字の値 を表示する
- 下のLabel2に操作したボタンのnameの値 を表示する
こちらも無事成功!
ここまでのまとめ
これだけで、ボタンのイベント処理、どのボタンを押したかで処理を分ける、
テキストボックスの値の取得、モーダル(MessageBox)の表示、が出来ました。
senderで操作元のオブジェクトが来るので各値の取得も楽。
Windowsフォームアプリの作成、めちゃくちゃ簡単!
スクリーンショット画像の通り、もっと早くC#始めればよかった!
気になったことが…
ボタン1と2で異なる処理ならよいのですが、今回のような、
どちらのボタンでも共通の処理をする場合だと、
上記コードのように同じ記述が二つできてしまう。
ボタンがたくさんあるようなときは変更があった場合に面倒だしバグも生み出しやすそう。
共通処理のひとつの方法
デザイナー画面でボタン1のボタンを選択。
右下のプロパティ一覧のイベントの(感電しそうな)アイコンをクリック。
Clikというプロパティを探します。(見つけにくいときはA-Zアイコンをクリック)
Clickプロパティの値button1_Clickをbuttons_Clickに変更(適宜なんでもよい)。
ソースコードをみると、
private void buttons_Click(object sender, EventArgs e)
{
}
が自動で追加されました。
同様にデザイナー画面でボタン2のボタンを選択し、
ボタン2のClickプロパティの値button1_Clickをbuttons_Clickに変更。
つまりボタン1と同じプロパティ値にします(ここ大事)。
次のようにソースコードを修正しました。
namespace WinFormsAppSample1
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}
private void button1_Click(object sender, EventArgs e)
{
// label1.Text = ((Button)sender).Text;
// label2.Text = ((Button)sender).Name;
}
private void button2_Click(object sender, EventArgs e)
{
// label1.Text = ((Button)sender).Text;
// label2.Text = ((Button)sender).Name;
}
private void button3_Click(object sender, EventArgs e)
{
MessageBox.Show(textBox1.Text, "テキストボックスの入力値");
}
private void buttons_Click(object sender, EventArgs e)
{
label1.Text = ((Button)sender).Text;
label2.Text = ((Button)sender).Name;
}
}
}
button1_Clickとbutton2_Clickは必要ないので、中身をコメントアウト。
button1_Clickとbutton2_Click自体を削除すると、前述のようにデザイナー側が全部
消えてしまうようです。
buttons_Clickの中に先ほどの共通の処理をコピペで持ってきて書きます。
実行結果
無事成功!
スクリーンショットは先の実行結果と同じなので省略
まとめ
手書きでコードを書く部分は、5行から、
修正後、なんと、3行ですむ形になりました。
buttons_Clickの中には操作元のオブジェクトがsenderで来るので、
ボタンの各にアクセスできます。
後は、共通の処理を書いて、
ボタンごとの個別の処理は、switch~やif~などで分岐すると良さげです。
Windowsフォームアプリの作成を試してみるつもりで、
試してみて、作成がめちゃくちゃ簡単でした。
以上で C#の学習終了です 最後に学習の感想
ことあと、Unityの学習をやる予定で、その前段階としC#のWindowsプログラミングを
やりました。
最後は、Windowsプログラミングでしかやれないことをやってみました。
非常に有意義でした。
今回、7日間までの学習に使った「やさしいC#」という参考本も
画像オブジェクトを扱うサンプルが多く、打ち込み甲斐のある良い本でした。
また、Ticketnoteで学習しながら、まとめる、アウトプットする という
習慣が身について使って良かったと思いました。
Windowsフォームアプリの作成 もっとやりたいのですが、
それでは先に進まなくなるので、次は、Unityの学習を頑張ります。