WPF Stretch ListBox высота 100% сетки.Грести?

Я пытаюсь растянуть высоту ListBox 100% высоты родительской сетки (т. е. 90% высоты родительского представления); даже если listboxes пустые. Я должен отметить, что VerticalAlignment="Stretch" похоже, не работает, поэтому я удалил его из ListBox и StackPanel элементы. На данный момент,ListBox растягивается только настолько, насколько это необходимо для размещения количества элементов, которые он содержит. Я понимаю, что определения строк должны работать, но если оба списка пусты, они оба уменьшитесь до нескольких пикселей в высоту (вместе со строками сетки). Может ли что-то заставить эти строки сжиматься, несмотря на явное объявление высоты?

<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 ответов


я смог достичь желаемой высоты, связав ListBox свойство высоты к ActualHeight из LayoutRoot Grid через XAML ниже:

<Grid x:Name="LayoutRoot" Background="LightGray">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width=".24*"/>
        <ColumnDefinition Width=".73*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height=".9*"/>
        <RowDefinition Height=".1*"/>
    </Grid.RowDefinitions>
    <ListBox Name="Subdivisions" SelectedItem="{Binding SelectedSubdivisionViewModel}" ItemsSource="{Binding Path=Subdivisions}" Grid.IsSharedSizeScope="True" Height="{Binding ElementName=LayoutRoot, Path=ActualHeight}" >

важно быть:

Height="{Binding ElementName=LayoutRoot, Path=ActualHeight}"

также достижимый через тип предка:

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

в stackpanels сделать компресс. Снимите его, и он заполнит всю высоту


код, который вы разместили, делает именно то, что объявлено в определении высоты строки родительской сетки: занимает 90% доступной высоты.

*.1 = 10% высоты
*.9 = 90% высоты

часто бывает полезно удалить беспорядок из xaml и начать с чего-то простого, чтобы помочь с макетом. Вот пример с определением столбца/строки сетки вашего кода, но с меньшим беспорядком и некоторым цветом фона, чтобы показать весь список.

  • первый список имеет несколько элементов, в то время как 2-й список имеет только несколько элементов.
  • обоих списков в первом ряду и заполнит 90% площадей.
  • вторая строка содержит сетку, которая заполняет остальную часть пространства; вы можете видеть, что она занимает 10% доступного пространства.

обратите внимание, что первое поле списка не объявляет индекс столбца или строки; когда индекс не используется, предполагается, что он равен 0, т. е., Grid.Row="0" Grid.Column=0.

<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>