The VisualTreeView is used to display the visual structure of an arbitrary DependencyObject in a more presentable manner - as a TreeView. Each element in the visual hierarchy is presented as a TreeViewItem, the visual children of an element are presented as TreeViewItem children and so on. Selecting an item in the TreeView optionally displays an overlay border on top of the corresponding visual element. In order to enable this functionality you have to supply a Grid or Canvas panel containing (or positioned over) the selected object to the CommonParent property.

The following XAML example demonstrates how to use of the VisualTreeView to inspect a DateTimePicker object.

XAML  Copy Code

<Window x:Class="WpfApplication.Window1"     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"     xmlns:ui="clr-namespace:MindFusion.UI.Wpf;assembly=MindFusion.UI.Wpf"     Title="VisualTreeView Test" Height="394" Width="685">   <Grid x:Name="Container">     <Grid.RowDefinitions>       <RowDefinition Height="Auto" />       <RowDefinition />     </Grid.RowDefinitions>     <ui:DateTimePicker Name="picker" Width="179" Height="24" Margin="10" />     <ui:VisualTreeView Margin="10" Grid.Row="1" SelectedObject="{Binding ElementName=picker}" BorderBrush="Gray" BorderThickness="1" CommonParent="{Binding ElementName=Container}" OverlayBackground="#80FF0000" OverlayBorderBrush="Red" OverlayBorderThickness="1" />   </Grid> </Window>

Selecting an item in the VisualTreeView will place a red overlay on top of the corresponding visual element.

System.Object
    System.Windows.Threading.DispatcherObject
        System.Windows.DependencyObject
            System.Windows.Media.Visual
                System.Windows.UIElement
                    System.Windows.FrameworkElement
                        System.Windows.Controls.Control
                            MindFusion.UI.Wpf.VisualTreeView

VisualTreeView Members
MindFusion.UI.Wpf Namespace