XAML ensemble DataGrid au dessus de 90% de la grille, les boutons en bas 10% tous dans un tabitem

Question

J'ai un TabItem que je veux afficher un DataGrid (MahApps.Metro) dans les 90% supérieurs et 2 boutons que je veux pour afficher au fond 10% de celui-ci. Cela fonctionne lorsque la fenêtre est entièrement agrandie, mais quand ce n'est pas le cas, le scrollviewer n'est pas visible et les contrôles et les éléments disparaissent de l'écran. S'il vous plaît, aidez, j'ai été bloqué pendant des heures! Voici mon code à ce jour:

<TabItem Header="Queue" FontSize="15"> 
     <Grid> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="9*"/> 
       <RowDefinition Height="1*"/> 
      </Grid.RowDefinitions> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="77*"/> 
       <ColumnDefinition Width="24*"/> 
      </Grid.ColumnDefinitions> 
      <DataGrid x:Name="songdatagrid" VerticalAlignment="Stretch" ItemsSource="{Binding SongInfo}" VerticalScrollBarVisibility="Auto" AutoGenerateColumns="False" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" > 
       <DataGrid.Columns > 
        <DataGridTemplateColumn x:Name="songinfocolumn" Header="Song Info" Width=".6*"> 
         <DataGridTemplateColumn.CellTemplate> 
          <DataTemplate> 
           <TextBlock Text="{Binding songInfo.Text}" Uid="{Binding SongInfo.Uid}" ToolTipService.ToolTip="Double click to open song in Youtube." MouseLeftButtonDown="tb_MouseLeftButtonDown5" /> 
          </DataTemplate> 
         </DataGridTemplateColumn.CellTemplate> 
        </DataGridTemplateColumn> 
        <DataGridTemplateColumn x:Name="requestercolumn" Header="Requester" Width=".18*"> 
         <DataGridTemplateColumn.CellTemplate> 
          <DataTemplate> 
           <TextBlock Text="{Binding songReq.Text}" Uid="{Binding songReq.Uid}" ToolTipService.ToolTip="Double click to open requester's Twitch page." MouseLeftButtonDown="tb_MouseLeftButtonDown6" /> 
          </DataTemplate> 
         </DataGridTemplateColumn.CellTemplate> 
        </DataGridTemplateColumn> 
        <DataGridTemplateColumn x:Name="moveupcolumn" Header="Move Up" Width=".12*"> 
         <DataGridTemplateColumn.CellTemplate> 
          <DataTemplate> 
           <Button Width="35" Height="35" Uid="{Binding moveUp.Uid}" Style="{DynamicResource MetroCircleButtonStyle}" Click="moveup" ToolTipService.ToolTip="Click to move this song up in the list."> 
            <Rectangle Width="20" Height="20" Fill="{Binding Path=Foreground, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Button}}}"> 
             <Rectangle.OpacityMask> 
              <VisualBrush Stretch="Fill" Visual="{DynamicResource appbar_arrow_up}" /> 
             </Rectangle.OpacityMask> 
            </Rectangle> 
           </Button> 
          </DataTemplate> 
         </DataGridTemplateColumn.CellTemplate> 
        </DataGridTemplateColumn> 
        <DataGridTemplateColumn x:Name="deletecolumn" Header="Remove" Width=".12*"> 
         <DataGridTemplateColumn.CellTemplate> 
          <DataTemplate> 
           <Button Width="35" Height="35" Uid="{Binding delete.Uid}" Style="{DynamicResource MetroCircleButtonStyle}" Click="deleteSong" ToolTipService.ToolTip="Click to remove song from the list."> 
            <Rectangle Width="20" Height="20" Fill="{Binding Path=Foreground, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Button}}}"> 
             <Rectangle.OpacityMask> 
              <VisualBrush Stretch="Fill" Visual="{DynamicResource appbar_delete}" /> 
             </Rectangle.OpacityMask> 
            </Rectangle> 
           </Button> 
          </DataTemplate> 
         </DataGridTemplateColumn.CellTemplate> 
        </DataGridTemplateColumn> 
       </DataGrid.Columns> 
      </DataGrid> 
      <Button Style="{DynamicResource SquareButtonStyle}" x:Name="refresh" IsDefault="True" Background="White" Content="Refresh" Click="Button_Click" FontSize="16" Grid.Column="0" Grid.Row="1"/> 
      <Button Style="{DynamicResource SquareButtonStyle}" x:Name="clear" IsDefault="True" Background="White" Content="Clear List" Click="clearlist" FontSize="16" Grid.Column="1" Grid.Row="1"/> 
     </Grid> 
    </TabItem> 

je devais ajouter à haut pour obtenir la barre de défilement horizontale Metro travaillant sur le tabholder. Autre que cela, il y a juste plus de tabitems.

<TabControl x:Name="tabholder" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="LightBlue" 
     SelectionChanged="TabControl_SelectionChanged" > 
    <TabControl.Template> 
     <ControlTemplate TargetType="TabControl"> 
      <StackPanel> 
       <ScrollViewer HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Disabled"> 
        <TabPanel x:Name="HeaderPanel" 
          Panel.ZIndex ="1" 
          KeyboardNavigation.TabIndex="1" 
          Grid.Column="0" 
          Grid.Row="0" 
          IsItemsHost="true"/> 
       </ScrollViewer> 
       <ContentPresenter x:Name="PART_SelectedContentHost" 
             ContentSource="SelectedContent"/> 
      </StackPanel> 
     </ControlTemplate> 
    </TabControl.Template> 

Answer 1

Le StackPanel et les autres Grid panneaux que vous avez là-bas sont redondants et la cause de vos problèmes. En outre, votre Width & Height fixe dans les modèles qui ont leurs propres attributs de taille d'ensemble pour des choses comme la hauteur va donner des résultats indésirables. Vous devriez seulement besoin de quelque chose comme ceci pour accomplir votre but.

<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="9*"/> 
     <RowDefinition Height="1*"/> 
    </Grid.RowDefinitions> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*"/> 
     <ColumnDefinition Width="*"/> 
    </Grid.ColumnDefinitions> 

    <DataGrid Grid.ColumnSpan="2">...</DataGrid> 

    <Button Grid.Row="1" Content="Button 1"/> 
    <Button Grid.Row="1" Grid.Column="1" Content="Button 2"/> 

</Grid> 

Cheers!

Answer 2

Le StackPanel était à l'origine des problèmes, tout fonctionne maintenant! : D