<?xml version="1.0" encoding="utf-8"?>
<UserControl x:Class="C1_Demo.DemoDropDown" mc:Ignorable="d" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows" 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">

	<Grid HorizontalAlignment="Center">
		<Grid.RowDefinitions>
			<RowDefinition MinHeight="40" />
            <RowDefinition MinHeight="40" />
            <RowDefinition MinHeight="40" />
            <RowDefinition MinHeight="40" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
		<StackPanel VerticalAlignment="Center">
			<TextBlock Text="Categorized Selection" Margin="5" />
			<c1:C1DropDownButton x:Name="soccerCountries" HorizontalAlignment="Left" Padding="0">
				<c1:C1DropDownButton.Header>
					<TextBlock x:Name="selection" Text="« Pick one »" FontSize="12" Foreground="#FF3B76A2" TextAlignment="left" Margin="2 2 0 2" />
				</c1:C1DropDownButton.Header>
				<c1:C1TreeView x:Name="treeSelection" Header="Soccer World Cups Winners" KeyDown="C1TreeView_KeyDown" ItemClick="C1TreeView_ItemClicked" AllowDragDrop="False">
					<c1:C1TreeViewItem Header="South America">
						<c1:C1TreeViewItem Header="Argentina" />
						<c1:C1TreeViewItem Header="Brasil" />
						<c1:C1TreeViewItem Header="Uruguay" />
					</c1:C1TreeViewItem>
					<c1:C1TreeViewItem Header="Europe">
						<c1:C1TreeViewItem Header="England" />
						<c1:C1TreeViewItem Header="France" />
						<c1:C1TreeViewItem Header="Germany" />
						<c1:C1TreeViewItem Header="Italy" />
						<c1:C1TreeViewItem Header="Spain" />
					</c1:C1TreeViewItem>
				</c1:C1TreeView>
			</c1:C1DropDownButton>
		</StackPanel>
		<StackPanel VerticalAlignment="Center" Grid.Row="1">
			<TextBlock Text="SearchBox:" Margin="5" />
			<c1:C1DropDown x:Name="searchSymbols" FocusCuesVisibility="Collapsed" BorderThickness="0" ShowButton="False" DropDownWidth="270" Width="140" Background="#00FFFFFF" BorderBrush="#007F98A9" Height="20" HorizontalAlignment="Left">
				<c1:C1DropDown.Header>
					<c1:C1TextBoxBase x:Name="txtSymbol" TextWrapping="Wrap" TextChanged="txtSymbol_TextChanged" KeyDown="txtSymbol_KeyDown" LostFocus="txtSymbol_LostFocus" Margin="-2" />
				</c1:C1DropDown.Header>
				<Border BorderThickness="1" BorderBrush="#FF207A9C" Background="#FFEFF5FF">
					<!-- We do not use a Listbox because it swallows the clicks -->
					<ItemsControl x:Name="listBox" Margin="2 2 2 2" />
				</Border>
			</c1:C1DropDown>
		</StackPanel>
		<StackPanel VerticalAlignment="Center" Grid.Row="3">
			<TextBlock Text="C1DropDownButton" Margin="5" />
			<c1:C1DropDownButton x:Name="ddl" Header="Click Here to open the menu" HorizontalAlignment="Left">
				<c1:C1MenuList>
					<c1:C1MenuItem Header="Menu 1">
						<c1:C1MenuItem Header="Menu 1.1" />
					</c1:C1MenuItem>
					<c1:C1MenuItem Header="Menu 2" />
					<c1:C1MenuItem Header="Menu 3" />
					<c1:C1MenuItem Header="Menu 4" />
				</c1:C1MenuList>
			</c1:C1DropDownButton>
		</StackPanel>
        <StackPanel VerticalAlignment="Center" Grid.Row="2">
            <TextBlock x:Name="lblSplitButton" Text="C1SplitButton" Margin="5" />
            <c1:C1SplitButton x:Name="btn" DropDownWidth="100" DropDownHeight="100" HorizontalAlignment="Left" Click="btn_Click">
                <c1:C1DropDown.Header>
                    <StackPanel>
                        <TextBlock FontFamily="Times New Roman" FontSize="12" Text="A" FontWeight="Bold" VerticalAlignment="Top" Margin="3 0 0 -2" />
                        <Border x:Name="selectedColorBorder" Background="Red">
                            <Border.Style>
                                <Style TargetType="Border">
                                    <Setter Property="BorderThickness" Value="1" />
                                    <Setter Property="BorderBrush" Value="#FF9E9DA7" />
                                    <Setter Property="Width" Value="14" />
                                    <Setter Property="Height" Value="5" />
                                    <Setter Property="VerticalAlignment" Value="Bottom" />
                                    <Setter Property="Margin" Value="1,0,0,1" />
                                </Style>
                            </Border.Style>
                        </Border>
                    </StackPanel>
                </c1:C1DropDown.Header>
                <Border BorderThickness="1" BorderBrush="#FF207A9C" Background="#FFEFF5FF">
                    <Border.Resources>
                        <c1:ColorConverter x:Key="colorConverter" />
                    </Border.Resources>
                    <c1:C1SpectrumColorPicker ShowAlphaChannel="False" Margin="4" Color="{Binding Background, ElementName=selectedColorBorder, Mode=TwoWay, Converter={StaticResource colorConverter}}" />
                </Border>
            </c1:C1SplitButton>
        </StackPanel>
    </Grid>
</UserControl>