C#の画面作成を基礎から解説｜初心者でもできるWindowsフォーム・WPF・GUI開発入門

はじめに

C#で画面作成を学びたいと思っても、「Windowsフォーム」「WPF」「GUI」「XAML」など、最初から多くの用語が出てきて迷いやすいものです。特に、これまでコンソールアプリしか作ったことがない初心者にとって、ボタンやテキストボックスを配置して動かす画面付きアプリは少し難しく感じるかもしれません。

しかし、C#の画面作成は基本を順番に理解すれば、初心者でも十分に始められます。Visual Studioを使えば、部品をドラッグ＆ドロップで配置できるため、最初の一歩はそれほど難しくありません。

この記事では、C#の画面作成について、WindowsフォームやWPFの違い、開発環境の準備、基本的なコントロールの使い方、イベント処理、入力フォームやログイン画面の作成例まで、基礎からわかりやすく解説します。

1. C#の画面作成とは？初心者が最初に知るべき基礎知識

C#の画面作成とは、ユーザーがボタンを押したり、文字を入力したり、一覧を確認したりできるアプリケーションの画面を作ることです。一般的に、このような画面付きアプリはGUIアプリケーションと呼ばれます。

GUIとは「Graphical User Interface」の略で、文字だけで操作するのではなく、ボタン、メニュー、入力欄、チェックボックス、一覧表などを使って直感的に操作できる画面のことです。

C#はWindows向けのデスクトップアプリ開発に強く、業務システム、社内ツール、管理画面、データ入力アプリなど、さまざまな画面付きアプリを作成できます。

1-1. C#で作れる画面・GUIアプリの種類

C#で作成できる画面付きアプリには、いくつかの種類があります。

代表的なものは、Windowsフォーム、WPF、WinUI、.NET MAUI、ASP.NET CoreによるWebアプリなどです。

Windowsフォームは、昔から使われているWindowsデスクトップアプリ開発の技術です。画面部品を配置しやすく、初心者でも学びやすい特徴があります。

WPFは、より柔軟で見た目の自由度が高いデスクトップアプリを作るための技術です。XAMLというマークアップ言語を使って画面を定義します。

WinUIは、比較的新しいWindowsアプリ開発向けのUI技術です。モダンなWindowsアプリを作りたい場合に選択肢になります。

.NET MAUIは、Windowsだけでなく、macOS、Android、iOSなど複数の環境で動くアプリを作るための技術です。

このように、C#の画面作成といっても複数の方法がありますが、初心者が最初に学ぶならWindowsフォームまたはWPFから始めるのが一般的です。

1-2. コンソールアプリと画面付きアプリの違い

C#を学び始めると、最初にコンソールアプリを作ることが多いです。コンソールアプリは、黒い画面に文字を表示したり、キーボードから入力を受け取ったりする形式のアプリです。

一方、画面付きアプリは、ボタン、ラベル、テキストボックス、一覧表などを画面上に表示し、ユーザーがマウスやキーボードで操作します。

コンソールアプリでは、処理は基本的に上から順番に実行されます。しかし、画面付きアプリでは「ボタンが押されたとき」「文字が入力されたとき」「画面が表示されたとき」といったユーザー操作をきっかけに処理が動きます。

このような仕組みをイベント駆動と呼びます。C#の画面作成では、このイベント処理の考え方を理解することが重要です。

1-3. C#の画面作成に必要な開発環境

C#で画面作成を始めるには、基本的にVisual Studioを使うのがおすすめです。Visual Studioには、画面を作るためのデザイナー機能、コード補完、デバッグ機能、プロジェクトテンプレートなどが用意されています。

初心者の場合は、Visual Studio Communityを利用するとよいでしょう。個人開発や学習用途で使いやすく、WindowsフォームやWPFのプロジェクトも作成できます。

必要なものは主に次の通りです。

C#の画面作成に必要なのは、Windowsパソコン、Visual Studio、.NETの開発環境です。Visual Studioをインストールするときは、「.NET デスクトップ開発」のワークロードを選択します。

このワークロードを入れておくことで、WindowsフォームアプリやWPFアプリを作成できるようになります。

1-4. 初心者がつまずきやすいポイント

C#の画面作成で初心者がつまずきやすいポイントはいくつかあります。

まず、画面に配置したボタンやテキストボックスと、C#のコードがどのようにつながっているのかがわかりにくい点です。画面部品には名前があり、その名前を使ってコードから値を取得したり、表示内容を変更したりします。

次に、イベント処理の考え方です。コンソールアプリのように上から順番に動くのではなく、ユーザーの操作に応じて処理が実行されるため、最初は流れをつかみにくいことがあります。

また、WindowsフォームとWPFの違いで迷う人も多いです。どちらもC#で画面を作れますが、画面の作り方や設計の考え方が異なります。

最初から完璧に理解しようとせず、まずはボタンを押したら文字が表示される、入力した値を取得する、といった小さなアプリから作るのが効果的です。

