Step 1 of 3: Creating an Application with a C1TreeView Control

In This Topic

In this step, you'll begin in Visual Studio to create a UWP application using TreeView for UWP.

Complete the following steps:

Select File | New | Project.
In the New Project dialog box, select Templates | Visual C# | Windows | Universal. From the templates list, select Blank App (Universal Windows). Enter a Name and click OK to create your project.
Open MainPage.xaml if it isn't already open, place the cursor between the <Grid> and </Grid> tags, and click once.
Navigate to the Toolbox and double-click the C1TreeView icon to add the treeview control to MainPage.xaml. The XAML markup will now look similar to the following:

Markup	Copy Code
<Page xmlns:Xaml="using:C1.Xaml" x:Class="C1TreeViewQuickStart.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:C1TreeViewQuickStart" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> <Xaml:C1TreeView /> </Grid> </Page>

Markup

Copy Code

<Page xmlns:Xaml="using:C1.Xaml" x:Class="C1TreeViewQuickStart.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:C1TreeViewQuickStart" xmlns:d="http://schemas.microsoft.com/expression/blend/2008"     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d">
    <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
        <Xaml:C1TreeView />
    </Grid>
</Page>

Note that the C1.Xaml namespace and <Xaml:C1TreeView /> tag have been added to the project.

Give your grid a name by adding x:Name="Tree" to the <Xaml:C1TreeView> tag and add a closing tag so that it appears similar to the following:

Markup	Copy Code
<Xaml:C1TreeView x:Name="Tree"></Xaml:C1TreeView>

By giving the control a unique identifier, you'll be able to access the C1TreeView control in code.

You've successfully created a Universal Windows application containing a C1TreeView control. In the next step, you will customize the appearance and behavior of the C1TreeView control.