C# UserControlの作り方と使い方を初心者向けに解説｜Windowsフォームで再利用できる部品を作る方法

はじめに

C#でWindowsフォームアプリを作っていると、同じような入力欄やボタン、表示エリアを何度も作る場面があります。たとえば、名前を入力する欄、検索ボックス、設定画面の一部、一覧の操作ボタンなどです。

このような部品を毎回Formに直接配置していると、画面が増えるほどコードが重複し、修正も大変になります。そこで便利なのが、C#のUserControlです。

UserControlを使うと、Label、TextBox、Buttonなどの複数のコントロールをひとつの部品としてまとめ、Form上で再利用できます。この記事では、C# UserControlの作り方と使い方を、Windowsフォーム初心者にもわかるように順番に解説します。

1. C#のUserControlとは？初心者にもわかる基本

1-1. UserControlの役割とWindowsフォームで使うメリット

UserControlとは、Windowsフォームアプリで使える「自作の画面部品」です。

通常、FormにはLabelやTextBox、Buttonなどを直接配置します。しかし、複数のコントロールを組み合わせたまとまりを何度も使いたい場合は、UserControlとして作成しておくと便利です。

たとえば、次のような部品をUserControlとして作れます。

名前入力欄、検索ボックス、ログイン入力欄、商品情報表示エリア、設定項目の入力パネルなどです。

UserControlを使うメリットは、同じ部品を複数のFormで使い回せることです。また、部品ごとに処理をまとめられるため、Form側のコードがすっきりします。

1-2. Form・Panel・CustomControlとの違い

Formは、アプリの画面そのものです。ウィンドウとして表示され、メニューやボタンなどを配置できます。

Panelは、Form上でコントロールをまとめるための入れ物です。ただし、Panel自体は再利用するための部品として作るものではありません。

UserControlは、複数のコントロールと処理をまとめて、Formに配置できる自作部品です。

CustomControlは、既存のコントロールを継承したり、自分で描画処理を書いたりして作る、より高度な独自コントロールです。

初心者がまず使いやすいのはUserControlです。デザイナーで見た目を作れるため、Formを作る感覚に近いからです。

1-3. UserControlが向いている場面・向いていない場面

UserControlが向いているのは、複数の画面で同じ部品を使いたい場合です。

たとえば、検索条件入力欄を複数画面で使う場合や、同じ形式の入力エリアを何度も表示する場合に便利です。

一方で、単純なButtonひとつだけを少し変更したい場合は、UserControlにする必要がないこともあります。また、細かい描画を自分で制御したい場合は、CustomControlのほうが向いています。

UserControlは、既存のコントロールを組み合わせて作る部品だと考えるとわかりやすいです。

1-4. 再利用できる部品を作ると開発が楽になる理由

再利用できる部品を作ると、同じ処理を何度も書かなくて済みます。

たとえば、名前入力欄に「未入力ならエラーを表示する」という処理を入れたい場合、Formごとに同じコードを書くと修正漏れが起きやすくなります。

UserControlにまとめておけば、修正する場所は基本的にUserControl側だけです。デザイン変更や入力チェックの変更もまとめて行えるため、保守が楽になります。

2. C# UserControlを作る前に準備するもの

2-1. 必要な開発環境

C#でUserControlを作るには、Visual Studioを使うのが一般的です。

Windowsフォームアプリを作成できる環境であれば、UserControlも作成できます。Visual Studio Communityでも問題ありません。

必要なものは、Visual Studio、.NETまたは.NET Framework、Windowsフォームアプリのプロジェクトです。

2-2. Windowsフォームアプリのプロジェクトを作成する

まず、Visual StudioでWindowsフォームアプリのプロジェクトを作成します。

新しいプロジェクトの作成から「Windows フォーム アプリ」を選び、プロジェクト名を入力して作成します。

作成すると、Form1.csが用意されます。このFormに後ほどUserControlを配置して使います。

2-3. サンプルで作るUserControlの完成イメージ

この記事では、名前入力用のUserControlを例にします。

完成イメージは、Label、TextBox、Buttonを持つ部品です。