2. C#の画面作成で使われる主な技術

C#の画面作成では、目的に応じて使用する技術を選びます。特に初心者が知っておきたいのは、WindowsフォームとWPFです。

どちらもWindows向けのデスクトップアプリを作るための技術ですが、作り方や得意分野が異なります。

2-1. Windowsフォームとは

Windowsフォームは、C#でWindowsデスクトップアプリを作るための代表的な技術です。Visual Studioの画面デザイナーを使い、ボタンやラベル、テキストボックスなどをドラッグ＆ドロップで配置できます。

Windowsフォームの大きな特徴は、初心者でも画面作成の流れを理解しやすいことです。配置したボタンをダブルクリックすると、そのボタンが押されたときの処理を書く場所が自動で作成されます。

例えば、ボタンを押したときにメッセージを表示する処理は、次のように書けます。

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

Windowsフォームは、社内ツールや簡単な業務アプリ、学習用アプリの作成に向いています。画面作成の基本を学ぶには非常に扱いやすい技術です。

2-2. WPFとは

WPFは、Windows Presentation Foundationの略で、C#で高機能なWindowsデスクトップアプリを作るための技術です。

WPFでは、画面レイアウトをXAMLという言語で記述します。XAMLを使うことで、画面の構造とプログラムの処理を分けて管理しやすくなります。

例えば、ボタンを1つ表示するXAMLは次のようになります。

XML
<Button Content="クリック" Width="100" Height="30" />

WPFは、デザインの自由度が高く、データバインディングやMVVMパターンと相性がよい点が特徴です。業務システムや複雑な画面を持つアプリでは、WPFが使われることも多くあります。

ただし、Windowsフォームに比べると、XAML、データバインディング、MVVMなど覚えることが多いため、完全な初心者には少し難しく感じる場合があります。

2-3. WinUI・.NET MAUIとの違い

WinUIは、モダンなWindowsアプリを作るためのUI技術です。新しいWindowsの見た目に近いアプリを作りたい場合に選択肢になります。

一方、.NET MAUIは、1つのC#コードをもとに、Windows、macOS、Android、iOSなど複数の環境で動くアプリを作るための技術です。クロスプラットフォーム開発に向いています。

WindowsフォームとWPFは、主にWindowsデスクトップアプリ向けです。WinUIもWindows向けですが、より新しいUI開発に対応しています。.NET MAUIは、Windowsだけでなくスマートフォンアプリも視野に入れる場合に使われます。

初心者がC#の画面作成を学ぶ目的であれば、まずはWindowsフォームまたはWPFから始めるのがわかりやすいです。スマートフォンアプリや複数OS対応を目指す場合は、基礎を学んだあとに.NET MAUIへ進むと理解しやすくなります。

2-4. 初心者はWindowsフォームとWPFのどちらを選ぶべきか

初心者がC#の画面作成を学ぶなら、最初はWindowsフォームがおすすめです。理由は、画面部品を配置しやすく、イベント処理を直感的に理解しやすいからです。

Windowsフォームでは、ボタンを配置してダブルクリックすれば、クリック時の処理を書く場所が作られます。画面とコードの関係が見えやすいため、C#でGUIアプリを作る感覚をつかみやすいです。

一方、将来的に実務で使える設計や、見た目の自由度が高いアプリを作りたい場合は、WPFも学ぶ価値があります。WPFでは、XAML、データバインディング、MVVMなど、より本格的な画面開発に必要な考え方を学べます。

おすすめの学習順序は、まずWindowsフォームで基本を理解し、その後WPFに進む流れです。

3. WindowsフォームでC#の画面作成を始める方法

Windowsフォームは、C#の画面作成を始めるうえで最も取り組みやすい方法の一つです。ここでは、プロジェクトの作成から、ボタンやテキストボックスの配置、イベント処理の基本まで解説します。

3-1. Windowsフォームプロジェクトの作成手順

Visual StudioでWindowsフォームプロジェクトを作成する手順は次の通りです。

まず、Visual Studioを起動し、「新しいプロジェクトの作成」を選択します。検索欄に「Windows Forms」と入力し、「Windows フォーム アプリ」を選びます。

次に、プロジェクト名を入力します。例えば「SampleWinFormsApp」のような名前を付けます。保存場所を選び、使用する.NETのバージョンを選択して作成します。

プロジェクトが作成されると、フォームデザイナーが表示されます。このフォームがアプリの最初の画面になります。

画面左側または右側にあるツールボックスから、Button、Label、TextBoxなどのコントロールをフォーム上に配置できます。

3-2. ボタン・ラベル・テキストボックスの配置方法

Windowsフォームでは、ツールボックスから使いたい部品を選び、フォーム上にドラッグ＆ドロップして配置します。

Labelは文字を表示するための部品です。画面上に説明文や項目名を表示するときに使います。

