Dernier élément ListBox se cache derrière la commande Barre dans Windows Phone 8.1 RT

Question

Dans ma page xaml, j'ai un ListBox, Textblocks et Textboxes générés dynamiquement dans un panneau Stack et il a aussi un "Page.BottomAppBar" qui consiste en le CommandBar à le bas de la page.

Edit Code 1: (Fourni complet code interface utilisateur XAML)

<Page> 
<ScrollViewer VerticalScrollBarVisibility="Auto"> 
    <Grid Background="White"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="60"></RowDefinition> 
      <RowDefinition Height="auto"></RowDefinition> 
     </Grid.RowDefinitions> 
     <Grid Grid.Row="0"> 
      <TextBlock Foreground="#616161" x:Name="tbHeading1" Text="Event Details" Margin="15,0,0,0" Width="auto" TextWrapping="Wrap" VerticalAlignment="Center" FontFamily="Calibri" FontSize="28" HorizontalAlignment="Left"></TextBlock> 
     </Grid> 
     <!--<ScrollViewer VerticalScrollBarVisibility="Auto" >--> 
      <Grid Grid.Row="1"> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="Auto"/> 
        <RowDefinition Height="Auto"/> 
        <RowDefinition Height="*"/> 
       </Grid.RowDefinitions> 
       <StackPanel Grid.Row="0" Background="White" Margin="0,0,0,1"> 
        <!--EVENT TYPE--> 
        <TextBlock FontFamily="Arial MT Regular" Margin="15,0,0,0" Foreground="#616161" x:Name="tbEventType" Text="Event Type" FontSize="20"></TextBlock> 
        <ComboBox x:Name="cmbEventType" RequestedTheme="Light" Padding="5,0,0,0" PlaceholderText=" - Tap for Selection - " FontSize="16" FontFamily="Calibri" Width="auto" BorderBrush="#80b656" BorderThickness="2" SelectedIndex="-1" SelectionChanged="cmbEventType_SelectionChanged" Margin="15,0"> 
         <ComboBox.ItemTemplate> 
          <DataTemplate> 
           <Grid> 
            <TextBlock x:Name="txtEventType" Text="{Binding Name}" Padding="5,0,0,0" Foreground="#80b656" FontFamily="Calibri" FontSize="20" TextAlignment="Left"/> 
           </Grid> 
          </DataTemplate> 
         </ComboBox.ItemTemplate> 
        </ComboBox> 
        <!--END EVENT TYPE--> 
        <!--SITE--> 
        <TextBlock FontFamily="Arial MT Regular" Margin="15,5,0,0" Foreground="#616161" x:Name="tbSite" Text="Site" FontSize="20"></TextBlock> 
        <ComboBox x:Name="cmbSite" RequestedTheme="Light" Padding="5,0,0,0" PlaceholderText=" - Tap for Selection - " FontSize="16" FontFamily="Calibri" Width="auto" BorderBrush="#80b656" BorderThickness="2" Margin="15,0" 
          SelectionChanged="cmbSite_SelectionChanged" SelectedIndex="-1"> 
         <ComboBox.ItemTemplate> 
          <DataTemplate> 
           <Grid> 
            <TextBlock x:Name="txtSite" Text="{Binding Name}" Padding="5,0,0,0" Foreground="#80b656" FontFamily="Calibri" FontSize="20" TextAlignment="Left"/> 
           </Grid> 
          </DataTemplate> 
         </ComboBox.ItemTemplate> 
        </ComboBox> 
        <!--END SITE--> 
        <!--LOCATION--> 
        <TextBlock FontFamily="Arial MT Regular" Margin="15,5,0,0" Foreground="#616161" x:Name="tbLocation" Text="Location" FontSize="20"></TextBlock> 
        <ComboBox x:Name="cmbLocation" RequestedTheme="Light" Padding="5,0,0,0" PlaceholderText=" - Tap for Selection - " FontSize="16" FontFamily="Calibri" Width="auto" BorderBrush="#80b656" BorderThickness="2" SelectedIndex="-1" Margin="15,0"> 
         <ComboBox.ItemTemplate> 
          <DataTemplate> 
           <Grid> 
            <TextBlock x:Name="txtLocation" Text="{Binding Location_Description}" Padding="5,0,0,0" Foreground="#80b656" FontFamily="Calibri" FontSize="20" TextAlignment="Left"/> 
           </Grid> 
          </DataTemplate> 
         </ComboBox.ItemTemplate> 
        </ComboBox> 
        <!--END LOCATION--> 
        <!--EVENT DATE--> 
        <TextBlock FontFamily="Arial MT Regular" Margin="15,5,0,0" Foreground="#616161" x:Name="tbEventDate" Text="Event Date" FontSize="20"></TextBlock> 
        <DatePicker x:Name="txtEventDate" Margin="15,0" Background="White" Foreground="#80b656" FontSize="20" BorderBrush="Silver" HorizontalAlignment="Left" Width="auto" DateChanged="txtEventDate_DateChanged"></DatePicker> 
        <!--END EVENT DATE--> 
        <Line x:Name="lineSeparator" Fill="Gray" Stroke="Gray" X2="1" Stretch="Fill" Margin="0"/> 
       </StackPanel> 

       <!--ADDITIONAL FIELDS--> 
       <Grid x:Name="spAdditionalFeilds" Grid.Row="1" Background="White" Visibility="Collapsed"> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="auto"></RowDefinition> 
         <RowDefinition Height="auto"></RowDefinition> 
         <RowDefinition Height="5"></RowDefinition> 
        </Grid.RowDefinitions> 
        <TextBlock x:Name="txtblkAdditionalFeilds" Grid.Row="0" Margin="15,0,0,0" Foreground="#616161" Text="Additional Fields" FontWeight="SemiBold" FontSize="20"></TextBlock> 
        <ListBox x:Name ="lstAdditionFields" Grid.Row="1" ItemsSource="{Binding AdditionalFieldControl, Mode=TwoWay}" ScrollViewer.VerticalScrollBarVisibility="Disabled" Foreground="Black" Background="White" HorizontalAlignment="Left" VerticalAlignment="Top" BorderThickness="1" Width="auto" Tapped="lstAdditionFields_Tapped" ScrollViewer.VerticalScrollMode="Disabled">        
         <ListBox.ItemTemplate> 
          <DataTemplate> 
           <StackPanel Margin="0,5,0,5"> 
            <TextBlock x:Name="txtCaption" FontFamily="Arial MT Regular" Margin="15,5,0,0" Text="{Binding Caption, Mode=TwoWay}" Padding="0,0,0,0" Foreground="#616161" FontSize="20" Width="auto"/> 
            <Border Margin="15,8,10,0" Padding="2,3,2,3" BorderBrush="#80b656" BorderThickness="2"> 
             <TextBlock x:Name="txtDefaultVal" FontFamily="Arial MT Regular" Text="{Binding StrDefalutValue, Mode=TwoWay}" TextWrapping="WrapWholeWords" Padding="5,0,0,0" Foreground="#80b656" FontSize="20" Loaded="txtDefaultVal_Loaded" /> 
            </Border> 
           </StackPanel> 
          </DataTemplate> 
         </ListBox.ItemTemplate> 
        </ListBox> 
        <Line x:Name="lineSeparatorAdditionalField" Grid.Row="2" Fill="Gray" Stroke="Gray" X2="1" Stretch="Fill" Margin="5,0"/> 
       </Grid> 
       <!--END OF ADDITIONAL FIELD--> 

       <!--IMAGE ATACHMENT LIST--> 
       <Grid x:Name="spImageList" Grid.Row="2" Background="White" Margin="0,12,0,0" Visibility="Collapsed"> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="auto"></RowDefinition> 
         <RowDefinition Height="auto"></RowDefinition> 
        </Grid.RowDefinitions> 
        <TextBlock x:Name="txtblkAttachmentList" Grid.Row="0" Margin="15,0,0,0" Foreground="#616161" Text="Attachment List" FontWeight="SemiBold" FontSize="20"></TextBlock> 
        <ListBox x:Name="lbAttachmentList" Grid.Row="1" ItemsSource="{Binding EventAttachment, Mode=TwoWay}" Foreground="Black" Background="White" HorizontalAlignment="Left" VerticalAlignment="Top" BorderThickness="1" Width="auto" Padding="0,0,0,40" ScrollViewer.VerticalScrollMode="Disabled" ScrollViewer.VerticalScrollBarVisibility="Disabled">       
         <ListBox.ItemTemplate> 
          <DataTemplate> 
           <!--ONE ROW--> 
           <StackPanel> 
            <Grid x:Name="attachmentStackPanel" VerticalAlignment="Center" Margin="0,5"> 
             <Grid.ColumnDefinitions> 
              <ColumnDefinition Width="150"></ColumnDefinition> 
              <ColumnDefinition Width="*"></ColumnDefinition> 
              <ColumnDefinition Width="70"></ColumnDefinition> 
             </Grid.ColumnDefinitions> 
             <Image Grid.Column="0" Margin="15,0,0,0" Source="{Binding AttachmentPath,Converter={StaticResource PathToImage}, Mode=TwoWay}" Width="110" Height="110" ></Image> 
             <TextBlock x:Name="txtName" Grid.Column="1" Width="auto" Margin="20,0,0,0" Text="{Binding Name,Mode=TwoWay}" Style="{StaticResource BodyTextBlockStyle}" Foreground="#616161" VerticalAlignment="Center" FontFamily="Calibri" FontSize="28" HorizontalAlignment="Left" Loaded="txtName_Loaded" /> 
             <AppBarButton x:Name="btnRemoveImage" Grid.Column="2" Height="50" Icon="Cancel" Width="70" VerticalAlignment="Center" Foreground="Red" Click="btnRemoveImage_Click"></AppBarButton> 
            </Grid> 
            <Line x:Name="lineSeparator" Fill="#E0E0E0" Stroke="Gray" X2="1" Stretch="Fill" Margin="5,5"/> 
           </StackPanel> 
          </DataTemplate> 
         </ListBox.ItemTemplate> 
        </ListBox> 
       </Grid> 
       <!--END IMAGE ATACHMENT LIST--> 
      </Grid> 
     <!--</ScrollViewer>--> 
    </Grid> 
