<Page
    x:Class="SparklineSamplesLib2013.RegionSales"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:SparklineSamplesLib2013"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:sp="using:C1.Xaml.Sparkline"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Grid.Resources>
            <Style TargetType="TextBlock">
                <Setter Property="FontSize" Value="16" />
            </Style>
        </Grid.Resources>
        <Grid Width="800" Margin="10">

            <Grid.RowDefinitions>
                <RowDefinition Height="30"/>
                <RowDefinition />
            </Grid.RowDefinitions>
            <Grid Background="Gray">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="100"/>
                    <ColumnDefinition Width="100"/>
                    <ColumnDefinition Width="100"/>
                    <ColumnDefinition Width="200"/>
                    <ColumnDefinition Width="150"/>
                    <ColumnDefinition Width="150"/>
                </Grid.ColumnDefinitions>
                <TextBlock Text="Region" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                <TextBlock Text="Total Sales" Grid.Column="1" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                <TextBlock Text="Net Sales" Grid.Column="2" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                <TextBlock Text="Sales Trend" Grid.Column="3" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                <TextBlock Text="Win/Loss" Grid.Column="4" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                <TextBlock Text="Profit Trend" Grid.Column="5" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center"/>
            </Grid>
            <ScrollViewer Grid.Row="1" HorizontalScrollMode="Disabled">
                <ItemsControl x:Name="RegionSalesListBox" ItemsSource="{Binding Sales}" >
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <Grid Background="#EFEFEF">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="100"/>
                                    <ColumnDefinition Width="100"/>
                                    <ColumnDefinition Width="100"/>
                                    <ColumnDefinition Width="200"/>
                                    <ColumnDefinition Width="150"/>
                                    <ColumnDefinition Width="150"/>
                                </Grid.ColumnDefinitions>
                                <TextBlock Text="{Binding State}" Foreground="#444444" FontSize="16" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="5" FontFamily="Global User Interface"/>
                                <TextBlock Text="{Binding TotalSalesFormatted}" Grid.Column="1" FontSize="16" Foreground="#444444" VerticalAlignment="Center" HorizontalAlignment="Right" Margin="5" FontFamily="Global User Interface"/>
                                <TextBlock Text="{Binding NetSales}" Grid.Column="2" FontSize="16" Foreground="#444444" VerticalAlignment="Center" HorizontalAlignment="Right" Margin="5" FontFamily="Global User Interface"/>
                                <sp:C1Sparkline Data="{Binding Data}" Grid.Column="3" Height="50" FontFamily="Global User Interface" Margin="10" ShowMarkers="True" MarkersColor="DarkBlue"/>
                                <sp:C1Sparkline Data="{Binding Data}" SparklineType="Winloss"  Grid.Column="4" Height="40" Margin="10" FontFamily="Global User Interface" SeriesColor="DarkGreen" NegativeColor="DarkRed" ShowNegative="True"/>
                                <sp:C1Sparkline Data="{Binding Data}" SparklineType="Column" Grid.Column="5" Height="50" FontFamily="Global User Interface" Margin="10" ShowHigh="True" ShowLow="True" LowMarkerColor="DarkRed" HighMarkerColor="DarkGreen"/>
                                <Border Grid.ColumnSpan="6" VerticalAlignment="Bottom" HorizontalAlignment="Stretch" BorderThickness="1" BorderBrush="#CCCCCC" />
                            </Grid>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>
            </ScrollViewer>
        </Grid>
    </Grid>
</Page>