TextBoxは、ユーザーが文字を入力するための部品です。名前、メールアドレス、数値などを入力してもらうときに使います。

Buttonは、ユーザーがクリックして処理を実行するための部品です。登録、検索、計算、クリアなどの操作に使います。

配置したコントロールは、プロパティウィンドウで名前や表示文字を変更できます。例えば、ボタンの表示文字はTextプロパティ、コードから使う名前はNameプロパティで設定します。

ボタンのNameを「buttonRegister」、Textを「登録」にすると、コード上でも意味がわかりやすくなります。

3-3. イベント処理の基本

画面付きアプリでは、ユーザーの操作をきっかけに処理を実行します。この仕組みをイベント処理といいます。

例えば、ボタンがクリックされたときに実行される処理はClickイベントに書きます。

Windowsフォームでは、フォーム上のボタンをダブルクリックすると、自動的にClickイベントのメソッドが作成されます。

C#
private void buttonRegister_Click(object sender, EventArgs e)
{
    MessageBox.Show("登録ボタンが押されました");
}

このコードは、buttonRegisterというボタンがクリックされたときに、メッセージボックスを表示する処理です。

イベント処理では、テキストボックスに入力された値を取得したり、ラベルの文字を変更したり、計算結果を表示したりできます。

3-4. 簡単な入力フォームを作成するサンプル

ここでは、名前を入力してボタンを押すと、メッセージを表示する簡単なフォームを作ってみます。

フォームに次のコントロールを配置します。

Labelには「名前を入力してください」と表示します。TextBoxのNameを「textBoxName」にします。ButtonのNameを「buttonShow」、Textを「表示」にします。

ボタンのClickイベントに次のコードを書きます。

C#
private void buttonShow_Click(object sender, EventArgs e)
{
    string name = textBoxName.Text;

    if (string.IsNullOrWhiteSpace(name))
    {
        MessageBox.Show("名前を入力してください");
        return;
    }

    MessageBox.Show(name + "さん、こんにちは！");
}

このサンプルでは、まずTextBoxに入力された文字を取得しています。入力が空の場合はエラーメッセージを表示し、入力されている場合は名前を使ったメッセージを表示します。

このように、C#の画面作成では、コントロールから値を取得し、条件分岐を行い、結果を画面に返すという流れが基本になります。

4. WPFでC#の画面作成を始める方法

WPFは、Windowsフォームよりも柔軟な画面作成ができる技術です。XAMLを使って画面を定義し、C#で処理を書きます。

最初はWindowsフォームより難しく感じるかもしれませんが、画面と処理を分けて管理しやすく、実務向けのアプリ開発にも役立ちます。

4-1. WPFプロジェクトの作成手順

Visual StudioでWPFプロジェクトを作成するには、「新しいプロジェクトの作成」から「WPF アプリケーション」を選択します。

プロジェクト名を入力し、保存場所と.NETのバージョンを選択して作成します。

プロジェクトが作成されると、MainWindow.xamlというファイルが表示されます。このファイルに画面レイアウトを記述します。

また、MainWindow.xaml.csというファイルもあります。これはコードビハインドと呼ばれ、ボタンがクリックされたときの処理など、C#のコードを書きます。

WPFでは、画面をXAML、処理をC#で分けて書くのが基本です。

4-2. XAMLによる画面レイアウトの基本

XAMLは、画面の構造を記述するためのマークアップ言語です。HTMLに少し似た形式で、ボタンやテキストボックスなどのコントロールを配置できます。

例えば、簡単な画面は次のように書けます。

XML
<Window x:Class="SampleWpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="サンプル" Height="200" Width="300">
    <StackPanel Margin="20">
        <TextBlock Text="名前を入力してください" />
        <TextBox x:Name="TextBoxName" Margin="0,10,0,10" />
        <Button Content="表示" Click="Button_Click" />
    </StackPanel>
</Window>

StackPanelは、コントロールを縦または横に並べるためのレイアウト用コントロールです。TextBlockは文字表示、TextBoxは入力欄、Buttonはボタンを表します。

WPFでは、Grid、StackPanel、DockPanelなどのレイアウト用コントロールを使って画面を構成します。

4-3. コードビハインドとイベント処理

WPFでも、Windowsフォームと同じようにイベント処理を書くことができます。

先ほどのXAMLでは、ButtonにClick="Button_Click"と指定しています。これは、ボタンがクリックされたときにButton_Clickメソッドを実行するという意味です。

MainWindow.xaml.csに次のようなコードを書きます。

C#
private void Button_Click(object sender, RoutedEventArgs e)
{
    string name = TextBoxName.Text;

    if (string.IsNullOrWhiteSpace(name))
    {
        MessageBox.Show("名前を入力してください");
        return;
    }

    MessageBox.Show($"{name}さん、こんにちは！");
}

このように、WPFでも画面上のコントロールから値を取得し、処理を実行できます。

