How To Use FocusTracker Control In UWP

The FocusTracker Control can be used to display information about the currently focused XAML element. FocusTracker will display the following information (when available) about the current focused XAML element Name, Type, AutomationProperties.Name and name of the first parent in the hierarchy with a name.

FocusTracker control is from UWP Community Toolkit-Developer tools. The UWP Community Toolkit is a collection of helper functions, custom controls, developer tools and app services. It simplifies and demonstrates common developer tasks building UWP apps for Windows 10.

Reading this article, you can learn how to use FocusTracker Control in Universal Windows Apps development with XAML and Visual C#.

The following important tools are required for developing UWP,

Step 1

Open Visual Studio 2017 -> Start -> New Project -> Select Windows Universal (under Visual C#) -> Blank App (Universal Windows) -> Give a suitable name for your App (UWPFocusTracker) -> OK.

After choosing the target and minimum platform version that your Windows Universal Application will support (Windows Anniversary Update (10.0.14393.0)), the Project creates App.xaml and MainPage.xaml.

Step 2

First, update the reference, Microsoft.NETCore.UniversalWindowsPlatform with the latest version, via Manage NuGet Packages

Step 3

Add the namespace and FocusTracker Control in Mainpage.xaml,

xmlns:developerTools="using:Microsoft.Toolkit.Uwp.DeveloperTools"

<developerTools:FocusTracker IsActive="True" Margin="0,0,-8,3"/>

Add the TextBlock, Button, Combobox, Checkbox, Textbox Controls and change the Name and Text Property for FocusTracker control test.