Building a Windows 8 RSS Reader: Listing 5

XAML markup for MainPage.

• By Eric Vogel
• 01/04/2012

<UserControl x:Class="VSMWinRTDemo.UI.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="768" d:DesignWidth="1366">

    <Grid x:Name="LayoutRoot" Background="#FF0C0C0C">
        <Grid.RowDefinitions>
            <RowDefinition Height="142"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition x:Name="ItemsColumn" Width="540"/>
            <ColumnDefinition x:Name="ContentColumn" Width="*"/>
        </Grid.ColumnDefinitions>

        <Grid x:Name="LayoutHeader" Grid.ColumnSpan="2">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>

            <StackPanel Grid.Column="1" Margin="0,8">
                <TextBlock FontSize="40">Daily Reader</TextBlock>
                <StackPanel Orientation="Horizontal">
                    <TextBlock FontSize="20">Feed URL:</TextBlock>
                    <TextBox x:Name="FeedUrl" MinWidth="450" 
                    Margin="4,0" FontSize="20"></TextBox>
                    <Button x:Name="FetchButton">Fetch</Button>
                </StackPanel>

                <TextBlock x:Name="FeedTitle" VerticalAlignment="Center" 
                Text="{Binding Path=Title}" FontSize="32" Margin="56,0,0,0" />
            </StackPanel>
        </Grid>

        <ListView x:Name="FeedListView" 
              Grid.Row="1" Margin="0,0,0,8"
              VerticalAlignment="Stretch" 
              ItemsSource="{Binding Path=Items}">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <StackPanel>
                        <TextBlock Text="{Binding Path=Title}" 
                         FontSize="20" TextWrapping="Wrap" />
                        <TextBlock Text="{Binding Path=Author}" FontSize="14" />
                        <TextBlock Text="{Binding Path=PublishedOn}" FontSize="14" />
                        <TextBlock Text="{Binding Path=Description}" 
                         FontSize="14" TextWrapping="Wrap" />
                    </StackPanel>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

        <Grid x:Name="LayoutItems"
                  DataContext="{Binding ElementName=FeedListView, Path=SelectedItem}" 
                  Grid.Column="1" Grid.Row="1" 
                  Margin="26,0,22,0">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <TextBlock x:Name="SelectedItemTitle"
                               Text="{Binding Path=Title}" 
                               TextWrapping="Wrap" Margin="0,0,0,0" FontSize="18">
            </TextBlock>
            <Border BorderBrush="LightBlue"  BorderThickness="2" Grid.Row="1" Margin="0,6,0,22">
                <WebView x:Name="RSSItemWebView" />
            </Border>
        </Grid>
    </Grid>
</UserControl>