はじめに

完了

UI 全体で同じフォントおよび色を使用して、一貫性のある外観と操作性を実現します。 .NET MAUI には、これらの値を 1 か所で定義し、それが使用されている任意の場所で検索する方法が用意されています。 値を再利用することによって、アプリ全体で一貫性が保証され、更新が簡単になります。

TipCalculator という名前のモバイル アプリケーションを構築しているとします。 このアプリは、接客業で使用され、従業員はサービスに対するチップをすばやく計算できます。 会社は、企業ブランドの外観を最近変更しました。 あなたの仕事は、アプリの UI を更新して新しい外観に合わせることです。 フォント、テキストの色、背景色を変更する必要があります。 会社の成長に合わせてブランドを頻繁に変更する必要があるため、この種の更新を簡単にしたいと考えています。

このモジュールでは、リソースをコードと XAML の両方で定義および適用する方法について学習します。 また、複数の設定をスタイルにグループ化して、それらをすべて一度に適用できるようにする方法についても確認します。

Note

このモジュールには Visual Studio 2022 が必要です。 Windows または Mac のどちらかを使用できます。 Windows 上で実行している場合は、.NET によるモバイル開発のワークロードがインストールされていることを確認してください。 インストールにそれを追加する必要がある場合は、こちらのドキュメントを参照してください。 Mac 上で実行している場合は、標準の Visual Studio for Mac インストールに、.NET MAUI を使用してアプリを構築するために必要なすべてのものが含まれています。

学習の目的

このモジュールでは、次の方法を学習します。

  • MAUI XAML ユーザー インターフェイスで静的リソースを作成して使用する。
  • 動的リソースを作成して使用する。
  • スタイルを使用して一貫性のあるユーザー インターフェイスを作成する。
  • アプリケーション全体のリソースを作成して使用する。
  • 組み込みスタイルを使用して、ユーザーが選択したアクセシビリティを適用する。

前提条件

  • .NET MAUI ワークロードがインストールされている Visual Studio 2022。
  • 省略可能:.NET MAUI 拡張機能を含む Visual Studio Code と、.NET MAUI ワークロードを含む .NET SDK がインストールされていること。
  • C# と .NET に関する知識。

.NET MAUI 開発の要件

.NET 8 を使用して .NET MAUI アプリを作成するには、Visual Studio バージョン 17.8 以降と次のワークロードをインストールする必要があります。

  • .NET Multi-Platform App UI 開発

さらに、.NET MAUI Blazor アプリをビルドする場合は、ASP.NET と Web 開発ワークロードをインストールする必要があります。

セットアップのチュートリアルについては、このドキュメントを参照してください。

Visual Studio Code での開発

macOS または Linux で開発している場合は、Visual Studio Code.NET MAUI 拡張機能を、.NET SDK および .NET MAUI ワークロードと共にインストールする必要があります。 セットアップのチュートリアルについては、このドキュメントを参照してください。