方向更改时XAML元素响应宽度

Question

我正在构建一个Windows 8.1 Universal应用程序。关于手机的方向变化，外部＆＃34;网格＆＃34;当手机切换到横向模式时，元素的宽度不会改变（反之亦然，如果应用程序最初以横向打开 - 当方向=纵向时不会改变宽度）。 Width绑定到PivotItem Width，而PivotItem会在方向更改时填充整个屏幕，但Grid则不会。

<Page x:Name="page"
    x:Class="App1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1"
    xmlns:m="using:App1.Models"
    xmlns:vm="using:App1.ViewModels"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    DataContext="{Binding DefaultViewModel, RelativeSource={RelativeSource Self}}"
    mc:Ignorable="d">
    <Page.BottomAppBar>
        <CommandBar Foreground="White" Background="{StaticResource CustomResource}">
            <AppBarButton x:Name="BackButton" Label="Back" HorizontalAlignment="Center" 
                          Click="BackButton_Click" Icon="Back" />
            <AppBarButton x:Name="ForwardButton" Label="Forward" HorizontalAlignment="Center" 
                          Click="ForwardButton_Click" Icon="Forward" />
            <AppBarButton x:Name="HomeButton" Label="Home" HorizontalAlignment="Center" 
                          Click="HomeButton_Click" Icon="Home" />
            <AppBarButton x:Name="SettingsButton" Label="Settings" HorizontalAlignment="Center" 
                          Click="SettingsButton_Click" Icon="Setting" />
        </CommandBar>
    </Page.BottomAppBar>

    <Page.Resources>
        <DataTemplate x:Key="myHeader">
            <TextBlock Text="{Binding}" FontFamily="CustomFont" />
        </DataTemplate>
        <Style x:Key="PivotStyle" TargetType="Pivot">
            <Setter Property="HeaderTemplate" Value="{StaticResource myHeader}"/>
        </Style>
        <!--<dict:NumberConverter x:Key="myNumberConverter" />-->
    </Page.Resources>

    <d:Page.DataContext>
        <vm:DesignTimeDataSample />
    </d:Page.DataContext>

    <Grid>
        <Pivot x:Name="MyPivot" 
               Style="{StaticResource PivotStyle}" 
               Background="{StaticResource CustomItem}" 
               SelectionChanged="MyPivot_SelectionChanged" 
               Foreground="Purple"
               Grid.Row="1">
            <PivotItem x:Name="Feed" 
                        Header="news feed" 
                        FontFamily="CustomFont">
                <ScrollViewer Name="ScrollViewer">
                    <StackPanel x:Name="stackPanel">
                        <ListView ItemsSource="{Binding TileStories}" x:Name="cont" Margin="0,10,0,10" Background="{StaticResource CustomItem}" BorderBrush="{StaticResource CustomItem}" Foreground="{StaticResource CustomItem}">
                            <ListView.ItemContainerStyle>
                                <Style TargetType="ListViewItem">
                                    <Setter Property="HorizontalAlignment" Value="Stretch" />
                                    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                                    <Setter Property="MinHeight" Value="0" />
                                    <Setter Property="Margin" Value="0,10,0,10" />
                                    <Setter Property="Foreground" Value="{StaticResource CustomItem}" />
                                </Style>
                            </ListView.ItemContainerStyle>
                            <ListView.ItemTemplate>
                                <DataTemplate>
                                    <Border CornerRadius="20" BorderThickness="0" Background="White" HorizontalAlignment="Stretch">
                                        <StackPanel Height="160" Orientation="Horizontal">
                                            <Grid HorizontalAlignment="Stretch" Width="{Binding ActualWidth, ElementName=Feed, Mode=OneWay}">
                                                <Grid.ColumnDefinitions>
                                                    <ColumnDefinition Width="*" />
                                                    <ColumnDefinition Width="2*" />
                                                </Grid.ColumnDefinitions>
                                                <Grid Grid.Column="0">
                                                    <Image Source="{Binding ImagePath}" Margin="20"/>
                                                </Grid>
                                                <Grid Grid.Column="1">
                                                    <Grid.RowDefinitions>
                                                        <RowDefinition Height="2*" />
                                                        <RowDefinition Height="*" />
                                                    </Grid.RowDefinitions>
                                                    <Grid Grid.Row="0" Margin="0,0,0.333,53" Grid.RowSpan="2" HorizontalAlignment="Stretch">
                                                        <TextBlock VerticalAlignment="Center" 
                                                            LineStackingStrategy="BlockLineHeight" 
                                                            LineHeight="20" MaxHeight="80" 
                                                            TextWrapping="WrapWholeWords"
                                                            Text="{Binding Headline}" FontSize="18" 
                                                            FontFamily="CustomItem" />
                                                    </Grid>
                                                    <Grid Grid.Row="1" Margin="0,0.333,0.333,0">
                                                        <Grid.ColumnDefinitions>
                                                            <ColumnDefinition Width="2*"/>
                                                            <ColumnDefinition Width="*"/>
                                                        </Grid.ColumnDefinitions>
                                                        <Grid Grid.Column="0">
                                                            <TextBlock VerticalAlignment="Center" 
                                                    HorizontalAlignment="Left" 
                                                    Margin="5" Text="{Binding Date}" 
                                                    Foreground="#FFBDBDBD" 
                                                    FontFamily="CustomItem"  />
                                                        </Grid>
                                                        <Grid Grid.Column="1">
                                                            <AppBarButton
                                                        Style="{StaticResource CustomItem}"
                                                        VerticalAlignment="Center" 
                                                        Margin="0,0,0,2" 
                                                        HorizontalAlignment="Right" 
                                                        Icon="Read" 
                                                        CommandParameter="{Binding Url}" 
                                                        Click="StoryButton_Click" FontFamily="Global User Interface"/>
                                                        </Grid>
                                                    </Grid>

                                                </Grid>
                                            </Grid>
                                        </StackPanel>
                                    </Border>
                                </DataTemplate>
                            </ListView.ItemTemplate>
                        </ListView>
                        <Button Foreground="White" Content="Send Notification" Grid.Row="0" HorizontalAlignment="Stretch" Name="ToastButton" Click="ToastButton_Click" Margin="0,0,0,25.333"/>
                    </StackPanel>
                </ScrollViewer>
            </PivotItem>
            <PivotItem x:Name="News" Header="news">
                <WebView x:Name="MyWebView" NavigationCompleted="MyWebView_NavigationCompleted"/>
            </PivotItem>
        </Pivot>
    </Grid>
</Page>