WinForms タイマーアプリ チュートリアル(初学者向け技術資料)

1. はじめに

このチュートリアルでは、Windows Forms(WinForms) を使って、簡単な タイマーアプリ を作成します。
2つの方法 を紹介します:

  1. コードでUIを作る方法(プログラムで作成)
  2. ツールボックスを使う方法(GUIエディタで作成)

このアプリは、1秒ごとにラベルのカウントが増えるシンプルなものです。
WinForms の基本を学ぶのに最適な入門編です。


2. 必要な環境

Visual Studio(2022 以上を推奨)
.NET(.NET Core または .NET Framework)

まだインストールしていない場合は、Visual Studio の公式サイト からダウンロードしてください。


3.(コードで作る方法)WinForms タイマーアプリ

1. Visual Studio で新しいプロジェクトを作成

  • 「C# Windows フォームアプリ(.NET Framework)」を選択
  • 「次へ」をクリック
  • プロジェクト名:TimerSample
  • 「作成」をクリック

2. Form1.cs を開き、以下のコードを入力

using System;
using System.Drawing;
using System.Windows.Forms;

namespace TimerSample
{
    public class Form1 : Form
    {
        private Label timeLabel;
        private Button startButton;
        private Timer timer;
        private int count = 0;

        public Form1()
        {
            Text = "簡単なタイマー";
            Size = new Size(300, 200);

            timeLabel = new Label
            {
                Text = "カウント: 0",
                AutoSize = true,
                Location = new Point(30, 30)
            };

            startButton = new Button
            {
                Text = "スタート",
                Location = new Point(30, 70)
            };
            startButton.Click += StartButton_Click;

            timer = new Timer
            {
                Interval = 1000
            };
            timer.Tick += Timer_Tick;

            Controls.Add(timeLabel);
            Controls.Add(startButton);
        }

        private void StartButton_Click(object sender, EventArgs e)
        {
            timer.Start();
            startButton.Enabled = false;
        }

        private void Timer_Tick(object sender, EventArgs e)
        {
            count++;
            timeLabel.Text = $"カウント: {count}";
        }
    }
}

Label(ラベル) → 1秒ごとにカウントが増える
Button(ボタン) → クリックでタイマー開始
Timer(タイマー) → 1秒ごとに Tick イベント発生


4.(ツールボックスを使う方法)GUIエディタを使ったタイマーアプリ

1. フォームデザイナーで作成

  1. Form1.cs のデザイナーを開く
  2. ツールボックスから以下のコントロールをドラッグ&ドロップ
  • Label(名前: timeLabel
  • Button(名前: startButton
  • Timer(名前: timer
  1. プロパティ設定
  • Label
    • Text = "カウント: 0"
    • AutoSize = true
    • Location = (30, 30)
  • Button
    • Text = "スタート"
    • Location = (30, 70)
  • Timer
    • Interval = 1000

2. イベントハンドラを追加

  1. startButton を選択
  2. プロパティウィンドウの「イベント(雷アイコン)」を開く
  3. Click イベントを startButton_Click に設定
  4. timer を選択
  5. プロパティウィンドウで Tick イベントを timer_Tick に設定

3. Form1.cs に以下のコードを追加

private int count = 0;

private void startButton_Click(object sender, EventArgs e)
{
    timer.Start();
    startButton.Enabled = false;
}

private void timer_Tick(object sender, EventArgs e)
{
    count++;
    timeLabel.Text = $"カウント: {count}";
}

ツールボックスを使えば、コードをほとんど書かずに同じアプリを作れる!


5. カスタマイズ例

1️⃣ 「停止」ボタンを追加

「ストップ」ボタンを追加し、タイマーを停止できるようにする。

ツールボックスでボタンを追加する場合:

  1. ツールボックスから Button を追加
  2. Text"ストップ"
  3. Name"stopButton"
  4. Location(120, 70)

Form1.cs に以下のコードを追加

private void stopButton_Click(object sender, EventArgs e)
{
    timer.Stop();
    startButton.Enabled = true;
}

イベントを関連付ける

  1. stopButton をクリック
  2. イベントプロパティで ClickstopButton_Click を設定

6. 実行方法

どちらの方法(コード / ツールボックス)でも、プログラムを実行できます。

  1. Visual Studio でプロジェクトを開く
  2. F5キーを押してプログラムを実行
  3. 「スタート」ボタンをクリック
  4. 1秒ごとにカウントが増加

7. まとめ

🎯 本チュートリアルで学んだこと

  • WinForms の基本構造
  • コードで UI を作成する方法
  • ツールボックスを使って GUI エディタで作成する方法
  • イベントハンドラの設定
  • カスタマイズの方法(停止ボタンの追加など)

2つの方法をマスターすれば、より効率的に WinForms アプリを作れる!
ストップウォッチやカウントダウンタイマーへの応用も可能!


📌 シンプルに、コードベースの作成方法とツールボックスを使った作成方法を併記しました!