WinForms学習:配列とfor文でカードを5枚並べる
WinFormsでカードを5枚並べてみよう
いま皆さんは
- 配列
- for文
- Windows Forms
を学びました。
ここで一度、配列がどれだけ便利なのかを
画面を使って体験してみましょう。
今日作るのはこれです。
[カード] [カード] [カード] [カード] [カード]
カードを 横に5枚並べるアプリです。
配列を使わない場合
もし配列を使わなかったら、こうなります。
PictureBox p1 = new PictureBox();
PictureBox p2 = new PictureBox();
PictureBox p3 = new PictureBox();
PictureBox p4 = new PictureBox();
PictureBox p5 = new PictureBox();
まだ5枚だから書けますが、
カード100枚
だったらどうでしょう?
現実的ではありません。
配列を使う
そこで配列を使います。
PictureBox[] cards = new PictureBox[5];

これは
PictureBoxを5個まとめて管理する箱
という意味です。
ここで大事なことがあります。
配列を作っただけでは、PictureBoxはまだ存在しません。
つまり「箱(入れ物)」を作っただけです。
そのため、あとで new PictureBox() で1つずつ作って入れていきます。
完全サンプルコード(コメント付き)
// カードを作って並べるメソッド
void CreateCards()
{
// 左側の余白
int startX = 20;
// カードの間隔
int space = 120;
// 配列の数だけ繰り返す
for (int i = 0; i < cards.Length; i++)
{
// PictureBoxを作る
cards[i] = new PictureBox();
// 横幅
cards[i].Width = 100;
// 高さ
cards[i].Height = 150;
// 横位置
cards[i].Left = startX + i * space;
// 縦位置
cards[i].Top = 30;
// 画像表示方法
cards[i].SizeMode = PictureBoxSizeMode.StretchImage;
// 画像を読み込む
cards[i].Image = Image.FromFile("card.png");
// 画面に追加
this.Controls.Add(cards[i]);
}
}
配列のイメージ
このコードでは、PictureBoxは次のように管理されています。
cards[0]
cards[1]
cards[2]
cards[3]
cards[4]
つまり
PictureBoxが5個入った棚
です。
for文でまとめて作る
次の部分が重要です。
for (int i = 0; i < cards.Length; i++)
これは
0
1
2
3
4
と順番に処理を繰り返します。
そのため
cards[0]
cards[1]
cards[2]
cards[3]
cards[4]
が自動的に作られていきます。
横に並ぶ理由
ここも重要です。
cards[i].Left = startX + i * space;
計算するとこうなります。
0番 → 20
1番 → 140
2番 → 260
3番 → 380
4番 → 500
つまり
20 + (番号 × 間隔)
で位置を決めています。
これによって
カードがきれいに等間隔に並びます。
今日のポイント
今日覚えてほしいことはこれです。
配列とは
同じ種類のものを
まとめて管理する仕組み
そして
配列 + for文
は
プログラミングの最も基本的な組み合わせ
の1つです。
少し考えてみましょう
もしカードを
10枚
並べたいなら、どこを変えればよいでしょう?
ヒントはここです。
PictureBox[] cards = new PictureBox[5];
そして
cards.Length
です。



ディスカッション
コメント一覧
まだ、コメントがありません