ただし、WPFではコードビハインドに処理を書きすぎると、画面とロジックが混ざって保守しにくくなることがあります。そのため、慣れてきたらデータバインディングやMVVMパターンを学ぶとよいでしょう。

4-4. データバインディングの基礎

WPFの大きな特徴の一つがデータバインディングです。データバインディングとは、画面の表示内容とC#のデータを結びつける仕組みです。

例えば、画面に表示する文字をC#のプロパティと連動させることができます。プロパティの値が変わると、画面の表示も変わるようにできます。

簡単な例として、TextBlockのTextにデータをバインドする場合は次のように書きます。

XML
<TextBlock Text="{Binding UserName}" />

この場合、DataContextに設定されたオブジェクトのUserNameプロパティがTextBlockに表示されます。

データバインディングを使うと、画面部品に直接値を設定するコードを減らせます。特に一覧表示や入力フォームでは、WPFらしい効率的な画面作成ができます。

5. C#の画面作成で覚えておきたい基本要素

C#で画面作成を行うには、コントロール、レイアウト、画面遷移、入力チェック、データ表示といった基本要素を理解する必要があります。

これらを押さえることで、簡単なツールだけでなく、実務に近いアプリも作れるようになります。

5-1. コントロールの種類と使い方

コントロールとは、画面上に配置する部品のことです。C#の画面作成では、目的に応じてさまざまなコントロールを使います。

代表的なコントロールには、Label、TextBox、Button、CheckBox、RadioButton、ComboBox、ListBox、DataGridView、DataGridなどがあります。

LabelやTextBlockは、文字を表示するために使います。TextBoxは文字入力、Buttonは処理の実行、CheckBoxは複数選択、RadioButtonは一つだけ選択する項目に使います。

ComboBoxは選択肢の中から一つを選ばせるときに便利です。ListBoxは複数の項目を一覧表示するときに使います。

WindowsフォームではDataGridView、WPFではDataGridを使うことで、表形式のデータを表示できます。顧客一覧、商品一覧、売上一覧など、業務アプリではよく使われるコントロールです。

5-2. レイアウト設計の考え方

画面作成では、ただコントロールを配置するだけでなく、使いやすいレイアウトを考えることが重要です。

入力項目は上から下、左から右へ自然に流れるように配置します。関連する項目は近くにまとめ、登録ボタンや検索ボタンなどの操作ボタンはわかりやすい位置に置きます。

Windowsフォームでは、フォーム上に自由にコントロールを配置できます。ただし、画面サイズを変更したときにレイアウトが崩れないよう、AnchorやDockプロパティを活用します。

WPFでは、Grid、StackPanel、DockPanelなどのレイアウト用コントロールを使います。特にGridは、行と列を使って画面を整理できるため、実務でもよく使われます。

見やすい画面を作るには、余白、文字の大きさ、項目の並び、ボタンの位置を意識することが大切です。

5-3. 画面遷移の実装方法

複数の画面を持つアプリでは、画面遷移が必要になります。例えば、ログイン画面からメイン画面へ移動する、一覧画面から詳細画面を開く、といった処理です。

Windowsフォームでは、新しいフォームを作成して表示します。

C#
MainForm mainForm = new MainForm();
mainForm.Show();
this.Hide();

このコードでは、MainFormを表示し、現在のフォームを非表示にしています。

モーダル画面として表示する場合は、ShowDialogを使います。

C#
DetailForm detailForm = new DetailForm();
detailForm.ShowDialog();

ShowDialogを使うと、詳細画面を閉じるまで元の画面を操作できなくなります。設定画面や確認画面などに向いています。

WPFでは、新しいWindowを表示する方法のほか、FrameやPageを使った画面遷移もあります。アプリの規模に応じて使い分けることが大切です。

5-4. 入力チェックとエラーメッセージ表示

画面作成では、ユーザーが入力した値をそのまま処理するのではなく、正しい内容かどうかを確認する必要があります。これを入力チェックといいます。

例えば、名前が未入力ではないか、年齢が数値か、メールアドレスの形式が正しいか、必須項目が入力されているかなどを確認します。

Windowsフォームで簡単な入力チェックを行う例は次の通りです。

C#
if (string.IsNullOrWhiteSpace(textBoxName.Text))
{
    MessageBox.Show("名前を入力してください");
    textBoxName.Focus();
    return;
}

このコードでは、名前が空の場合にメッセージを表示し、入力欄にフォーカスを戻しています。

数値チェックをする場合は、int.TryParseを使うと安全です。

C#
if (!int.TryParse(textBoxAge.Text, out int age))
{
    MessageBox.Show("年齢は数値で入力してください");
    return;
}

入力チェックを丁寧に行うことで、エラーを防ぎ、ユーザーにとって使いやすい画面になります。

5-5. データ表示と一覧画面の作り方

業務アプリでは、入力画面だけでなく、データを一覧表示する画面もよく作ります。例えば、顧客一覧、商品一覧、注文一覧などです。