Labelには「名前」と表示し、TextBoxに名前を入力します。Buttonをクリックすると、入力内容を確認して、Form側に通知できるようにします。

2-4. 初心者が事前に理解しておきたいクラスとイベントの考え方

UserControlはクラスとして作成されます。

クラスとは、部品の設計図のようなものです。UserControlをFormに配置すると、そのクラスから作られた実体が画面に表示されます。

また、Buttonをクリックしたときの処理はイベントで書きます。イベントとは、「クリックされた」「文字が変更された」など、何かが起きたときに実行される処理のことです。

3. C# UserControlの作り方

3-1. プロジェクトにUserControlを追加する手順

Visual Studioのソリューションエクスプローラーで、プロジェクトを右クリックします。

「追加」から「ユーザー コントロール」を選択します。

名前は、たとえばNameInputControl.csのようにします。

追加すると、通常のFormと同じようにデザイナー画面が表示されます。ここにLabelやTextBox、Buttonを配置していきます。

3-2. デザイナーでLabel・TextBox・Buttonを配置する

UserControlのデザイナーを開き、ツールボックスからLabel、TextBox、Buttonを配置します。

LabelのTextプロパティを「名前」に変更します。

TextBoxは入力欄として使います。

ButtonのTextプロパティは「確認」や「入力完了」など、わかりやすい文字にします。

3-3. コントロール名をわかりやすく変更する

配置したコントロールは、Nameプロパティを変更しておくとコードが読みやすくなります。

たとえば、次のように名前を付けます。

LabelはlblTitle、TextBoxはtxtName、ButtonはbtnSubmitのようにします。

名前をわかりやすくしておくと、後からコードを見たときに、どの部品を操作しているのかすぐに理解できます。

3-4. UserControl内に処理を書く

Buttonをダブルクリックすると、クリックイベントの処理を書く場所が作られます。

たとえば、入力値を確認する処理は次のように書けます。

C#
private void btnSubmit_Click(object sender, EventArgs e)
{
    if (string.IsNullOrWhiteSpace(txtName.Text))
    {
        MessageBox.Show("名前を入力してください。");
        return;
    }

    MessageBox.Show("入力された名前：" + txtName.Text);
}

このように、UserControl内のTextBoxやButtonに対する処理は、UserControlのクラス内に書けます。

3-5. ビルドしてツールボックスに表示させる

UserControlを作成したら、一度プロジェクトをビルドします。

ビルドが成功すると、ツールボックスに作成したUserControlが表示されることがあります。

表示されない場合は、ツールボックスを右クリックして更新したり、プロジェクトを再ビルドしたりします。

4. 作成したUserControlをFormで使う方法

4-1. ツールボックスからFormに配置する

Formのデザイナーを開き、ツールボックスから作成したUserControlを選んでForm上に配置します。

配置すると、Label、TextBox、Buttonをまとめた部品として表示されます。

Form側では、通常のButtonやTextBoxと同じように位置やサイズを変更できます。

4-2. コードからUserControlを追加する

UserControlは、コードから追加することもできます。

C#
NameInputControl control = new NameInputControl();
control.Location = new Point(20, 20);
this.Controls.Add(control);

このようにインスタンスを作成し、FormのControlsに追加すると画面に表示されます。

複数個追加したい場合も、同じクラスから複数のUserControlを作成できます。

4-3. Dock・Anchorでサイズ変更に対応する

Formのサイズ変更に対応するには、DockやAnchorを設定します。

Dockを使うと、UserControlをFormの上、下、左、右、全体などに固定できます。

Anchorを使うと、Formの端に合わせて位置やサイズを維持できます。

たとえば、横幅をFormに合わせて広げたい場合は、Anchorを左、右、上に設定します。

4-4. 複数のフォームで同じUserControlを再利用する

UserControlの大きなメリットは、複数のFormで同じ部品を使えることです。

たとえば、Form1とForm2の両方にNameInputControlを配置できます。

UserControl側に入力チェックや表示処理を書いておけば、どのFormでも同じ動きをします。

4-5. 配置できない・表示されないときの確認ポイント

