Comment obtenir l’objet StackPanel ' enfants s pour remplir l’espace au maximum vers le bas ?

Question

Je veux simplement texte flottant sur la gauche, et une aide de la boîte sur la droite.

La boîte de l'aide devrait s'étendre tout le chemin vers le bas.

Si vous sortez de l'extérieur StackPanel ci-dessous il fonctionne très bien.

Mais pour des raisons de mise en page (je suis insertion UserControls dynamiquement) j'ai besoin d'avoir de l'emballage StackPanel.

Comment puis-je obtenir la Zone de groupe à s'étendre vers le bas de la StackPanel, comme vous pouvez le voir j'ai essayé:

• VerticalAlignment="Stretch"
• VerticalContentAlignment="Stretch"
• Height="Auto"

XAML:

<Window x:Class="TestDynamic033.Test3"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Test3" Height="300" Width="600">
    <StackPanel 
        VerticalAlignment="Stretch" 
        Height="Auto">

        <DockPanel 
            HorizontalAlignment="Stretch" 
            VerticalAlignment="Stretch" 
            Height="Auto" 
            Margin="10">

            <GroupBox 
                DockPanel.Dock="Right" 
                Header="Help" 
                Width="100" 
                Background="Beige" 
                VerticalAlignment="Stretch" 
                VerticalContentAlignment="Stretch" 
                Height="Auto">
                <TextBlock Text="This is the help that is available on the news screen." TextWrapping="Wrap" />
            </GroupBox>

            <StackPanel DockPanel.Dock="Left" Margin="10" Width="Auto" HorizontalAlignment="Stretch">
                <TextBlock Text="Here is the news that should wrap around." TextWrapping="Wrap"/>
            </StackPanel>

        </DockPanel>
    </StackPanel>
</Window>

Réponse:

Merci Mark, à l'aide de DockPanel au lieu de StackPanel effacé. En général, je trouve moi-même à l'aide de DockPanel de plus en plus maintenant pour WPF layouting, voici le fixe XAML:

<Window x:Class="TestDynamic033.Test3"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Test3" Height="300" Width="600" MinWidth="500" MinHeight="200">
    <DockPanel 
        VerticalAlignment="Stretch" 
        Height="Auto">

        <DockPanel 
            HorizontalAlignment="Stretch" 
            VerticalAlignment="Stretch" 
            Height="Auto" 
            MinWidth="400"
            Margin="10">

            <GroupBox 
                DockPanel.Dock="Right" 
                Header="Help" 
                Width="100" 
                VerticalAlignment="Stretch" 
                VerticalContentAlignment="Stretch" 
                Height="Auto">
                <Border CornerRadius="3" Background="Beige">
                    <TextBlock Text="This is the help that is available on the news screen." TextWrapping="Wrap" 

                Padding="5"/>
                </Border>
            </GroupBox>

            <StackPanel DockPanel.Dock="Left" Margin="10" Width="Auto" HorizontalAlignment="Stretch">
                <TextBlock Text="Here is the news that should wrap around." TextWrapping="Wrap"/>
            </StackPanel>

        </DockPanel>
    </DockPanel>
</Window>

Answer 1

On dirait que vous voulez un StackPanel où l'élément final utilise tout l'espace restant. Mais pourquoi ne pas utiliser un DockPanel ? Décorez les autres éléments dans le DockPanel avec DockPanel.Dock="Top" , puis votre contrôle d'aide peut remplir l'espace restant.

XML:

 <DockPanel Width="200" Height="200" Background="PowderBlue">
    <TextBlock DockPanel.Dock="Top">Something</TextBlock>
    <TextBlock DockPanel.Dock="Top">Something else</TextBlock>
    <DockPanel
        HorizontalAlignment="Stretch" 
        VerticalAlignment="Stretch" 
        Height="Auto" 
        Margin="10">

      <GroupBox 
        DockPanel.Dock="Right" 
        Header="Help" 
        Width="100" 
        Background="Beige" 
        VerticalAlignment="Stretch" 
        VerticalContentAlignment="Stretch" 
        Height="Auto">
        <TextBlock Text="This is the help that is available on the news screen." 
                   TextWrapping="Wrap" />
     </GroupBox>

      <StackPanel DockPanel.Dock="Left" Margin="10" 
           Width="Auto" HorizontalAlignment="Stretch">
          <TextBlock Text="Here is the news that should wrap around." 
                     TextWrapping="Wrap"/>
      </StackPanel>
    </DockPanel>
</DockPanel>
 

Answer 2

La raison de ce qui se passe est parce que la pile du panneau de mesures de chaque élément enfant avec l'infini positif de la contrainte pour l'axe c'est l'empilement des éléments. L'enfant les contrôles de retour gros comment ils veulent être (l'infini positif n'est pas de retour valable à partir de la MeasureOverride dans un axe à l'autre) afin de renvoyer la plus petite taille où tout sera adaptée. Ils n'ont aucun moyen de savoir combien d'espace ils ont vraiment à remplir.

Si votre vue n'a pas besoin d'avoir une fonctionnalité de défilement et la réponse ci-dessus ne répondent pas à vos besoins, je vous suggère de mettre en œuvre votre propre panneau. Vous pouvez probablement dériver directement de StackPanel et puis tout ce que vous devez faire est de changer le ArrangeOverride méthode afin qu'elle divise l'espace restant entre ses éléments enfants (en leur donnant à chacun la même quantité d'espace supplémentaire). Les éléments de rendu d'amende si ils disposent de plus d'espace qu'ils voulaient, mais si vous leur donnez moins vous allez commencer à voir les pépins.

Si vous voulez être en mesure de faire défiler le tout, alors je crains que les choses vont être un peu plus difficile, parce que le ScrollViewer vous donne une quantité infinie de l'espace de travail avec qui vous met dans la même position que les éléments enfants étaient à l'origine. Dans ce cas, vous souhaiterez peut-être créer une nouvelle propriété sur votre nouveau panneau qui vous permet de spécifier la taille de la fenêtre, vous devriez être en mesure de lier cela à la ScrollViewer de la taille. L'idéal serait de mettre en œuvre IScrollInfo, mais qui commence à se compliquer si vous envisagez de mettre en œuvre correctement.

Answer 3

Une méthode alternative consiste à utiliser une grille avec une colonne et n lignes. Définissez toutes les hauteurs de lignes sur Auto et la hauteur de ligne la plus basse sur 1* .

Je préfère cette méthode parce que j'ai trouvé que les grilles ont de meilleures performances de mise en page que DockPanels, StackPanels et WrapPanels. Mais à moins que vous ne les utilisiez dans un ItemTemplate (où la mise en page est effectuée pour un grand nombre d'éléments), vous ne le remarquerez probablement jamais.