WindowsフォームではDataGridView、WPFではDataGridを使うと、表形式でデータを表示できます。

WindowsフォームでDataGridViewにデータを表示する簡単な例は次の通りです。

C#
var users = new List<User>
{
    new User { Id = 1, Name = "田中" },
    new User { Id = 2, Name = "佐藤" }
};

dataGridView1.DataSource = users;

Userクラスは次のように定義します。

C#
public class User
{
    public int Id { get; set; }
    public string Name { get; set; }
}

このように、リスト形式のデータをDataGridViewに設定すると、表として表示できます。

一覧画面を作るときは、検索条件、検索ボタン、一覧表、詳細ボタン、登録ボタンなどを組み合わせると、実務に近い画面になります。

6. C#の画面作成を効率化する設計のコツ

C#の画面作成では、動くものを作るだけでなく、後から修正しやすい設計にすることが重要です。特にアプリの規模が大きくなると、画面と処理が混ざったコードは保守しにくくなります。

ここでは、見やすい画面設計や、処理と表示を分ける考え方について解説します。

6-1. 見やすく使いやすい画面設計のポイント

使いやすい画面を作るには、ユーザーが迷わず操作できることが大切です。

入力項目は必要なものだけに絞り、項目名はわかりやすくします。ボタンの文字も「実行」だけではなく、「登録」「検索」「削除」「クリア」のように、何をするボタンなのかがすぐにわかる表現にします。

また、重要なボタンと補助的なボタンの位置を分けることも大切です。例えば、登録ボタンと削除ボタンが近すぎると、誤操作の原因になります。

エラーメッセージは、何が間違っているのか、どう直せばよいのかがわかる内容にします。「エラーです」だけではなく、「名前を入力してください」「年齢は数値で入力してください」のように具体的に伝えます。

見た目の美しさだけでなく、操作のしやすさを意識することが、良い画面作成につながります。

6-2. 処理と画面表示を分ける考え方

初心者のうちは、ボタンのClickイベントにすべての処理を書いてしまいがちです。小さなアプリであれば問題ありませんが、処理が増えるとコードが長くなり、修正しにくくなります。

例えば、登録ボタンの中に入力チェック、データ変換、データ保存、メッセージ表示をすべて書くと、後から変更するときに大変です。

そこで、入力チェックは別メソッドにする、データ処理は別クラスにするなど、役割ごとに分けることが大切です。

C#
private void buttonRegister_Click(object sender, EventArgs e)
{
    if (!ValidateInput())
    {
        return;
    }

    RegisterUser();
    MessageBox.Show("登録しました");
}

このように処理を分けると、コードの流れが読みやすくなります。

画面は表示と入力を担当し、計算や保存などの処理は別のクラスに任せる設計を意識しましょう。

6-3. MVVMパターンの基礎

MVVMは、特にWPFでよく使われる設計パターンです。Model、View、ViewModelの3つに役割を分けてアプリを作ります。

Modelは、データや業務処理を担当します。例えば、ユーザー情報、商品情報、登録処理、計算処理などです。

Viewは、画面表示を担当します。WPFではXAMLで作る画面がViewにあたります。

ViewModelは、ViewとModelの間に入り、画面に表示するデータや操作を管理します。

MVVMを使うと、画面の見た目と処理を分けやすくなります。データバインディングと組み合わせることで、コードビハインドに処理を書きすぎず、保守しやすいアプリを作れます。

初心者が最初からMVVMを完璧に理解する必要はありません。まずは、画面と処理を分ける考え方を意識し、WPFに慣れてきたらMVVMを学ぶとよいでしょう。

6-4. 保守しやすいコードを書くための注意点

保守しやすいコードを書くには、名前の付け方が重要です。

button1、textBox1、label1のような自動生成された名前のままだと、コードを読んだときに何の部品かわかりにくくなります。buttonRegister、textBoxUserName、labelMessageのように、役割がわかる名前を付けましょう。

また、同じ処理を何度も書かないことも大切です。同じ入力チェックや変換処理が複数の場所にある場合は、メソッド化して再利用します。

長すぎるメソッドも避けましょう。1つのメソッドに多くの処理が入っていると、どこで何をしているのかがわかりにくくなります。

エラーが発生したときに原因を追いやすいよう、処理の流れを整理し、必要に応じて例外処理も書きます。

C#の画面作成では、見た目だけでなく、後から修正しやすいコードを意識することが上達につながります。

7. C#の画面作成でよくあるエラーと解決方法

C#で画面作成をしていると、ボタンを押しても動かない、コントロール名が見つからない、レイアウトが崩れる、ビルドエラーが出るといった問題がよく起こります。

エラーの原因を一つずつ確認すれば、多くの場合は解決できます。

7-1. ボタンを押しても処理が動かない場合

ボタンを押しても処理が動かない場合、まずClickイベントが正しく設定されているか確認します。