UserControlが表示されない場合は、まずビルドが成功しているか確認します。

次に、UserControlのコンストラクターでエラーが発生していないか確認します。

また、InitializeComponentが正しく呼ばれているか、デザイナーファイルを誤って編集していないかも確認しましょう。

5. UserControlにプロパティを追加して使いやすくする

5-1. 外部からTextBoxの値を取得・設定できるようにする

UserControl内のTextBoxは、通常そのままではForm側から直接扱わないほうがよいです。

代わりに、UserControlにpublicプロパティを作成して、値を取得・設定できるようにします。

C#
public string UserName
{
    get { return txtName.Text; }
    set { txtName.Text = value; }
}

このようにすると、Form側から次のように使えます。

C#
nameInputControl1.UserName = "山田太郎";
string name = nameInputControl1.UserName;

5-2. publicプロパティを作成する基本

publicプロパティは、外部からUserControlの値を操作するための窓口です。

内部のTextBoxを直接公開するのではなく、必要な値だけをプロパティとして公開するのが基本です。

これにより、UserControlの内部構造を変更しても、Form側への影響を少なくできます。

5-3. デザイナーのプロパティ欄に表示する方法

publicプロパティを作成すると、Visual Studioのプロパティ欄に表示される場合があります。

よりわかりやすくするには、Category属性やDescription属性を使います。

C#
[Category("表示")]
[Description("名前入力欄の値を取得または設定します。")]
public string UserName
{
    get { return txtName.Text; }
    set { txtName.Text = value; }
}

これにより、デザイナー上でもプロパティの意味がわかりやすくなります。

5-4. 初期値や表示テキストをForm側から変更する

Labelの表示文字も、プロパティで変更できるようにできます。

C#
public string TitleText
{
    get { return lblTitle.Text; }
    set { lblTitle.Text = value; }
}

Form側では次のように設定できます。

C#
nameInputControl1.TitleText = "お名前";

このようにしておくと、同じUserControlを「名前」「担当者名」「顧客名」など、用途に合わせて使い回せます。

5-5. プロパティ設計で注意すべきこと

プロパティを増やしすぎると、UserControlの使い方がわかりにくくなります。

Form側から変更する必要があるものだけをpublicにしましょう。

また、TextBoxそのものをpublicにするより、文字列や数値など必要な値だけを公開するほうが安全です。

6. UserControlでイベントを扱う方法

6-1. UserControl内のButtonクリックイベントを作る

UserControl内のButtonクリックイベントは、通常のButtonと同じように作れます。

C#
private void btnSubmit_Click(object sender, EventArgs e)
{
    MessageBox.Show("ボタンがクリックされました。");
}

ただし、この処理だけではForm側にクリックされたことを伝えにくい場合があります。

6-2. Form側にイベントを通知する方法

UserControl内で起きた操作をForm側に知らせたい場合は、カスタムイベントを使います。

たとえば、UserControlのButtonがクリックされたときに、Form側で処理を実行したい場合です。

6-3. カスタムイベントを定義する

UserControlにカスタムイベントを定義します。

C#
public event EventHandler SubmitClicked;

そして、Buttonクリック時にイベントを発生させます。

C#
private void btnSubmit_Click(object sender, EventArgs e)
{
    SubmitClicked?.Invoke(this, EventArgs.Empty);
}

これで、Form側からSubmitClickedイベントを受け取れるようになります。

6-4. EventHandlerを使った基本実装

Form側では、次のようにイベントを登録します。

C#
private void Form1_Load(object sender, EventArgs e)
{
    nameInputControl1.SubmitClicked += NameInputControl1_SubmitClicked;
}

private void NameInputControl1_SubmitClicked(object sender, EventArgs e)
{
    MessageBox.Show(nameInputControl1.UserName);
}

これにより、UserControl内のButtonがクリックされたときに、Form側の処理を実行できます。

6-5. 入力完了・検索実行・選択変更などの実用例

カスタムイベントは、さまざまな場面で使えます。

入力完了、検索ボタンのクリック、項目の選択変更、削除ボタンのクリックなどです。