</ScrollViewer> 
<Page.BottomAppBar> 
    <CommandBar x:Name="CommandBarBottom" IsSticky="False" Background="LightGray" Foreground="#616161" ClosedDisplayMode="Compact"> 
     <CommandBar.PrimaryCommands> 
      <AppBarButton x:Name="btnSaveEvent" Icon="Save" Label="Done" HorizontalAlignment="Right" Content="Save Event" Click="btnSaveEvent_Click"/> 
      <AppBarButton x:Name="btnAddAttachment" Icon="Attach" Label="Capture Img" HorizontalAlignment="Right" HorizontalContentAlignment="Right" Content="Capture Image" Click="btnAddAttachment_Click" /> 
     </CommandBar.PrimaryCommands> 
    </CommandBar> 
</Page.BottomAppBar> 

Parfois Dernière ListBox article de mon interface utilisateur (List) se cache derrière la barre de commande (pièce jointe se référer). . Donc, je ne veux pas que l'interface utilisateur se cache derrière la barre de commande.

L'interface utilisateur défile parfaitement indépendamment du chevauchement de la barre de commande. Mais parfois ce problème apparaît quand il commence à défiler derrière la barre de commande. Le ScrollViewer ne défile pas comme requis dans ce cas.

Answer 1

Il y a deux choses:

1. Je vous conseille d'utiliser un ListView au lieu d'un ListBox à moins que vous en avez besoin pour une raison particulière. Pour plus d'informations refer this.
2. L'Appbar chevauche actuellement votre contenu en raison de votre ApplicationView pour le réparer, vous pouvez vous référer à this.