[Débutant] Xaml grid responsive

Bonjour,
Je cherches depuis un petit moment déjà à comment ingencer le tout pour rendre ça le plus propre possible ainsi que le plus responsive.
Voici le code comme il est actuellement

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<Grid>
    <Grid.Effect>
        <DropShadowEffect BlurRadius="2" Direction="-90" Color="Gray" RenderingBias="Quality" ShadowDepth="0"/>
    </Grid.Effect>
    <Grid.RowDefinitions>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="auto"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Label Name="lError" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" Foreground="Red" FontStyle="Italic" FontWeight="Light"/>
 
    <Label Grid.Row="1" Grid.Column="0" Content="Username:"/>
    <Label Grid.Row="2" Grid.Column="0" Content="Password:"/>
    <Label Grid.Row="3" Grid.Column="0" Content="Profile:"/>
    <Label Grid.Row="4" Grid.Column="0" Content="Code:"/>
 
    <TextBox Name="fUser" Grid.Row="1" Grid.Column="1" Margin="2"/>
    <TextBox Name="fPass" Grid.Row="2" Grid.Column="1" Margin="2"/>
    <ComboBox Name="fProf" Grid.Row="3" Grid.Column="1" Margin="2" SelectionChanged="FProf_SelectionChanged">
        <ComboBoxItem Content="Compagnie aérienne"/>
        <ComboBoxItem Content="Tour de contrôle"/>
    </ComboBox>
    <TextBox Name="fCode" Grid.Row="4" Grid.Column="1" Margin="2" LostFocus="FCode_LostFocus" IsEnabled="False"/>
 
    <Label Grid.Row="5" Grid.Column="0" Content="Nom Complet:"/>
    <Label Grid.Row="6" Grid.Column="0" Content="Localisation:"/>
    <Label Grid.Row="7" Grid.Column="0" Content="Logo:"/>
 
    <TextBox Grid.Row="5" Grid.Column="1" Margin="2"/>
    <TextBox Grid.Row="6" Grid.Column="1" Margin="2"/>
    <TextBox Grid.Row="7" Grid.Column="1" Margin="2"/>
</Grid>

Ce que je cherches à faire est de regrouper dans un grid/autre les lignes 34 à 40.
Comme ceci

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<Grid>
    <Grid.Effect>
        <DropShadowEffect BlurRadius="2" Direction="-90" Color="Gray" RenderingBias="Quality" ShadowDepth="0"/>
    </Grid.Effect>
    <Grid.RowDefinitions>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="auto"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Label Name="lError" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" Foreground="Red" FontStyle="Italic" FontWeight="Light"/>
 
    <Label Grid.Row="1" Grid.Column="0" Content="Username:"/>
    <Label Grid.Row="2" Grid.Column="0" Content="Password:"/>
    <Label Grid.Row="3" Grid.Column="0" Content="Profile:"/>
    <Label Grid.Row="4" Grid.Column="0" Content="Code:"/>
 
    <TextBox Name="fUser" Grid.Row="1" Grid.Column="1" Margin="2"/>
    <TextBox Name="fPass" Grid.Row="2" Grid.Column="1" Margin="2"/>
    <ComboBox Name="fProf" Grid.Row="3" Grid.Column="1" Margin="2" SelectionChanged="FProf_SelectionChanged">
        <ComboBoxItem Content="Compagnie aérienne"/>
        <ComboBoxItem Content="Tour de contrôle"/>
    </ComboBox>
    <TextBox Name="fCode" Grid.Row="4" Grid.Column="1" Margin="2" LostFocus="FCode_LostFocus" IsEnabled="False"/>
 
 
    <Grid Grid.Row="5" Grid.Column="0">
        <Grid.RowDefinitions>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="auto"/>
        </Grid.RowDefinitions>
        <Label Grid.Row="0" Content="Nom Complet:"/>
        <Label Grid.Row="1" Content="Localisation:"/>
        <Label Grid.Row="2" Content="Logo:"/>
    </Grid>
    <Grid Grid.Row="5" Grid.Column="1">
        <Grid.RowDefinitions>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="auto"/>
        </Grid.RowDefinitions>
 
        <TextBox Grid.Row="0" Margin="2"/>
        <TextBox Grid.Row="1" Margin="2"/>
        <TextBox Grid.Row="2" Margin="2"/>
    </Grid>
</Grid>

Le soucis est qu'en faisant cela je me retrouves avec des Textbox taille auto qui perdent 2px. Si je fusionne les 2 grids je me retrouves avec ce que je veux sauf que les labels du grid principale ne se redimensionnent pas en fonction de la taille des labels du sous-grid (le size de label username ne prends pas la dimensions du Nom Complet qui est plus grand).

Comment puis-je donc faire pour me retrouver quasi comme le premier cas mais en pouvant regrouper les 3 derniers champs? (ces champs servent à l'inscription et je vais donc les rendre invisibles par défaut mais lorsqu'il seront visible je voudrait donc tout les champs/labels soit de même dimension et responsives.
L'idée est donc de pouvoir les regroupés pour éviter de rendre ces 3 champs + labels invisibles individuellement.

Merci d'avance