はじめに

データ バインディングを使うと、データとユーザー インターフェイス (UI) コントロール間のリレーションシップを宣言できます。 いずれかの要素が変更されたとき、自動的にそれらの同期が維持されます。 データ バインディングによって、コードの読み取りを高速化し、保守を容易にし、テスト容易性を向上させることができます。

データ バインディングにより、UI の分離コード内で UI とコードを関連付ける代わりに、UI をデータに直接結合する方法が提供されます。 UI がデータにバインドされると、データが変更されたときに UI が自動的に更新され、データとの同期が維持されます。 逆に、ユーザーが UI と対話する場合、データは UI と同期したままです。

シナリオ例

選択した地域すなわち住所の気象情報をユーザーに表示するアプリを開発しているとします。 ユーザーが場所を入力すると、アプリが外部の気象サービスから天気予報データを読み込み、UI を更新します。 UI と気象サービス データは、XAML UI と XAML 分離コード ファイルを介して密に結合されます。 気象サービスは既に独自のクラスに抽象化されていますが、UI はそのデータを UI に表示するために主に分離コードに依存しています。

アプリがリリースされてからしばらくすると、使用する気象サービスによってシャットダウンが発表されます。 これに備えて、代わりのサービスを探し始めます。 評価したサービスのすべてで、データの入力および出力の方法が異なることがわかりました。 UI はサービスとの対話に分離コード イベントを使用するため、この変更によって UI エクスペリエンスが影響を受ける可能性があります。

UI が天気の更新を同期する方法を分離コード イベントからデータ バインディングに変更することが役立ちます。 これにより、サービスの変更が再び発生した場合、コードへの影響を最小限に抑えることができます。

あなたがすること

このモジュールでは、コード ベースの UI とデータ バインド UI の違いを示し、分離コードではなくデータ バインディングを使用して UI を更新する方法について説明します。 サンプルの天気アプリを使用して、UI の更新を分離コードからデータ バインディングに変換します。

学習内容

このモジュールを終了すると、データ バインディングを使用して UI にデータを表示し、UI の型とデータ型が一致しない場合にデータを変換できるようになります。

前提条件

• .NET MAUI ワークロードがインストールされている Visual Studio 2026
• 省略可能:.NET MAUI 拡張機能を含む Visual Studio Code と、.NET MAUI ワークロードを含む .NET SDK がインストールされていること

.NET MAUI 開発の要件

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

• .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 ワークロードと共にインストールする必要があります。 セットアップのチュートリアルについては、このドキュメントを参照してください。