Visual Studio CodeでWPFアプリをつくる方法

.NET Core, Visual Studio Code, Windows, Windows 10, WPF, XAML

WPFアプリは通常、Visual Studioでつくるものだけど、Visual Studio Codeでも一応はつくれる。今回はその基本的な手順をメモしていく。

もくじ


.NET Core SDKのインストール

このサイトから.NET Core SDKのインストーラをダウンロードしてインストールする。

「Runtime」ではなく「SDK」が必要なので注意。

Visual Studio Codeのインストール

Visual Studio Codeのサイトからインストーラをダウンロードする。

インストーラを実行中、次のようなチェックボックスの画面が表示されるが、赤枠で囲んだところはチェックを入れておくのがオススメ。チェックしておくと、エクスプローラ(ファイルエクスプローラ)でファイルやフォルダの右クリックメニューから直接起動できる。

後は普通のインストール手順でOK。

WPFプロジェクトの作成

パスがあまり深くないところにWPFプロジェクトをつくるためのフォルダを1つ用意する。

ここでは例として C:\src フォルダをつくる。

つくったフォルダを右クリックしてVisual Studio Codeで開く。

Visual Studio Codeのメニューから Terminal -> New Terminal を選択する。

表示されるコンソールで dotnet new wpf と入力してEnterキーを押す。

すると、WPFアプリ開発に必要な基本的なファイル・フォルダ構成がつくられる。

コンソール上で dotnet run と入力してEnterキーを押すと、空のウィンドウが表示される。これがWPFアプリの最も基本となる画面だ。

ここまでできたら空のウィンドウを閉じよう。

XAMLの編集

WPFの画面はXAMLという形式で記述される。

先ほど作成したプロジェクトに含まれるMainWindow.xamlというファイルが先ほど表示した空のウィンドウの表示内容を記述したXAMLだ。

プロジェクトを作った段階では中身は次のようになっている。

Grid要素の下にTextBlock要素を1つ追加してみよう。こんな感じ。

実行結果は次のようになる。