Windows Phone应用程序栏隐藏页面内容

Question

我正在尝试Windows Phone 8的开发，并且从这里和那里的示例中窃取了一个小应用程序。 但是，我偶然发现了一个困扰不已的问题：当我向页面中添加应用程序栏（在XAML或C＃中）时，它隐藏了内容的底部，或者无法向下滚动。

我的XAML是：

<phone:PhoneApplicationPage
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:maps="clr-namespace:Microsoft.Phone.Maps.Controls;assembly=Microsoft.Phone.Maps"
xmlns:maptk="clr-namespace:Microsoft.Phone.Maps.Toolkit;assembly=Microsoft.Phone.Controls.Toolkit"
xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
x:Class="MyApp.MainPage"
mc:Ignorable="d"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True">

<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent" ScrollViewer.VerticalScrollBarVisibility="Auto">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <!--TitlePanel contains the name of the application and page title-->
    <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
        <TextBlock Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
        <TextBlock x:Name="appNameText" Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
    </StackPanel>

    <!--ContentPanel - place additional content here-->
    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">

        <maps:Map x:Name="locationMap" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="446" Height="347">
            <maptk:MapExtensions.Children>
                <maptk:Pushpin Name="MyLocation" Visibility="Collapsed" />
            </maptk:MapExtensions.Children>
        </maps:Map>
        <Button x:Name="button" Content="Button" HorizontalAlignment="Left" Margin="165,362,0,0" VerticalAlignment="Top" Width="291" />
        <TextBlock x:Name="longitudeText" HorizontalAlignment="Left" Margin="338,462,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Text="longitude placeholder"/>
        <TextBlock x:Name="latitudeText" HorizontalAlignment="Left" Margin="338,507,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Text="latitude placeholder"/>

        <toolkit:ToggleSwitch x:Name="switch1" IsChecked="True" Content="First switch" Margin="165,424,24,76"/>
        <toolkit:ToggleSwitch x:Name="switch2" Margin="114,482,24,10" Content="Second switch" IsChecked="True"/>

    </Grid>

</Grid>

以及创建应用栏的代码：

        //    // Set the page's ApplicationBar to a new instance of ApplicationBar.
        ApplicationBar = new ApplicationBar();

    //    // Create a new button and set the text value to the localized string from AppResources.
        ApplicationBarIconButton appBarButton = new ApplicationBarIconButton(new Uri("/Assets/AppBar/appbar.add.rest.png", UriKind.Relative));
        appBarButton.Text = AppResources.AppBarButtonText;
        appBarButton.Click += appBarButton_Click;
        ApplicationBar.Buttons.Add(appBarButton);

    //    // Create a new menu item with the localized string from AppResources.
        ApplicationBarMenuItem appBarMenuItem = new ApplicationBarMenuItem(AppResources.AppBarMenuItemText);
        ApplicationBar.MenuItems.Add(appBarMenuItem);

没有应用栏的结果：

并添加了应用栏：

请注意缺少交换机的标签。 （实际上，底部开关本身也被隐藏了，但是看起来好像是在漫不经心地摆弄了“固定”开关。

所以，长话短说：有人可以指出出现这种异常的原因是我做错了什么吗？

Answer 1

页面不会自动包含ScrollViewer，因此您需要在要滚动的元素周围添加一个（在您的情况下，我认为这意味着在LayoutRoot网格周围）。

ScrollViewer.VerticalScrollBarVisibility="Auto"是ScrollViewer用于确定是否可见的东西，但是由于根本没有ScrollViewer，所以它什么也不做。 （这是一个附加属性，例如，类似于Grid.Row，仅当元素位于Grid中时才有用。）

在我所知的情况下，只有一种情况是应用程序栏实际上位于页面的前面：当AppBar的不透明度不是100％时。 在这种情况下，页面实际上位于页面后面，因此您必须自己管理可见的位置/位置/方式。