Windowsフォームでは、ボタンを選択し、プロパティウィンドウのイベント一覧からClickにメソッドが設定されているか確認します。

例えば、次のようなメソッドがあっても、ボタンのClickイベントに関連付けられていなければ実行されません。

C#
private void buttonSave_Click(object sender, EventArgs e)
{
    MessageBox.Show("保存しました");
}

WPFの場合は、XAMLのButtonにClick属性が設定されているか確認します。

XML
<Button Content="保存" Click="ButtonSave_Click" />

また、メソッド名を変更したあとにXAMLやイベント設定が古い名前のままになっていると、処理が動かない原因になります。

7-2. コントロール名が見つからない場合

コードでTextBoxやButtonを使おうとしたときに、名前が見つからないというエラーが出ることがあります。

Windowsフォームでは、デザイナー上で設定したNameプロパティと、コードで使っている名前が一致しているか確認します。

例えば、TextBoxのNameがtextBoxNameなのに、コードでtxtNameと書いているとエラーになります。

WPFの場合は、XAMLでx:Nameを設定しているか確認します。

XML
<TextBox x:Name="TextBoxName" />

x:Nameがないと、コードビハインドからそのコントロールを参照できない場合があります。

また、XAMLやデザイナーファイルにエラーがあると、自動生成コードが正しく作られず、コントロール名が認識されないこともあります。その場合は、XAMLのエラーやビルドエラーを先に解決しましょう。

7-3. 画面レイアウトが崩れる場合

画面レイアウトが崩れる原因は、固定サイズに頼りすぎていることが多いです。

Windowsフォームでは、画面サイズを変更したときにコントロールの位置や大きさが変わらず、不自然な余白ができることがあります。この場合は、AnchorやDockプロパティを設定します。

Anchorを使うと、フォームの上下左右のどの辺に対して位置を固定するかを指定できます。Dockを使うと、親コンテナに対して上下左右または全体にコントロールを配置できます。

WPFでは、Canvasで絶対位置を指定しすぎると、画面サイズ変更に弱くなります。GridやStackPanelを使って、柔軟にレイアウトを組むのがおすすめです。

特に実務アプリでは、画面サイズや表示環境が変わることを考えて、余白や伸縮に強いレイアウトを意識しましょう。

7-4. ビルドエラーや参照エラーの対処法

ビルドエラーが出た場合は、まずエラーメッセージをよく確認します。Visual Studioのエラー一覧には、どのファイルの何行目で問題が起きているかが表示されます。

よくある原因として、スペルミス、セミコロン忘れ、かっこの閉じ忘れ、クラス名やメソッド名の不一致があります。

参照エラーが出る場合は、必要なライブラリが追加されているか、usingが不足していないかを確認します。

例えば、Listを使う場合は次のusingが必要です。

C#
using System.Collections.Generic;

また、NuGetパッケージを使っている場合は、パッケージが正しくインストールされているか確認します。

原因がわからない場合は、エラーが出る直前に変更した箇所を見直すのが効果的です。エラーは最後に編集した場所に原因があることが多いです。

8. 初心者向けのC#画面作成サンプル

C#の画面作成を学ぶには、実際に小さなアプリを作るのが一番です。ここでは、初心者向けに作りやすいサンプルを紹介します。

簡単な計算アプリ、ログイン画面、一覧表示画面などを作ることで、入力、処理、表示の基本を理解できます。

8-1. 簡単な計算アプリを作る

計算アプリは、C#の画面作成の練習に向いています。2つの数値を入力し、ボタンを押すと合計を表示するアプリを作ってみましょう。

Windowsフォームの場合、TextBoxを2つ、Buttonを1つ、Labelを1つ配置します。

ボタンのClickイベントに次のコードを書きます。

C#
private void buttonCalc_Click(object sender, EventArgs e)
{
    if (!int.TryParse(textBoxNumber1.Text, out int number1))
    {
        MessageBox.Show("1つ目の数値を正しく入力してください");
        return;
    }

    if (!int.TryParse(textBoxNumber2.Text, out int number2))
    {
        MessageBox.Show("2つ目の数値を正しく入力してください");
        return;
    }

    int result = number1 + number2;
    labelResult.Text = "結果：" + result.ToString();
}

このサンプルでは、入力値の取得、数値チェック、計算、結果表示の流れを学べます。

計算方法を足し算だけでなく、引き算、掛け算、割り算に増やすと、さらに練習になります。

8-2. ログイン画面を作る

ログイン画面は、多くのアプリで使われる基本的な画面です。ユーザーIDとパスワードを入力し、正しければメイン画面へ進む仕組みを作ります。

TextBoxを2つ、Buttonを1つ配置します。パスワード用のTextBoxでは、入力文字を隠す設定を行います。

Windowsフォームの場合は、PasswordCharプロパティに「*」などを設定します。

ログインボタンの処理例は次の通りです。

