.NET MAUI アプリのビジュアル ツリーを調べる

.NET マルチプラットフォーム アプリ UI (.NET MAUI) ライブ ビジュアル ツリーは、実行中の .NET MAUI アプリの UI 要素のツリー ビューを提供する Visual Studio 機能です。

デバッガーがアタッチされたデバッグ構成で .NET MAUI アプリが実行されている場合、Visual Studio メニュー バーから [デバッグ] > [ウィンドウ] > ライブ ビジュアル ツリー] を選択することで、ライブ ビジュアル ツリー ウィンドウを開くことができます。

ホット リロードが有効になっている場合、アプリの UI が XAML または C# を使用してビルドされているかどうかに関係なく、ライブ ビジュアル ツリー ウィンドウにアプリの UI 要素の階層が表示されます。 ただし、C# を使用してビルドされた UI のアプリの UI 要素の階層を表示するには、[自分の XAML のみ] を無効にする必要があります。

自分の XAML のみ

UI 要素のビューは、自分の XAML のみという機能を使用して、既定で簡略化されています。 Visual Studio で、[自分の XAML のみを表示] ボタンをクリックすると、機能が無効になり、ビジュアル ツリー内のすべての UI 要素が表示されます。

Visual Studio のメニュー バーから [デバッグ] > [オプション] > [XAML ホット リロード] を選択すると、自分の XAML のみ機能を完全に無効にできます。 次に、[オプション] ダイアログ ボックスで、[ライブ ビジュアル ツリーで自分の XAML のみを有効にする] が無効になっていることを確認します。

UI 要素を検索する

XAML UI の構造には、関心がない要素が多数あり、アプリのソース コードを完全に理解していない場合は、探している UI 要素を見つけるためにビジュアル ツリー内を移動するのが難しい場合があります。 そのため、Windows のライブ ビジュアル ツリー ウィンドウには、アプリの UI を使用して調べたい要素を見つけるためのアプローチが複数あります。

• 実行中のアプリケーションの要素を選択します。 このモードを有効にするには、[ライブ ビジュアル ツリー] ツールバーの [実行中のアプリケーションの要素を選択] ボタンをクリックします。

  

  このモードを有効にすると、アプリで UI 要素を選択するとき、[ライブ ビジュアル ツリー] ウィンドウが自動的に更新され、その要素に対応するツリーのノードが表示されます。

• 実行中のアプリケーションでレイアウトの装飾を表示する。 このモードを有効にするには、[ライブ ビジュアル ツリー] ツールバーの [実行中のアプリケーションでレイアウトの装飾を表示] ボタンをクリックします。

  

  このモードを有効にすると、アプリのウィンドウに、選択したオブジェクトの境界線に沿って水平と垂直の線が表示されるので、オブジェクトの位置が確認でき、余白を示す長方形も表示されます。

• 選択のプレビュー。 このモードを有効にするには、[ライブ ビジュアル ツリー] ツールバーの [選択した項目のプレビュー] ボタンをクリックします。

  

  このモードでは、アプリのソースコードにアクセスできる場合に限り、要素が宣言された XAML ソースコードを表示します。