<Page
    x:Class="CharacterMap.Controls.FontMapPrintPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="using:CharacterMap.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    IsTabStop="False"
    RequestedTheme="Light"
    mc:Ignorable="d">

    <Grid>

        <Grid x:Name="PreviewRoot" x:Load="{x:Bind IsInAppPreview}">
            <Grid x:Name="MarginsRoot" x:Load="{x:Bind PrintModel.ShowMargins, Mode=OneWay}">
                <Border
                    Margin="{x:Bind GetMargin(PrintModel.HorizontalMargin, PrintModel.VerticalMargin), Mode=OneWay}"
                    BorderBrush="Red"
                    BorderThickness="1" />
            </Grid>
        </Grid>


        <Grid x:Name="PrintableArea" x:FieldModifier="public">
            <Border x:Name="GridLayout" x:Load="False">
                <controls:CharacterGridView
                    x:Name="ItemsPanel"
                    Margin="0 0 -8 0"
                    Padding="0"
                    ContainerContentChanging="ItemsPanel_ContainerContentChanging"
                    ItemContainerTransitions="{StaticResource NoTransitions}"
                    ItemsSource="{x:Bind Items}" />
            </Border>

            <Border x:Name="ListLayout" x:Load="False">
                <ListView
                    x:Name="ListLayoutList"
                    ContainerContentChanging="ListView_ContainerContentChanging"
                    ItemContainerTransitions="{StaticResource NoTransitions}"
                    ItemsSource="{x:Bind Items}">
                    <ListView.Resources>
                        <Style TargetType="ListViewItem">
                            <Setter Property="IsTabStop" Value="False" />
                            <Setter Property="HorizontalAlignment" Value="Stretch" />
                            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                            <Setter Property="Padding" Value="0" />
                        </Style>
                    </ListView.Resources>
                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto" />
                                    <ColumnDefinition Width="*" />
                                </Grid.ColumnDefinitions>
                                <TextBlock TextAlignment="Center" />

                                <StackPanel
                                    Grid.Column="1"
                                    Margin="12 0 0 0"
                                    HorizontalAlignment="Stretch"
                                    VerticalAlignment="Center">
                                    <!--  Unicode Index  -->
                                    <TextBlock
                                        HorizontalAlignment="Left"
                                        Foreground="#333"
                                        Style="{StaticResource CharItemUnicodeStyle}"
                                        TextWrapping="Wrap" />

                                    <!--  Glyph Description  -->
                                    <TextBlock
                                        HorizontalAlignment="Left"
                                        Foreground="#333"
                                        Style="{StaticResource CharItemUnicodeStyle}"
                                        TextWrapping="Wrap" />
                                </StackPanel>

                                <Rectangle
                                    Grid.Column="1"
                                    Width="2"
                                    HorizontalAlignment="Left"
                                    VerticalAlignment="Stretch"
                                    Fill="{StaticResource PrintBorderBrush}" />

                                <Rectangle
                                    Grid.ColumnSpan="2"
                                    Height="2"
                                    HorizontalAlignment="Stretch"
                                    VerticalAlignment="Bottom"
                                    Fill="{StaticResource PrintBorderBrush}" />
                            </Grid>
                        </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>

            </Border>

        </Grid>

    </Grid>
</Page>
