WinFormsで季節を表示するチュートリアル
今回は、ボタンを押すと ListBox に「春・夏・秋・冬」を表示するシンプルなアプリを作ります。
このサンプルでは、今学習している次の内容を使います。
- 配列
- foreach
- ボタンのクリックイベント
- 画面にデータを表示する方法
コンソールで学んだ内容を、WinFormsの画面アプリに移す練習としてちょうどよい題材です。
作るもの
ボタンを押すと、ListBox に季節が表示されるアプリです。
動作イメージ
最初は何も表示されていません。
季節を表示 ボタンを押すと、次の4つが表示されます。
- 春
- 夏
- 秋
- 冬
このチュートリアルで学べること
このサンプルでは、次の流れを体験できます。
ボタンを押すと処理が動く
WinFormsでは、ボタンを押したときの処理をイベントとして書きます。
配列の中身を1つずつ取り出す
string[] seasons という配列を作り、foreach で順番に取り出します。
画面に表示する
コンソールでは Console.WriteLine でしたが、WinFormsでは ListBox.Items.Add を使います。
プロジェクトを作成する
Visual Studioで新しいプロジェクトを作成します。
プロジェクト名
Day6WinFormsSample
作成する種類
Windows Forms アプリ
画面に配置する部品
フォームに次の2つを配置します。
Button
- 名前：showSeasonsButton
- Text：季節を表示
ListBox
- 名前：seasonList
画面のイメージ
たとえば、次のような配置でよいです。
- 上にボタン
- 下にListBox
細かい見た目は後回しで大丈夫です。
まずは「押したら表示される」ことを目標にします。
ボタンのイベントを作る
ボタンをダブルクリックしてください。
すると、Form1.cs に次のようなメソッドが自動で作られます。
private void showSeasonsButton_Click(object sender, EventArgs e)
{
}このメソッドは、ボタンが押されたときに実行される処理を書く場所です。
完成コード
Form1.cs を次のようにします。
using System;
using System.Windows.Forms;
namespace Day6WinFormsSample
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}
private void showSeasonsButton_Click(object sender, EventArgs e)
{
seasonList.Items.Clear();
string[] seasons = { "春", "夏", "秋", "冬" };
foreach (string season in seasons)
{
seasonList.Items.Add(season);
}
}
}
}コードの見方
ここからは、1つずつ見ていきます。
コンストラクタ
public Form1()
{
InitializeComponent();
}この部分は、画面を作るための準備です。
WinFormsでは、まずこの形があると考えて大丈夫です。
ボタンが押されたときの処理
private void showSeasonsButton_Click(object sender, EventArgs e)これは、showSeasonsButton を押したときの処理です。
名前は長く見えますが、意味は単純です。
- showSeasonsButton
- どのボタンか
- Click
- 何が起きたか
つまり、
「季節を表示するボタンがクリックされたときの処理」
です。
ListBoxをいったん空にする
seasonList.Items.Clear();ボタンを何回も押すと、同じ内容が何度も追加されてしまいます。
それを防ぐために、最初に ListBox の中身を空にしています。
配列を作る
string[] seasons = { "春", "夏", "秋", "冬" };これは文字列の配列です。
今回は4つの季節をまとめて管理しています。
- 1つ目：春
- 2つ目：夏
- 3つ目：秋
- 4つ目：冬
foreachで1つずつ取り出す
foreach (string season in seasons)
{
seasonList.Items.Add(season);
}ここが今回の中心です。
foreach は、配列の中身を1つずつ順番に取り出します。
今回の流れはこうです。
- 春 を取り出す
- 夏 を取り出す
- 秋 を取り出す
- 冬 を取り出す
取り出したものは season という変数に入ります。
画面に追加する
seasonList.Items.Add(season);これは ListBox に1行追加する処理です。
コンソールで学んだ
Console.WriteLine(season);に近い役割です。
違うのは、表示する場所だけです。
- コンソールなら Console.WriteLine
- WinFormsなら ListBox.Items.Add
です。
実行するとどうなるか
実行して 季節を表示 ボタンを押すと、ListBox に次の4行が表示されます。
春
夏
秋
冬このサンプルの大事な考え方
この教材で特に大切なのは、
コンソールでやっていたことが、そのまま画面アプリでも使える
という点です。
たとえば、今までこう書いていたとします。
string[] seasons = { "春", "夏", "秋", "冬" };
foreach (string season in seasons)
{
Console.WriteLine(season);
}WinFormsでは、最後の表示部分が変わるだけです。
string[] seasons = { "春", "夏", "秋", "冬" };
foreach (string season in seasons)
{
seasonList.Items.Add(season);
}つまり、
配列や foreach の知識はそのまま使える
ということです。
練習課題
次のように少し変えてみると、理解が深まります。
課題1 動物に変える
string[] animals = { "犬", "猫", "うさぎ", "きつね" };に変えて、ボタンの文字も 動物を表示 にしてみましょう。
課題2 果物に変える
string[] fruits = { "りんご", "みかん", "ぶどう", "バナナ" };として表示してみましょう。
課題3 ボタンを2回押しても増えない理由を確認する
seasonList.Items.Clear();を消すとどうなるか試してみましょう。
同じ内容が追加されることが確認できます。
そのあとで Clear() を戻すと、なぜ必要かが分かります。
まとめ
今回は、WinFormsで季節を表示するシンプルなアプリを作りました。
このサンプルで学べることは次の4つです。
- ボタンを押すとイベントが動く
- 配列に複数のデータを入れられる
- foreach で1つずつ取り出せる
- ListBox.Items.Add で画面に表示できる
コンソールで学んだ内容を、そのまま画面アプリに広げる第一歩としてとてもよい練習です。