C#
private void buttonLogin_Click(object sender, EventArgs e)
{
    string userId = textBoxUserId.Text;
    string password = textBoxPassword.Text;

    if (userId == "admin" && password == "password")
    {
        MessageBox.Show("ログイン成功");

        MainForm mainForm = new MainForm();
        mainForm.Show();
        this.Hide();
    }
    else
    {
        MessageBox.Show("ユーザーIDまたはパスワードが違います");
    }
}

このサンプルでは、条件分岐、メッセージ表示、画面遷移を学べます。

実際のアプリでは、パスワードをコードに直接書くのは避け、データベースや認証機能を使って安全に管理します。学習用としては、まず固定のIDとパスワードで動きを理解するとよいでしょう。

8-3. 一覧表示画面を作る

一覧表示画面は、業務アプリでよく使われます。顧客一覧や商品一覧のように、複数のデータを表形式で表示します。

WindowsフォームではDataGridViewを使います。

C#
private void Form1_Load(object sender, EventArgs e)
{
    var products = new List<Product>
    {
        new Product { Id = 1, Name = "ノートPC", Price = 120000 },
        new Product { Id = 2, Name = "マウス", Price = 2000 },
        new Product { Id = 3, Name = "キーボード", Price = 5000 }
    };

    dataGridViewProducts.DataSource = products;
}

Productクラスは次のように作成します。

C#
public class Product
{
    public int Id { get; set; }
    public string Name { get; set; }
    public int Price { get; set; }
}

このサンプルでは、Listに入れたデータをDataGridViewに表示しています。

一覧画面に検索機能や詳細表示機能を追加すると、より実務に近いアプリになります。

8-4. 入力・登録・表示までの流れを理解する

C#の画面作成では、入力、登録、表示の流れを理解することが重要です。

例えば、商品名と価格を入力し、登録ボタンを押すと一覧に追加されるアプリを考えます。

この場合、画面には商品名のTextBox、価格のTextBox、登録ボタン、DataGridViewを配置します。

処理の流れは、入力値を取得する、入力チェックを行う、商品データを作成する、リストに追加する、一覧を更新するという順番です。

簡単なイメージは次の通りです。

C#
private List<Product> products = new List<Product>();

private void buttonAdd_Click(object sender, EventArgs e)
{
    if (string.IsNullOrWhiteSpace(textBoxProductName.Text))
    {
        MessageBox.Show("商品名を入力してください");
        return;
    }

    if (!int.TryParse(textBoxPrice.Text, out int price))
    {
        MessageBox.Show("価格は数値で入力してください");
        return;
    }

    Product product = new Product
    {
        Id = products.Count + 1,
        Name = textBoxProductName.Text,
        Price = price
    };

    products.Add(product);

    dataGridViewProducts.DataSource = null;
    dataGridViewProducts.DataSource = products;
}

このようなアプリを作ると、C#の画面作成で必要な基本要素をまとめて練習できます。

9. C#の画面作成を学ぶためのステップ

C#の画面作成を効率よく学ぶには、いきなり大きなアプリを作るのではなく、段階的に学ぶことが大切です。

まずC#の基本文法を理解し、その後Windowsフォームで画面作成の基礎を学び、さらにWPFへ進む流れがおすすめです。

9-1. まず学ぶべきC#の文法

画面作成を始める前に、最低限のC#文法を理解しておくとスムーズです。

特に、変数、データ型、if文、for文、メソッド、クラス、プロパティ、List、例外処理はよく使います。

例えば、TextBoxから取得した文字列を数値に変換する、入力内容によって処理を分ける、データをクラスとして管理する、といった場面でC#の基本文法が必要になります。

画面作成では、すべての文法を完璧に覚えてから始める必要はありません。簡単な文法を学びながら、実際に画面を作って覚えていくのがおすすめです。

9-2. Windowsフォームで基礎を固める

C#の画面作成を初めて学ぶなら、Windowsフォームで基礎を固めるとよいでしょう。

Windowsフォームでは、画面にコントロールを配置し、ボタンのクリックイベントに処理を書くという流れがわかりやすくなっています。

最初に作るアプリとしては、メッセージ表示アプリ、計算アプリ、入力フォーム、ログイン画面、一覧表示画面などがおすすめです。

これらを作ることで、コントロールの使い方、イベント処理、入力チェック、画面遷移、データ表示の基本を学べます。

9-3. WPFで実務向けのGUI開発に進む

Windowsフォームで基礎を理解したら、WPFに進むとよいでしょう。

WPFでは、XAMLによる画面レイアウト、データバインディング、スタイル、テンプレート、MVVMパターンなどを学べます。

これらは最初は難しく感じるかもしれませんが、画面と処理を分けて管理しやすくなるため、規模の大きいアプリ開発に役立ちます。

WPFを学ぶときは、まずXAMLで画面を作り、コードビハインドでイベント処理を書くところから始めます。その後、データバインディングやViewModelを使う構成に進むと理解しやすくなります。

