初心者・安心感重視: 「【挫折しない】C# WPF入門！Hello Worldでアプリ開発の第一歩を踏み出そう」

.NET

.NETを使用したデスクトップアプリケーション（Windows）で、次はWPFアプリケーションモデルの説明になります。
前回説明したWindows Formsアプリケーションの次世代のアプリケーションになります。
WPFでもまずは、簡単なHellow Worldアプリケーションを作成したいと思います。

プロジェクト作成

テンプレート選択

Visual Studio 2022を起動し、Windows Formsと同様にWindows-デスクトップで絞り込み、「WPFアプリケーション」を選択します。（言語はC#を使用します。）
.NET Frameworkでなく、.NET WPFアプリを選択します。どちらでもWPFアプリケーションを作成できますが、これから新しく作るのであれば、新しい.NETを使用するほうが良いです。

プロジェクト名に「HelloWpfApp」と入力して、次へをクリックします。

使用する.NETのバージョンを選択します。
Windows Formsの時と同様に.NET 8.0を選択して、次へをクリックするとWPFアプリケーションのプロジェクトが生成されます。
このやり方でも新しいプロジェクトが作成されますが、前回作成したWindwos FormsのHello Worldアプリケーションと別ソリューションとなります。一つの製品を作成する場合など、複数のプロジェクトを一つにまとめて開発を行います。アプリケーション本体、ライブラリ、ツールなどを一つにまとめるのがソリューションになります。今回はHellow Worldアプリ集ということで、一つのソリューションに入れて作成したいと思います。

一旦、すべてキャンセルして、ダイアログを閉じます。
下記で作成したソリューションファイルを開きます。

【完全解説】C# Windows FormsでHello World！初心者でも10分で作れる手順書
.NET のWindows向けアプリケーションモデルの一つであるWindows Formsを使ってHello Worldアプリケーションを作成します。 Visual Studioを使ってWindows Formsアプリケーションの作成方法を紹介します。
slow-challange.com
2026.04.13

VisualStudio2022を起動して、作成済みの「HelloDesktopAppSolution」を選択します。

ソリューションが開いたらソリューションエクスプローラーでソリューションを選択して右クリックします。続けて、「追加」-「新しいプロジェクト」を選択します。

新しいプロジェクトの追加画面が表示されますので、「.NET WPFアプリケーション」（C#）を選択して次へをクリックします。

プロジェクト名に「HelloWpfApp」と入力して次へをクリックします。

.NET8.0を選択して、次へをクリックします。

ソリューションにWPFアプリケーションのプロジェクトが追加されます。

プロジェクトファイルの内容は後述します。
今のレイアウトだと狭くて操作しにくいので、下記のようなレイアウトで進めたいと思います。
レイアウトはデザイナ部分の分割方法のアイコンをクリックして変更できます。
また、左右の矢印ボタンでXAMLとデザイナを入れ替えることが可能です。

プロジェクトファイル

それでは、WPFプロジェクトのファイルの説明に入ります。

プロジェクトファイル

HelloWpfAppがプロジェクトファイルです。
Windows Formsと同様に右クリックプロパティから、アプリケーションの設定を行うことができます。エクスプローラーで確認すると*.csprojという拡張子がプロジェクトファイルになります。

デザインファイル/コードビハインドファイル

WPFアプリケーションはというXML形式で画面をデザインしていきます。MainWindow.xamlというファイルがデザインファイルのXAMLになります。
XAMLはデザイナを使用して、コントロールを配置していくと自動で書き込まれます。
また、慣れてくると、直接XAMLを修正して、コントロールの配置、変更を行うこともできます。
ソリューションエクスプローラーでMainWindow.xamlというファイルを展開するとMainWindow.xaml.csという名前のファイルが表示されます。これがコードビハインドファイルで、処理内容をC#で記載します。
Windows Formsの場合は、ボタン等のイベントハンドラが記載され、そこから処理を呼び出すというのが主な書き方でした。WPFも同じようにイベントハンドラを記載して処理を記載することもできます。WPFはバインドという仕組みが強化されていまして、画面表示の処理をバインドに任せることで実際のビジネスロジック等に集中することができます。
今回はHellow Worldアプリなのでバインドは使用しませんが、徐々にバインドの説明も行っていきたいと思います。

エントリポイントファイル

App.xaml.csがエントリポイントファイルとなり、Windows FormsのProgram.csにあたるファイルです。正確にはエントリポイントの関数はありませんが、Appクラスのアプリケーション開始系のイベントやメソッド（オーバーライド）により、アプリケーション開始時の処理を記載することができます。逆に、アプリケーション終了時の処理も記載することも可能です。

App.xaml.csではなく、App.xamlも開くことが可能でこちらにはアプリケーション全体で共通で使用するデザイン定義等を記載することができます。
詳細は徐々に行っていければと思います。

Hello World表示

デザイン（XAML）ファイル

それでは、Windows Formsで作成したHello WorldアプリケーションをWPFでも作成していきたいと思います。
まずMainWindow.xamlファイルをダブルクリックしてデザイナを表示します。
その後、左のツールボックスからLabelコントロールをウインドウにドラッグ＆ドロップします。

ウインドウにドラッグしたら、右側のプロパティウインドウからContentプロパティの値（またはXAMLファイル内のContent）をHello Worldに変更します。

同様にツールボックスからボタンをドラッグ&ドロップし、Contentプロパティをメッセージに変更します。
このままだとウインドウサイズが大きすぎてバランスが悪いので、ウインドウの四隅いずれかをつまんでサイズを変更します。

デザイナでボタンをダブルクリックして、クリックイベントハンドラを生成します。
自動でコードビハインドに切り替わりますので、Hello Worldをメッセージボックスで表示するようにコードを記載します。

コードビハインドファイル

今回記載したコードを下記に記載します。（メッセージボックスを表示する簡単なソースですが）

using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace HelloWpfApp
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            MessageBox.Show("Hello World");
        }
    }
}

実行

それでは作成したアプリケーションを実行したいと思います。
このまま実行すると前回作成したWindows Formsのアプリケーションが実行されてしまいます。
HelloWpfAppプロジェクトを右クリックして、スタートアッププロジェクトに設定を選択することで、実行するアプリケーションを切り替えることができます。
スタートアップに指定されたアプリケーションはプロジェクト名が太字で表示されます。

F5キーを押すか、上部のメニューからデバッグ-実行または、ツールバーから三角の実行アイコンがついたHelloWpfAppを押すことで、デバッグモードで実行することができます。

タイトルバーに色々なボタンが表示されているのはデバッグ用のボタンです。
実際はでデザインされていないボタンで、ウインドウ内のコントロールの配置階層を確認したり、デザイン上の調査等を行います。
メッセージボタンをクリックして、メッセージが表示されることを確認します。

Hello Worldメッセージが表示されれば、今回のアプリケーションは正常に動作していることになります。
前回作成したWindows Formsと同じデザインで作成していますが、WPFで作成するとUIが変わってきます。
今回は、Windows Formsに合わせてコードの記載方法も似た感じで作成しました。
今後はWPF特有のバインドを使ったアプリケーションの記載方法も紹介していきます。Windows Formsにもバインドの機能はありますので、そのあたりの記載方法の違いも見ていきたいと思います。


コメント

タイトルとURLをコピーしました