Problèmes de formatage WPF - Étirement et redimensionnement automatiques?

Question

Je suis très nouveau sur WPF et XAML. J'essaie de concevoir un formulaire de saisie de données de base. J'ai utilisé un panneau de pile contenant quatre autres panneaux de pile pour obtenir la mise en page que je veux. Peut-être qu'une grille serait mieux pour cela, je ne suis pas sûr.

Voici une image de ma forme en action: http://yfrog.com/7gscreenshot1impp

Et voici le code XAML qui le génère:

<Window x:Class="Test1.Window1" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="Window1" Height="224" Width="536.762"> 
    <StackPanel Height="Auto" Name="stackPanel1" Width="Auto" Orientation="Horizontal"> 
     <StackPanel Height="Auto" Name="stackPanel2" Width="Auto"> 
      <Label Height="Auto" Name="label1" Width="Auto">Patient Name:</Label> 
      <Label Height="Auto" Name="label2" Width="Auto">Physician:</Label> 
      <Label Height="Auto" Name="label3" Width="Auto">Insurance:</Label> 
      <Label Height="Auto" Name="label4" Width="Auto">Therapy Goals:</Label> 
     </StackPanel> 
     <StackPanel Height="Auto" Name="stackPanel3" Width="Auto"> 
      <TextBox Height="Auto" Name="textBox1" Width="Auto" Padding="3" Margin="1" /> 
      <TextBox Height="Auto" Name="textBox2" Width="Auto" Padding="3" Margin="1" /> 
      <TextBox Height="Auto" Name="textBox3" Width="Auto" Padding="3" Margin="1" /> 
      <TextBox Height="Auto" Name="textBox4" Width="Auto" Padding="3" Margin="1" /> 
     </StackPanel> 
     <StackPanel Height="Auto" Name="stackPanel4" Width="Auto"> 
      <Label Height="Auto" Name="label5" Width="Auto">Date:</Label> 
      <Label Height="Auto" Name="label6" Width="Auto">Patient Phone:</Label> 
      <Label Height="Auto" Name="label7" Width="Auto">Facility:</Label> 
      <Label Height="Auto" Name="label8" Width="Auto">Referring Physician:</Label> 
     </StackPanel> 
     <StackPanel Height="Auto" Name="stackPanel5" Width="Auto"> 
      <TextBox Height="Auto" Name="textBox5" Width="Auto" Padding="3" Margin="1" /> 
      <TextBox Height="Auto" Name="textBox6" Width="Auto" Padding="3" Margin="1" /> 
      <TextBox Height="Auto" Name="textBox7" Width="Auto" Padding="3" Margin="1" /> 
      <TextBox Height="Auto" Name="textBox8" Width="Auto" Padding="3" Margin="1" /> 
     </StackPanel> 
    </StackPanel> 
</Window> 

Ce que je veux vraiment est pour les zones de texte pour étirer également à remplir l'espace horizontalement. Je voudrais également que les commandes de chaque panneau de cheminée vertical se déploient uniformément lorsque la fenêtre est redimensionnée verticalement.

Est-ce que certains de vos experts peuvent m'aider?

Answer 1

StackPanel aligne toujours ses enfants contre le bord supérieur ou gauche en fonction de son orientation. Cela ressemble à ce que vous voulez est un UniformGrid où votre StackPanel externe est. Essayez ceci:

Notez que vous n'avez pas besoin de définir Width = Auto ou Height = Auto, cela est implicite.

Mais vous avez raison de dire qu'une grille est probablement meilleure (même si le XAML est moche) parce que dans cette configuration de disposition vos étiquettes pourraient facilement être désalignées par rapport aux zones de texte. Vous pouvez essayer quelque chose comme ça aussi ...

<UniformGrid Rows="1"> 

    <Grid> 

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

     <Label Grid.Row="0" Grid.Column="0" Content="Field 1" /> 
     <TextBox Grid.Row="0" Grid.Column="1" /> 


     <Label Grid.Row="1" Grid.Column="0" Content="Field 2" /> 
     <TextBox Grid.Row="1" Grid.Column="1" /> 


     <Label Grid.Row="2" Grid.Column="0" Content="Field 3" /> 
     <TextBox Grid.Row="2" Grid.Column="1" /> 

    </Grid> 

    <Grid /> <!-- repeat above --> 

    <Grid /> <!-- etc... --> 

</UniformGrid> 

Answer 2

Enlevant ce que Josh a dit, si vous avez besoin des commandes pour remplir l'espace aussi bien verticalement, vous pouvez définir des lignes « de remplissage de l'espace » pour répartir les contrôles verticalement aussi. Voici du XAML qui le démontre (j'ai ajouté des marges pour sortir les étiquettes de la bordure de la fenêtre).

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto" /> 
     <ColumnDefinition Width="*" /> 
     <ColumnDefinition Width="Auto" /> 
     <ColumnDefinition Width="*" /> 
    </Grid.ColumnDefinitions> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto" /> 
     <RowDefinition Height="*" /> 
     <RowDefinition Height="Auto" /> 
     <RowDefinition Height="*" /> 
     <RowDefinition Height="Auto" /> 
     <RowDefinition Height="*" /> 
     <RowDefinition Height="Auto" /> 
    </Grid.RowDefinitions> 
    <Label Grid.Column="0" Grid.Row="0" Margin="5">Patient Name:</Label> 
    <TextBox Grid.Column="1" Grid.Row="0" Margin="5" /> 
    <Label Grid.Column="0" Grid.Row="2" Margin="5">Physician:</Label> 
    <TextBox Grid.Column="1" Grid.Row="2" Margin="5" /> 
    <Label Grid.Column="0" Grid.Row="4" Margin="5">Insurance:</Label> 
    <TextBox Grid.Column="1" Grid.Row="4" Margin="5" /> 
    <Label Grid.Column="0" Grid.Row="6" Margin="5">Therapy Goals:</Label> 
    <TextBox Grid.Column="1" Grid.Row="6" Margin="5" /> 
    <Label Grid.Column="2" Grid.Row="0" Margin="5">Date:</Label> 
    <TextBox Grid.Column="3" Grid.Row="0" Margin="5" /> 
    <Label Grid.Column="2" Grid.Row="2" Margin="5">Patient Phone:</Label> 
    <TextBox Grid.Column="3" Grid.Row="2" Margin="5" /> 
    <Label Grid.Column="2" Grid.Row="4" Margin="5">Facility:</Label> 
    <TextBox Grid.Column="3" Grid.Row="4" Margin="5" /> 
    <Label Grid.Column="2" Grid.Row="6" Margin="5">Referring Physician:</Label> 
    <TextBox Grid.Column="3" Grid.Row="6" Margin="5" /> 
</Grid>