9-4. ポートフォリオとして作りやすいアプリ例

C#の画面作成を学んだら、ポートフォリオとして見せられるアプリを作るのもおすすめです。

初心者でも作りやすいアプリ例として、家計簿アプリ、ToDo管理アプリ、在庫管理アプリ、顧客管理アプリ、メモ帳アプリ、簡単な予約管理アプリなどがあります。

家計簿アプリでは、日付、カテゴリ、金額、メモを入力し、一覧表示や合計表示を行います。

ToDo管理アプリでは、タスクの追加、完了チェック、削除、一覧表示を実装します。

在庫管理アプリでは、商品名、数量、価格を登録し、一覧表示や検索機能を作ります。

これらのアプリは、入力、登録、編集、削除、検索、一覧表示といった画面作成の基本を含んでいるため、学習成果を示しやすい題材です。

10. C#の画面作成に関するよくある質問

C#の画面作成を学ぶときには、WindowsアプリだけでなくWeb画面も作れるのか、Visual Studioが必要なのか、Windowsフォームを今から学んでもよいのかなど、さまざまな疑問が出てきます。

ここでは、初心者が気になりやすい質問に答えます。

10-1. C#でWeb画面は作れるのか

C#ではWeb画面も作れます。代表的な技術として、ASP.NET Coreがあります。

ASP.NET Coreを使うと、Webサイト、Webアプリ、管理画面、APIなどを作成できます。また、Blazorを使うと、C#を使ってWeb画面の開発を行うこともできます。

ただし、WindowsフォームやWPFはWindowsデスクトップアプリ向けの技術です。Webブラウザで動く画面を作りたい場合は、ASP.NET CoreやBlazorを学ぶ必要があります。

つまり、C#で画面作成をする場合でも、Windowsアプリを作りたいのか、Webアプリを作りたいのかによって選ぶ技術が変わります。

10-2. C#の画面作成にVisual Studioは必要か

C#の画面作成では、Visual Studioを使うのが最もおすすめです。

特にWindowsフォームやWPFでは、Visual Studioのデザイナー機能やプロジェクトテンプレートが便利です。画面部品を配置したり、プロパティを変更したり、イベント処理を作成したりする作業が簡単になります。

C#のコード自体はVisual Studio Codeなどでも書けますが、初心者が画面作成を学ぶ場合は、Visual Studioの方がわかりやすいです。

まずはVisual Studioで基本を学び、慣れてきたら他のエディタや開発方法を試すとよいでしょう。

10-3. Windowsフォームは今から学んでもよいか

Windowsフォームは今から学んでも十分に意味があります。

理由は、画面作成の基本を理解しやすく、C#のイベント処理やコントロールの使い方を学ぶのに向いているからです。また、既存の業務アプリや社内ツールでは、Windowsフォームが使われているケースもあります。

ただし、新しく大規模なアプリを作る場合や、デザイン性、拡張性、保守性を重視する場合は、WPFや他の技術も検討した方がよいでしょう。

学習目的であれば、Windowsフォームから始めて問題ありません。その後、WPFやASP.NET Coreなどに進むと、C#で作れる画面の幅が広がります。

10-4. WPFとWindowsフォームは実務でどちらが使われるか

実務では、WindowsフォームとWPFのどちらも使われます。

Windowsフォームは、既存の業務システムや社内ツールで使われていることがあります。シンプルな画面や、短期間で作るツールでは今でも選択肢になります。

WPFは、より複雑な画面や、データバインディング、MVVMパターンを活用したアプリで使われます。画面の自由度や保守性を重視する場合に向いています。

どちらを学ぶべきか迷う場合は、まずWindowsフォームで基礎を学び、その後WPFを学ぶのがおすすめです。両方を理解しておくと、C#の画面作成に対する理解が深まり、実務でも対応しやすくなります。

まとめ

C#の画面作成では、Windowsフォーム、WPF、WinUI、.NET MAUI、ASP.NET Coreなど、目的に応じてさまざまな技術を選べます。

初心者が最初に学ぶなら、Windowsフォームがおすすめです。画面にボタンやテキストボックスを配置し、イベント処理を書く流れがわかりやすいため、C#でGUIアプリを作る基本を理解しやすいからです。

Windowsフォームで基礎を固めたら、WPFに進むことで、XAML、データバインディング、MVVMパターンなど、より実務向けの画面作成を学べます。

C#の画面作成で重要なのは、コントロールの使い方、イベント処理、入力チェック、画面遷移、データ表示、レイアウト設計です。これらを小さなサンプルアプリで練習することで、着実にスキルが身につきます。

まずは、ボタンを押したらメッセージを表示する簡単なアプリから始めてみましょう。その後、計算アプリ、ログイン画面、一覧表示画面、登録フォームへと少しずつ発展させることで、C#の画面作成を基礎から実践的に学べます。