2.2-Breda-Tour/Breda-Tour/RouteSelectScreen/RouteSelectPage.xaml

<Page
    x:Class="Breda_Tour.RouteSelectScreen.RouteSelectPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Breda_Tour.RouteSelectScreen"
    xmlns:c="using:Breda_Tour.CustomControls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:data="using:Breda_Tour.Data"
    xmlns:con="using:Breda_Tour.RouteSelectScreen"
    mc:Ignorable="d" GotFocus="Page_GotFocus">


    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="40"/>
            <RowDefinition Height="50" />
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <c:DefaultTopBar x:Uid="RouteSelectPagetxtSelectRoute" Header="Route Selecteren"/>
        <c:DefaultPivotControl x:Name="DefaultPivot" Grid.Row="1"/>
        <RelativePanel Grid.Row="2" Padding="0,10,0,5" Background="White">
            <RelativePanel.Resources>
                <con:Converter x:Key="BoolToVis"/>
                <con:BoolToString x:Key="BoolToString"/>
            </RelativePanel.Resources>
            <ListView RelativePanel.AlignLeftWithPanel="True"
                      RelativePanel.AlignRightWithPanel="True"
                      x:Name="Routes" ItemsSource="{x:Bind CurrentRoutes}"
                      IsItemClickEnabled="True"
                      ItemClick="Routes_ItemClick"
                      HorizontalContentAlignment="Stretch">
                <ListView.ItemTemplate>
                    <DataTemplate x:DataType="data:Route">
                        <StackPanel>
                            <StackPanel Orientation="Horizontal">
                                <Image Source="ms-appx:///Assets/Map_Icon.png" Width="35" Height="35"/>
                                <TextBlock Text="{Binding Title}" FontSize="24" Margin="15,0,0,0"/>
                                <ToggleButton x:Name="toggleButton" Background="Transparent" IsChecked="False" Width="40" Height="40" Margin="35,0,0,0">
                                    <Image Source="{Binding Path=IsChecked, ElementName=toggleButton,Converter={StaticResource BoolToString}}" Height="29" Margin="-10,0,-9,-1"/>
                                </ToggleButton>
                            </StackPanel>
                            <StackPanel Orientation="Horizontal" Width="340" Visibility="{Binding Path=IsChecked, ElementName=toggleButton,Converter={StaticResource BoolToVis}}">
                                <Image Source="ms-appx:///Assets/Flag_Icon.png" Width="25" Height="25" Margin="45,0,0,0"/>
                                <TextBlock Text="Breda" Foreground="DarkGray" FontSize="16" Margin="15,0,0,0"/>
                            </StackPanel>
                            <Rectangle Height="2" HorizontalAlignment="Stretch" Fill="Gray"/>
                        </StackPanel>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </RelativePanel>
    </Grid>
</Page>