WinUI アプリを作成する

このチュートリアル シリーズでは、XAML と C# を使用して WinUI 3 アプリを作成する方法について説明します。 作成するアプリはノート アプリであり、ユーザーは複数のノートを作成、保存、読み込むことができます。 このチュートリアルのコードは 、GitHub リポジトリからダウンロードまたは表示できます。

このチュートリアルでは、以下の内容を学習します。

• XAML マークアップを使用して、アプリのユーザー インターフェイスを定義します。
• C# コードを使用して XAML 要素と対話します。
• ローカル ファイル システムからファイルを保存して読み込みます。
• ビューを作成し、データにバインドします。
• ナビゲーションを使用して、アプリ内のページとの間を移動します。
• ドキュメントやサンプル アプリなどのリソースを使用して、独自のアプリを作成します。

Visual Studio 2022 を使用して、メモを入力してローカル アプリ ストレージに保存できるアプリを作成します。 このアプリのソース コードについては、こちらをご覧ください。 アプリには次の 2 つのページがあります。

• NotePage - 1 つのメモを編集するためのページ。
• AllNotesPage - 保存されているすべてのノートを表示するページ。

最終的なアプリケーションは、次のとおりです。

AllNotesPage

NotePage

Visual Studio プロジェクトの作成

このチュートリアルを開始するには、 Blank App, Packaged (WinUI 3 in Desktop) C# プロジェクト テンプレートを使用して、Visual Studio で WinUI 3 アプリ プロジェクトを作成する必要があります。 プロジェクトを作成するときは、次の設定を使用します。

• プロジェクト名

  これは、WinUINotes に設定する必要があります。 プロジェクトに別の名前が付けられている場合、このチュートリアルからコピーして貼り付けたコードによってビルド エラーが発生する可能性があります。 これは、Visual Studio でプロジェクト名がアプリ コードの既定の 名前空間 として使用されるためです。

• Windows App SDK

  このチュートリアルでは、Windows App SDK 1.7 の新機能を使用します。 Windows App SDK NuGet パッケージがバージョン 1.7 以降に更新されていることを確認する必要があります。

Important

以前に WinUI 3 プロジェクトを作成したことがない場合は、「 Windows アプリの開発を開始 する」の手順に従って、開発環境と Visual Studio プロジェクトが正しく設定されていることを確認します。

空のアプリ プロジェクトを実行すると ( Windows アプリの開発の開始に関するセクションで説明されているように)、次のような空のウィンドウが表示されます。

ヒント

Windows アプリの構築中は、API リファレンス ドキュメントと概念ドキュメントを頻繁に参照します。 このチュートリアルでは、リンクがテキスト内にインラインで表示され、「ドキュメントの詳細:」というラベルが付いたグループに表示されます。 これらのリンクは省略可能です。チュートリアルを完了するためにそれらに従う必要はありません。 これらは、独自のアプリの作成を開始するときに必要な情報を検索する場所をメモする場合に提供されます。

手順 1 に進む - プロジェクトのセットアップ