Basic display of set properties in DevTools.

Perspex.Controls/TreeView.cs

@@ -34,16 +34,16 @@ namespace Perspex.Controls
 
             if (contentPresenter != null)
             {
-                TreeViewItem item = contentPresenter.TemplatedParent as TreeViewItem;
+                TreeViewItem container = contentPresenter.TemplatedParent as TreeViewItem;
 
-                if (item != null)
+                if (container != null)
                 {
                     foreach (var i in this.GetVisualDescendents().OfType<TreeViewItem>())
                     {
-                        i.IsSelected = i == item;
+                        i.IsSelected = i == container;
                     }
 
-                    this.SelectedItem = this.ItemContainerGenerator.GetContainerForItem(item);
+                    this.SelectedItem = this.ItemContainerGenerator.GetItemForContainer(container);
                 }
             }
 

Perspex.Diagnostics/DevTools.cs

@@ -17,6 +17,38 @@ namespace Perspex.Diagnostics
 
         public DevTools()
         {
+            var treeView = new TreeView
+            {
+                DataTemplates = new DataTemplates
+                {
+                    new TreeDataTemplate<VisualTreeNode>(GetHeader, x => x.Children),
+                },
+                [!TreeView.ItemsProperty] = this[!DevTools.RootProperty].Select(x =>
+                {
+                    if (x != null)
+                    {
+                        return new[] { new VisualTreeNode((IVisual)x) };
+                    }
+                    else
+                    {
+                        return null;
+                    }
+                }),
+            };
+
+            var detailsView = new ContentControl
+            {
+                DataTemplates = new DataTemplates
+                {
+                    new DataTemplate<ControlDetails>(CreateDetailsView),
+                },
+                [!ContentControl.ContentProperty] = treeView[!TreeView.SelectedItemProperty]
+                    .Where(x => x != null)
+                    .Cast<VisualTreeNode>()
+                    .Select(x => new ControlDetails(x.Visual)),
+                [Grid.ColumnProperty] = 1,
+            };
+
             this.Content = new Grid
             {
                 ColumnDefinitions = new ColumnDefinitions
@@ -26,24 +58,8 @@ namespace Perspex.Diagnostics
                 },
                 Children = new Controls
                 {
-                    new TreeView
-                    {
-                        DataTemplates = new DataTemplates
-                        {
-                            new TreeDataTemplate<VisualTreeNode>(GetHeader, x => x.Children),
-                        },
-                        [!TreeView.ItemsProperty] = this[!DevTools.RootProperty].Select(x =>
-                        {
-                            if (x != null)
-                            {
-                                return new[] { new VisualTreeNode((IVisual)x) };
-                            }
-                            else
-                            {
-                                return null;
-                            }
-                        }),
-                    }
+                    treeView,
+                    detailsView,
                 }
             };
         }
@@ -54,6 +70,14 @@ namespace Perspex.Diagnostics
             set { this.SetValue(RootProperty, value); }
         }
 
+        private static Control CreateDetailsView(ControlDetails i)
+        {
+            return new ItemsControl
+            {
+                Items = i.Properties,
+            };
+        }
+
         private static Control GetHeader(VisualTreeNode node)
         {
             TextBlock result = new TextBlock();

Perspex.Diagnostics/Perspex.Diagnostics.csproj

@@ -69,6 +69,7 @@
     <Compile Include="DevTools.cs" />
     <Compile Include="Debug.cs" />
     <Compile Include="Properties\AssemblyInfo.cs" />
+    <Compile Include="ViewModels\ControlDetails.cs" />
     <Compile Include="ViewModels\VisualTreeNode.cs" />
   </ItemGroup>
   <ItemGroup>

Perspex.Diagnostics/ViewModels/ControlDetails.cs

@@ -0,0 +1,33 @@
+// -----------------------------------------------------------------------
+// <copyright file="ControlDetails.cs" company="Steven Kirk">
+// Copyright 2014 MIT Licence. See licence.md for more information.
+// </copyright>
+// -----------------------------------------------------------------------
+
+namespace Perspex.Diagnostics.ViewModels
+{
+    using System;
+    using System.Collections.Generic;
+    using System.Linq;
+    using Perspex.Controls;
+    using ReactiveUI;
+
+    internal class ControlDetails : ReactiveObject
+    {
+        public ControlDetails(IVisual visual)
+        {
+            PerspexObject po = visual as PerspexObject;
+
+            if (po != null)
+            {
+                this.Properties = po.GetSetValues().Select(x => Tuple.Create(x.Item1.Name, x.Item2));
+            }
+        }
+
+        public IEnumerable<Tuple<string, object>> Properties
+        {
+            get;
+            private set;
+        }
+    }
+}

Perspex.Diagnostics/ViewModels/VisualTreeNode.cs

@@ -1,19 +1,21 @@
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Text;
-using System.Threading.Tasks;
-using Perspex.Controls;
-using ReactiveUI;
+// -----------------------------------------------------------------------
+// <copyright file="VisualTreeNode.cs" company="Steven Kirk">
+// Copyright 2014 MIT Licence. See licence.md for more information.
+// </copyright>
+// -----------------------------------------------------------------------
 
 namespace Perspex.Diagnostics.ViewModels
 {
+    using Perspex.Controls;
+    using ReactiveUI;
+
     internal class VisualTreeNode : ReactiveObject
     {
         public VisualTreeNode(IVisual visual)
         {
             this.Children = visual.VisualChildren.CreateDerivedCollection(x => new VisualTreeNode(x));
             this.Type = visual.GetType().Name;
+            this.Visual = visual;
 
             Control control = visual as Control;
 
@@ -28,5 +30,7 @@ namespace Perspex.Diagnostics.ViewModels
         public bool IsInTemplate { get; private set; }
 
         public string Type { get; private set; }
+
+        public IVisual Visual { get; private set; }
     }
 }