ApplicationBar Windows Phone

Question

我正面临下一个问题。这是微软的错误吗？

我有列表框和应用程序栏。

在肖像画中，所有画面都很好，在横向画面（-90）中，但在风景画（+90）中，应用程序栏会在列表框中运行 - 如何解决？

以下是问题的图片示例：

风景（-90）一切正常：http://s13.postimg.org/4cvm07ck7/image.png 风景（+90）难看：http://s13.postimg.org/rptnipsnr/Not_OK.png

我有下一个XAML代码：

<phone:PhoneApplicationPage
x:Class="RTUmobile.Home"
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"
mc:Ignorable="d"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="PortraitOrLandscape" Orientation="Portrait"
shell:SystemTray.IsVisible="True">

<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
        <TextBlock Text="RTUmobile" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
        <TextBlock Name="PageName" 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"/>
    <ListBox Name="NewsListBox" Margin="10,1,12,0" Grid.Row="1" Height="auto" RenderTransformOrigin="0.5,0.5" SelectionChanged="NewsListBox_SelectionChanged">
        <ListBox.ItemContainerStyle>
            <Style TargetType="ListBoxItem">
                <Setter Property="HorizontalContentAlignment" Value="Stretch" />
            </Style>
        </ListBox.ItemContainerStyle>
        <ListBox.RenderTransform>
            <CompositeTransform Rotation="-0.02"/>
        </ListBox.RenderTransform>
    </ListBox>
    <!--Uncomment to see an alignment grid to help ensure your controls are
        aligned on common boundaries.  The image has a top margin of -32px to
        account for the System Tray. Set this to 0 (or remove the margin altogether)
        if the System Tray is hidden.

        Before shipping remove this XAML and the image itself.-->
    <!--<Image Source="/Assets/AlignmentGrid.png" VerticalAlignment="Top" Height="800" Width="480" Margin="0,-32,0,0" Grid.Row="0" Grid.RowSpan="2" IsHitTestVisible="False" />-->
</Grid>
<phone:PhoneApplicationPage.ApplicationBar>
    <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True" Mode="Minimized">
        <shell:ApplicationBarIconButton IconUri="/Icons/home.png" IsEnabled="True" Text="1"/>
        <shell:ApplicationBarIconButton IconUri="/Icons/about.png" IsEnabled="True" Text="2"/>
        <shell:ApplicationBarIconButton IconUri="/Icons/contacts.png" IsEnabled="True" Text="3"/>
        <shell:ApplicationBarIconButton IconUri="/Icons/settings.png" IsEnabled="True" Text="4"/>
        <shell:ApplicationBar.MenuItems>
            <shell:ApplicationBarMenuItem Text="MenuItem 1"/>
            <shell:ApplicationBarMenuItem Text="MenuItem 2"/>
            <shell:ApplicationBarMenuItem Text="MenuItem 2"/>
            <shell:ApplicationBarMenuItem Text="MenuItem 2"/>
            <shell:ApplicationBarMenuItem Text="MenuItem 2"/>
            <shell:ApplicationBarMenuItem Text="MenuItem 2"/>
            <shell:ApplicationBarMenuItem Text="MenuItem 2"/>
        </shell:ApplicationBar.MenuItems>
    </shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>

Answer 1

将 ListBox 的 Horizo​​ntalAlignment 和 VerticalAlignment 属性保持为 Stretch ，这样就不会覆盖。

修改

1. 使应用程序栏的模式保持最小化，这将使其在纵向模式下始终最小化，并在横向模式下默认。此行为无法更改。

2. 要允许两个方向将supportedOrientation更改为LandscapePortrait

3. 保持对齐拉伸。

Answer 2

我不知道原因，但是当您将Mode的{​​{1}}属性设置为ApplicationBar时会发生这种情况。

删除该属性或将其设置为Default可解决重叠问题：

Minimized

但是，纵向模式下的行为将不是所需的行为，因为ApplicationBar不会被最小化。

一种可能的解决方案是使用页面的<shell:ApplicationBar IsVisible="True" IsMenuEnabled="True" Mode="Default"> ... </shell:ApplicationBar> 事件将OrientationChanged属性设置为Mode：

Minimized