UserControl側では「何が起きたか」を通知し、Form側では「それに対して何をするか」を決めるようにすると、役割分担がわかりやすくなります。

7. 実践サンプル：入力フォーム用UserControlを作る

7-1. 名前入力用UserControlの仕様を決める

ここでは、名前入力用UserControlを作ります。

仕様は次の通りです。

Labelに項目名を表示します。TextBoxに名前を入力します。Buttonをクリックすると入力チェックを行います。入力が空の場合はエラーメッセージを表示します。入力がある場合はForm側に通知します。

7-2. 入力値を検証する処理を追加する

UserControlに入力チェック用のメソッドを作ります。

C#
public bool ValidateInput()
{
    return !string.IsNullOrWhiteSpace(txtName.Text);
}

Buttonクリック時には、このメソッドを使って判定します。

C#
private void btnSubmit_Click(object sender, EventArgs e)
{
    if (!ValidateInput())
    {
        lblError.Text = "名前を入力してください。";
        return;
    }

    lblError.Text = "";
    SubmitClicked?.Invoke(this, EventArgs.Empty);
}

7-3. エラーメッセージを表示する

エラーメッセージを表示するには、UserControlにLabelを追加します。

LabelのNameをlblErrorにし、初期状態ではTextを空にします。

入力が空の場合だけ、lblError.Textにメッセージを設定します。

C#
lblError.Text = "名前を入力してください。";

入力が正しい場合は、エラーメッセージを消します。

C#
lblError.Text = "";

7-4. Form側で入力値を受け取る

Form側では、UserControlのUserNameプロパティを使って入力値を取得します。

C#
private void nameInputControl1_SubmitClicked(object sender, EventArgs e)
{
    string name = nameInputControl1.UserName;
    MessageBox.Show("入力された名前は " + name + " です。");
}

UserControl側は入力欄と検証を担当し、Form側は受け取った値を使って処理を行います。

7-5. 複数項目に応用する方法

同じ仕組みを使えば、メールアドレス入力、電話番号入力、住所入力などにも応用できます。

Labelの表示文字をプロパティで変更できるようにしておけば、ひとつのUserControlを複数の入力項目に使えます。

ただし、入力チェックの内容が大きく異なる場合は、別のUserControlとして作るほうが管理しやすいこともあります。

8. UserControlを再利用しやすくする設計のコツ

8-1. 1つのUserControlに詰め込みすぎない

UserControlには、関係のある部品だけをまとめるようにしましょう。

入力欄、一覧、ボタン、検索条件などをすべてひとつのUserControlに詰め込むと、かえって使いにくくなります。

1つのUserControlは、1つの役割に絞るのが基本です。

8-2. Form側とUserControl側の役割を分ける

UserControl側は、表示や入力、部品内の簡単な処理を担当します。

Form側は、画面全体の制御やデータ保存、画面遷移などを担当します。

UserControlから親Formの処理を直接呼び出しすぎると、再利用しにくくなります。イベントやプロパティを使って連携するのがおすすめです。

8-3. 名前付けルールを統一する

UserControl名や内部コントロール名は、わかりやすく統一しましょう。

たとえば、UserControlはNameInputControl、SearchBoxControlのように役割がわかる名前にします。

LabelはlblTitle、TextBoxはtxtName、ButtonはbtnSubmitのようにルールを決めておくと、コードが読みやすくなります。

8-4. 共通部品として別プロジェクトに分ける方法

複数のアプリで同じUserControlを使いたい場合は、クラスライブラリとして別プロジェクトに分ける方法があります。

共通部品用のプロジェクトを作り、そこにUserControlをまとめます。

別のWindowsフォームアプリから参照を追加すれば、同じUserControlを使えるようになります。

8-5. 保守しやすいコードにするポイント

保守しやすくするには、コードの役割を明確にすることが大切です。

UserControl内に業務処理を詰め込みすぎないようにしましょう。

また、publicにするプロパティやイベントは必要最小限にし、コメントや名前で意味が伝わるようにします。

9. C# UserControlでよくあるエラーと解決方法

9-1. ツールボックスにUserControlが表示されない

UserControlがツールボックスに表示されない場合は、まずプロジェクトをビルドしてください。

