<?xml version="1.0" encoding="utf-8"?>
<UserControl x:Class="GridTreeView.MainPage" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="600" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk">

    <UserControl.Resources>
        <Style TargetType="TextBlock" x:Key="title">
            <Setter Property="FontWeight" Value="Bold" />
            <Setter Property="Margin" Value="0 4 0 0" />
        </Style>
        <Style TargetType="c1:C1FlexGrid">
            <Setter Property="RowBackground" Value="White" />
            <Setter Property="AlternatingRowBackground" Value="White" />
            <Setter Property="GroupRowBackground" Value="White" />
        </Style>
    </UserControl.Resources>
    
    <Grid x:Name="LayoutRoot" Background="White">
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="auto" />
            <RowDefinition Height="auto" />
            <RowDefinition />
            <RowDefinition Height="auto" />
            <RowDefinition />
            <RowDefinition Height="auto" />
        </Grid.RowDefinitions>

        <!-- show time taken to create data -->
        <TextBlock Name="_txtPerson" Text="Ready" Grid.ColumnSpan="2" Style="{StaticResource title}" />

        <!-- Bound TreeView -->
        <TextBlock x:Name="_txtTree" Text="Ready" Grid.Row="1" Style="{StaticResource title}" />
        <sdk:TreeView x:Name="_tree" Grid.Row="2">
            <sdk:TreeView.ItemTemplate>
                <sdk:HierarchicalDataTemplate ItemsSource="{Binding Children}">
                    <TextBlock Text="{Binding Name}" />
                </sdk:HierarchicalDataTemplate>
            </sdk:TreeView.ItemTemplate>
        </sdk:TreeView>

        <!-- Bound C1FlexGrid -->
        <TextBlock x:Name="_txtFlex" Text="Ready" Grid.Column="1" Grid.Row="1" Style="{StaticResource title}" />
        <c1:C1FlexGrid x:Name="_flex" Grid.Column="1" Grid.Row="2" AutoGenerateColumns="False" ChildItemsPath="Children">
            <c1:C1FlexGrid.Columns>
                <c1:Column Header="Name" Binding="{Binding Name, Mode=TwoWay}" Width="*" />
                <c1:Column Header="Children" Binding="{Binding Children.Count}" HorizontalAlignment="Right" />
            </c1:C1FlexGrid.Columns>
        </c1:C1FlexGrid>

        <!-- Unbound TreeView -->
        <TextBlock x:Name="_txtTreeUnbound" Text="Ready" Grid.Row="3" Style="{StaticResource title}" />
        <sdk:TreeView x:Name="_treeUnbound" Grid.Row="4" />

        <!-- Unbound C1FlexGrid -->
        <TextBlock x:Name="_txtFlexUnbound" Text="Ready" Grid.Column="1" Grid.Row="3" Style="{StaticResource title}" />
        <c1:C1FlexGrid x:Name="_flexUnbound" Grid.Column="1" Grid.Row="4" AutoGenerateColumns="False">
            <c1:C1FlexGrid.Columns>
                <c1:Column Header="Name" Binding="{Binding Name, Mode=TwoWay}" Width="*" />
                <c1:Column Header="Children" Binding="{Binding Children.Count}" HorizontalAlignment="Right" />
            </c1:C1FlexGrid.Columns>
        </c1:C1FlexGrid>
        
        <!-- button bar -->
        <StackPanel Grid.Row="5" Grid.ColumnSpan="2" Orientation="Horizontal">
            <Button Name="_btnAddRoot" Content="Add Root" Padding="12 0" Margin="4 2" Click="_btnAddRoot_Click" />
            <Button Name="_btnAddChild" Content="Add Child" Padding="12 0" Margin="4 2" Click="_btnAddChild_Click" />
            <Button Name="_btnDelete" Content="Delete" Padding="12 0" Margin="4 2" Click="_btnDelete_Click" />
            <Button Name="_btnChange" Content="Change" Padding="12 0" Margin="4 2" Click="_btnChange_Click" />
        </StackPanel>
    </Grid>
</UserControl>