XAML Spy includes an extension for Visual Studio. XAML Spy supports Visual Studio 2012, 2013, 2015, including the free Visual Studio 2015 Community edition. All the functionality of the desktop app is available in XAML Spy for Visual Studio. With full Visual Studio support, there is no need to leave the Visual Studio environment, all the XAML Spy features are immediately available when spying an app.
Enable XAML Spy for Visual Studio, when installing the product using the XAML Spy installer. The installer includes a page for selecting the Visual Studio versions where you want to enable XAML Spy for. The following screenshot enables XAML Spy for Visual Studio 2012 and 2015. A grayed-out option indicates that particular version is not installed. In this case, Visual Studio 2013 was not found on the target system.
Tool windows
XAML Spy for Visual Studio installs three tool windows; XAML Spy Explorer, Properties, and Visualizer. The XAML Spy Explorer is the main component, and provides access to the various aspects of connected apps. The XAML Spy Properties displays the details of the object selected in the explorer. The XAML Spy Visualizer renders a bitmap of the selected visual in the explorer. All tool windows are accessible via the main menu option View, and then Other Windows.
Exploring apps
Once an app has connected to XAML Spy, it will automatically appear in the explorer. See the quick start to learn how to connect your app to XAML Spy. The following image shows the XAML Spy Explorer and Properties tool windows with a connected Windows 10 UWP app.
Expand the connected app node, to explore the various aspects of the app. Each supported platform provides a unique set of explorable content. In the screenshot above, the connected Windows 10 UWP app includes automation and visual tree hierarchies. The explorable content depends on the connected app and platform. For instance when a Xamarin Forms app connects, a Xamarin Forms node appears which enables browsing the various elements of the Xamarin Forms tree.
The explorer toolbar contains buttons for browsing the explorer hierarchy, refreshing the content of the selected node, and a button for selecting visuals in the connected app. Click the select visual button, and move your mouse to the app, and click to select a visual in the user interface. The XAML Spy explorer automatically syncs its selection with the selected visual.
Additionally a search box is included, to quickly locate objects in the various tree structure. Enter a search term in the input box, and hit enter to perform the search. The search results are shown in a hierarchical structure per connected app. Hit the back button in the toolbar to return to the main explorer content.
Visualizer
The visualizer displays a snapshot of the selected visual and renders it in an isometric projection. The visualizer toolbar includes buttons to change the camera, and provides zooming and panning capabilities. Open the visualizer context menu for additional features, such as rendering a black opaque background (useful for white content with transparent backgrounds), and saving the image to disk.
Settings
Navigate to the XAML Spy settings in Visual Studio by selecting the settings button in the XAML Spy Explorer toolbar, or using Tools > Options > XAML Spy in the Visual Studio main menu.