ビルドエラーがあると表示されないことがあります。

それでも表示されない場合は、ツールボックスを右クリックして「ツールボックスのリセット」や「アイテムの選択」を試します。

9-2. Formに配置するとエラーになる

Formに配置した瞬間にエラーになる場合は、UserControlのコンストラクターやLoadイベントで例外が発生している可能性があります。

デザイナー上でもコンストラクターは実行されることがあるため、ファイル読み込みやデータベース接続などを直接書くとエラーになる場合があります。

9-3. InitializeComponentでエラーが出る

InitializeComponentは、デザイナーで配置したコントロールを初期化する重要なメソッドです。

この部分でエラーが出る場合は、デザイナーファイルを誤って編集した可能性があります。

通常、Designer.csファイルは手動で大きく編集しないようにしましょう。

9-4. デザイナーが開けない

デザイナーが開けない場合は、UserControlのコードにコンパイルエラーがないか確認します。

また、コンストラクターで例外が出ていないかも重要です。

まずはビルドエラーを解消し、コンストラクター内にはInitializeComponent以外の重い処理を置かないようにしましょう。

9-5. プロパティやイベントがForm側から使えない

Form側からプロパティやイベントが使えない場合は、アクセス修飾子を確認します。

外部から使いたいプロパティやイベントにはpublicを付けます。

また、名前空間が違う場合は、usingの追加や参照設定も確認しましょう。

9-6. UserControlのサイズや表示が崩れる

UserControlの表示が崩れる場合は、Dock、Anchor、AutoSizeなどの設定を確認します。

Formのサイズ変更に合わせたい場合は、Anchorを正しく設定します。

また、UserControl内部のコントロールにもAnchorやDockを設定しておくと、サイズ変更に強くなります。

10. C# UserControlに関するよくある質問

10-1. UserControlとCustomControlはどちらを使うべき？

初心者はまずUserControlから使うのがおすすめです。

Label、TextBox、Buttonなどを組み合わせて部品を作りたい場合はUserControlが向いています。

一方で、描画を細かく制御したい場合や、既存コントロールの動作を大きく拡張したい場合はCustomControlを検討します。

10-2. UserControlはWPFでも使える？

WPFにもUserControlがあります。

ただし、WindowsフォームのUserControlとは仕組みや作り方が異なります。

この記事で解説しているのは、WindowsフォームアプリのUserControlです。

10-3. UserControlをDLL化して別アプリで使える？

UserControlは、クラスライブラリとして作成してDLL化できます。

共通部品用のプロジェクトを作成し、そこにUserControlを配置します。

別のWindowsフォームアプリからそのDLLを参照すれば、共通部品として利用できます。

10-4. UserControlから親Formの処理を呼び出してもよい？

技術的には可能ですが、あまりおすすめしません。

UserControlが特定のFormに依存すると、他のFormで再利用しにくくなります。

親Formに何かを伝えたい場合は、イベントを使うのが基本です。

10-5. 初心者はまず何を作ると理解しやすい？

初心者は、入力欄をまとめたUserControlから作ると理解しやすいです。

Label、TextBox、Buttonを配置し、TextBoxの値をプロパティで取得できるようにします。

さらにButtonクリックをイベントでForm側に通知できるようにすると、UserControlの基本がかなり理解できます。

まとめ

C#のUserControlは、Windowsフォームアプリで再利用できる部品を作るための便利な仕組みです。

Label、TextBox、Buttonなどを組み合わせてひとつの部品にまとめることで、複数のFormで同じ機能を使い回せます。

基本的な流れは、UserControlを追加し、デザイナーで部品を配置し、必要な処理をコードに書き、Formに配置して使うというものです。

さらに、publicプロパティを追加すればForm側から値を取得・設定でき、カスタムイベントを使えばUserControl内の操作をForm側に通知できます。

初心者はまず、名前入力用や検索ボックス用など、小さなUserControlから作ってみるのがおすすめです。小さな部品を作りながら、プロパティ、イベント、再利用の考え方を理解していくと、Windowsフォームアプリの開発がより効率的になります。