Comment conserver une zone de taille constante/relative pendant que l'utilisateur développe/réduit treeview?

Question

J'ai une fenêtre qui sera une taille variable, actuellement il est 300 x 400 comme indiqué ci-dessous.

Dans le top partie I ont une vue arborescente extensible Dans le fond partie j'ai un panneau horizontal long avec un bouton en elle.

Je veux la zone supérieure (TreeView) soit environ 95% de la hauteur, avec la zone de l'outil de bouton une constante 50 élevée.

Je veux que ces proportions restent constante que l'utilisateur se développe et réduit l'affichage des arbres (et en se dilatant en dessous de la barre d'outils bouton, je veux que le viewscroller à la pop avec un scrollbar.

Comment puis-je faire est ici le meilleur que je pouvais faire jusqu'à présent, mais la zone du bouton se déplace comme l'utilisateur a réduit l'arborescence.?

<Window x:Class="TestSize8383.Window1" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="Window1" Height="300" Width="400"> 
    <Window.Resources> 
     <Style TargetType="TreeViewItem"> 
      <Setter Property="IsExpanded" Value="True" /> 
     </Style> 
    </Window.Resources> 

    <DockPanel Background="Beige" Margin="3" LastChildFill="False"> 

     <ScrollViewer DockPanel.Dock="Top" Background="White" Margin="3"> 
      <TreeViewItem DockPanel.Dock="Top" Background="White" Header="Page 1" IsExpanded="True"> 

       <TreeViewItem Header="Part 1"> 
        <TreeViewItem Header="Paragraph 1"> 
         <TreeViewItem Header="Word 1"/> 
         <TreeViewItem Header="Word 2"/> 
        </TreeViewItem> 
        <TreeViewItem Header="Paragraph 2"> 
         <TreeViewItem Header="Word 1"/> 
         <TreeViewItem Header="Word 2"/> 
        </TreeViewItem> 
        <TreeViewItem Header="Paragraph 3"> 
         <TreeViewItem Header="Word 1"/> 
         <TreeViewItem Header="Word 2"/> 
        </TreeViewItem> 

        <TreeViewItem Header="Part 2"> 
         <TreeViewItem Header="Paragraph 1"> 
          <TreeViewItem Header="Word 1"/> 
          <TreeViewItem Header="Word 2"/> 
         </TreeViewItem> 
         <TreeViewItem Header="Paragraph 2"> 
          <TreeViewItem Header="Word 1"/> 
          <TreeViewItem Header="Word 2"/> 
         </TreeViewItem> 
         <TreeViewItem Header="Paragraph 3"> 
          <TreeViewItem Header="Word 1"/> 
          <TreeViewItem Header="Word 2"/> 
         </TreeViewItem> 
        </TreeViewItem> 


       </TreeViewItem> 
      </TreeViewItem> 
     </ScrollViewer> 

     <StackPanel DockPanel.Dock="Bottom" Background="Tan" Margin="3" Height="50"> 
      <Button Content="Previous" Margin="5"/> 
     </StackPanel> 

    </DockPanel> 
</Window> 

Answer 1

que diriez-vous à l'aide d'une grille au lieu d'utiliser un DockPanel

<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="*" /> 
     <RowDefinition Height="50" /> 
    </Grid.RowDefinitions> 

    <ScrollViewer Grid.Row="0"> 
    ... 
    </ScrollViewer> 

    <StackPanel Grid.Row="1"> 
    ... 
    </StackPanel> 
</Grid> 

Answer 2

Sur la base de la mise en page fixe que vous décrivez, j'utiliser une grille au lieu de DockPanel comme ceci:

<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="*" /> 
     <RowDefinition Height="50" /> 
    </Grid.RowDefinitions> 
    <ScrollViewer Grid.Row="0"> 
     <TreeView> 
      <!-- items excluded for brevity --> 
     </TreeView> 
    </ScrollViewer> 
    <StackPanel Grid.Row="1" Background="Tan" Margin="3"> 
     <Button Content="Previous" Margin="5" /> 
    </StackPanel> 
</Grid> 

Answer 3

Vous avez dit que le bouton doit être une hauteur constante d'environ 50 puis immédiatement après que vous parler de proportions? Je ne suis pas certain de vous avoir compris, mais voici ce que j'ai pour vous en attendant.

• Faire le DockPanel d'avoir LastChildFill = True
• Mettez le StackPanel au-dessus du ScrollViewer (premier dans le code XAML)
• Faire ScrollViewer ont VerticalScrollBarVisibility = "Auto"

Cette volonté avoir ces effets:

• La barre de boutons sera toujours visible
• La barre de défilement apparaîtra lorsque vous en aurez besoin seulement