12
votes

WPF Stretch ListBox Hauteur 100% de la grille.row?

Je tente d'étirer la hauteur d'une liste code> 100% de la hauteur de la grille mère (c'est-à-dire 90% de la hauteur de la vue parentale); Même si les boîtes de liste code> sont vides. Je dois noter que verticalalignment = "stretch" code> ne semble pas fonctionner, donc je l'ai supprimé de la liste listbox code> et stackpanel code> éléments. À l'heure actuelle, la liste code> code> ne s'étend que dans la mesure où elle doit pouvoir accueillir le nombre d'articles qu'il contient. Je comprends que les définitions de la ligne doivent fonctionner, mais si les deux listes sont vides, elles rétrécissent tous deux quelques pixels hauts (ainsi que les rangées de la grille). Pourrait faire quelque chose que ces lignes se contractent malgré la déclaration explicite de la hauteur?

<Grid.ColumnDefinitions>
        <ColumnDefinition Width=".24*"/>
        <ColumnDefinition Width=".73*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height=".9*"/>
        <RowDefinition Height=".1*"/>
    </Grid.RowDefinitions>
    <ListBox Grid.Column="0" Grid.Row="0" Name="Subdivisions" SelectedItem="{Binding SelectedSubdivisionViewModel}" ItemsSource="{Binding Path=Subdivisions}" Grid.IsSharedSizeScope="True">
        <ListBox.ItemTemplate>
            <DataTemplate>
                <StackPanel>
                    <Border BorderBrush="#FF4788c8" BorderThickness="1,1,1,1" CornerRadius="8,8,8,8">
                        <Expander IsExpanded="{Binding IsSelected, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBoxItem}}}">
                            <Expander.Header>
                                <StackPanel>
                                    <Grid>
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="*" SharedSizeGroup="col1" />
                                            <ColumnDefinition Width=".1*" SharedSizeGroup="col2" />
                                            <ColumnDefinition Width="*" SharedSizeGroup="col3" />
                                        </Grid.ColumnDefinitions>
                                        <Grid.RowDefinitions>
                                            <RowDefinition/>
                                            <RowDefinition/>
                                        </Grid.RowDefinitions>
                                        <TextBlock Grid.Column="0" Grid.Row="0">
                                            <TextBlock.Text>
                                                <MultiBinding StringFormat="Name: {0}">
                                                  <Binding Path="SubdivisionName" />
                                                  <Binding Path="SubdivisionID" />
                                                </MultiBinding>
                                            </TextBlock.Text>
                                        </TextBlock>
                                        <TextBlock Grid.Column="2" Grid.Row="0">
                                            <TextBlock.Text>
                                                <MultiBinding StringFormat="ID: {0}">
                                                  <Binding Path="SubdivisionName" />
                                                  <Binding Path="SubdivisionID" />
                                                </MultiBinding>
                                            </TextBlock.Text>
                                        </TextBlock>
                                        <TextBlock Grid.Column="2" Grid.Row="1">
                                            <TextBlock.Text>
                                                <MultiBinding StringFormat="ID: {0}">
                                                  <Binding Path="SubdivisionName" />
                                                  <Binding Path="SubdivisionID" />
                                                </MultiBinding>
                                            </TextBlock.Text>
                                        </TextBlock>
                                    </Grid>
                                </StackPanel>
                            </Expander.Header>
                            <StackPanel>
                                <Grid>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="*"/>
                                        <ColumnDefinition/>
                                        <ColumnDefinition/>
                                    </Grid.ColumnDefinitions>
                                    <Grid.RowDefinitions>
                                        <RowDefinition />
                                        <RowDefinition />
                                    </Grid.RowDefinitions>
                                    <TextBlock Text="{Binding ElementName=SubdivisionID}" />
                                    <TextBlock Text="{Binding Path=SubdivisionID}" />
                                </Grid>
                            </StackPanel>
                        </Expander>
                    </Border>
                </StackPanel>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>


3 commentaires

Que voyez-vous à la place? Lorsque j'affiche ceci, la liste de liste est de 90% de la hauteur de la fenêtre, ce qui est ce que je m'attends à voir dans une rangée avec .


Il semblerait que la première ligne ne respecte pas la définition de hauteur de 90%.


Dans mon cas, il y avait un style sur le groupbox dans un dictionnaire de ressources référencé par app.xaml . Le verticalalignment a été défini sur haut . J'ai défini la propriété localement sur étirement . Cela ne répond pas à la question, mais peut aider quelqu'un avec un problème similaire.


3 Réponses :


2
votes

Le code que vous avez posté fait exactement ce que la définition de la hauteur de la ligne de la ligne du parent a déclaré: Prendre 90% de la hauteur disponible.

*. 1 = 10% de hauteur
* .9 = 90% de la hauteur p>

souvent son utile pour retirer le fouillis de la XAML et commencer avec quelque chose de simple à aider avec la mise en page. Voici un échantillon avec la définition de la colonne de la grille de votre code de votre code, mais avec moins de fouilles et de la couleur de fond pour afficher la liste complète de la liste. p>

  • La première liste contient plusieurs éléments, tandis que la 2e ListBox n'a que quelques articles. li>
  • Les deux boîtes de liste sont dans la première rangée et remplissent 90% de l'espace disponible. li>
  • La 2e rangée contient une grille qui remplit le reste de l'espace; Vous pouvez voir qu'il faut 10% de l'espace disponible. Li> ul>

    Notez que la première liste de liste ne déclare pas d'indice de colonne ou de ligne; Lorsqu'aucun index n'est utilisé, il est supposé être 0, c'est-à-dire grid.row = "0" grid.column = 0 code>. P>

    <Grid Background="Red">
    
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width=".24*"/>
            <ColumnDefinition Width=".73*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height=".9*"/>
            <RowDefinition Height=".1*"/>
        </Grid.RowDefinitions>
    
        <ListBox Background="LightGray"
                 ItemsSource="{x:Static Fonts.SystemFontFamilies}"/>
    
        <ListBox Grid.Column="1" Grid.Row="0" Background="LightSlateGray">
            <ListBoxItem>John</ListBoxItem>
            <ListBoxItem>Jane</ListBoxItem>
            <ListBoxItem>Fido</ListBoxItem>
        </ListBox>
    
        <Grid Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" Background="Tomato" />
    
    </Grid>
    


3 commentaires

J'apprécie la tentative, mais la raison pour laquelle il semble correct est que vous avez rempli la liste de gauche avec suffisamment d'articles pour maximiser la hauteur de la ligne de grille de 90% déclarée. J'en ai besoin pour étirer toute la hauteur de la grille par «même si les listes sont vides».


@alan - pas du tout. Prenez la première liste de liste et la liste 2ND ListBox remplira toujours l'ensemble de l'espace vertical. Je ne sais pas pourquoi cela est en train d'être voté.


@alan - Prenez mon exemple, passez-le. Les deux boîtes de liste se développent pour remplir la hauteur entière. Ensuite, prenez la première liste de liste de la liste XAML (celle liée aux polices), exécutez l'exemple et la liste de liste 2ND remplit toujours la hauteur entière.



35
votes

J'ai pu atteindre la hauteur souhaitée en reliant la propriété listbox code> de la propriété code> de la "code> de la layouroto grille code> via XAML ci-dessous: xxx pré>

le bit important étant: p> xxx pré>

également réalisable via Type d'ancêtre: P>

Height="{Binding Path=ActualHeight, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Grid}}}"


1 commentaires

Si vous souhaitez la hauteur de la hauteur de la liste de la même manière que la ligne, nommez la ligne quelque chose. Ensuite, dans la reliure , modifiez ellementName à votre nom.



13
votes

Les packages le font compresser. Retirez-le et il remplira la pleine hauteur


0 commentaires