WPF-要素ツリー
プログラマーがオブジェクトを簡単に処理し、アプリケーションの動作を変更できるように、要素とコンポーネントがツリー構造で順序付けられている多くのテクノロジーがあります。Windows Presentation Foundation(WPF)には、オブジェクトの形式の包括的なツリー構造があります。WPFでは、完全なオブジェクトツリーを概念化する方法が2つあります。
- 論理ツリー構造
- ビジュアルツリー構造
これらのツリー構造を使用すると、UI要素間の関係を簡単に作成および識別できます。ほとんどの場合、WPFの開発者と設計者は、手続き型言語を使用してアプリケーションを作成するか、オブジェクトツリー構造を念頭に置いてXAMLでアプリケーションのUI部分を設計します。
論理ツリー構造
WPFアプリケーションでは、XAMLのUI要素の構造は論理ツリー構造を表します。XAMLでは、UIの基本要素は開発者によって宣言されます。WPFの論理ツリーでは、次のように定義されています。
- 依存関係のプロパティ
- 静的および動的リソース
- その名前などの要素をバインドします。
ボタンとリストボックスが作成される次の例を見てみましょう。
<Window x:Class = "WPFElementsTree.MainWindow"
xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
Title = "MainWindow" Height = "350" Width = "604">
<StackPanel>
<Button x:Name = "button" Height = "30" Width = "70" Content = "OK" Margin = "20" />
<ListBox x:Name = "listBox" Height = "100" Width = "100" Margin = "20">
<ListBoxItem Content = "Item 1" />
<ListBoxItem Content = "Item 2" />
<ListBoxItem Content = "Item 3" />
</ListBox>
</StackPanel>
</Window>
XAMLコードを見ると、ツリー構造がわかります。つまり、ルートノードはウィンドウであり、ルートノード内にはStackPanelという子が1つだけあります。ただし、StackPanelには、ボタンとリストボックスの2つの子要素が含まれています。リストボックスには、さらに3つの子リストボックスアイテムがあります。
ビジュアルツリー構造
WPFでは、ビジュアルツリーの概念は、Visual BaseClassで表されるビジュアルオブジェクトの構造を記述します。これは、出力画面にレンダリングされるすべてのUI要素を意味します。
プログラマーが特定のコントロールのテンプレートを作成したい場合、実際にはそのコントロールのビジュアルツリーをレンダリングしています。ビジュアルツリーは、パフォーマンスと最適化の理由から、より低いレベルのコントロールを描画したい場合にも非常に役立ちます。
WPFアプリケーションでは、ビジュアルツリーは次の目的で使用されます。
- ビジュアルオブジェクトのレンダリング。
- レイアウトのレンダリング。
- ルーティングされたイベントは、ほとんどの場合、論理ツリーではなく、ビジュアルツリーに沿って移動します。
ボタンとリストボックスを含む上記の単純なアプリケーションのビジュアルツリーを表示するには、XAMLコードをコンパイルして実行すると、次のウィンドウが表示されます。
アプリケーションの実行中は、以下に示すように、このアプリケーションの完全な階層を示すライブビジュアルツリーウィンドウで、実行中のアプリケーションのビジュアルツリーを確認できます。
ビジュアルツリーは通常、論理ツリーのスーパーセットです。ここで、すべての論理要素がビジュアルツリーにも存在することがわかります。したがって、これら2つのツリーは、実際にはUIを構成する同じオブジェクトセットの2つの異なるビューにすぎません。
論理ツリーでは多くの詳細が省略されているため、ユーザーインターフェイスのコア構造に焦点を合わせ、それがどのように表示されているかの詳細を無視できます。
論理ツリーは、ユーザーインターフェイスの基本構造を作成するために使用するものです。
プレゼンテーションに集中している場合は、ビジュアルツリーが役立ちます。たとえば、UI要素の外観をカスタマイズする場合は、ビジュアルツリーを使用する必要があります。