Silverlight:延伸到StackPanel中的剩余空间

时间:2009-07-07 08:55:06

标签: silverlight stackpanel

我有一个带有两个元素的垂直StackPanel:一个Button和一个ListBox。如何将ListBox拉伸到剩余的页面高度?

<StackPanel Height="Auto" Width="Auto">
    <Button Height="30" Width="100" Content="Get Content" x:Name="GetContent"/>
    <ListBox Height="Auto" Width="Auto" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/>
</StackPanel>

请注意,我使用Grid容器使其工作:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Button Width="100" Height="30" Content="Get Content" Click="OnGetContent" Grid.Row="0" Grid.Column="0"/>
    <data:DataGrid x:Name="MyContent" Margin="0,5" Grid.Row="1" Grid.Column="0"/>
</Grid>

4 个答案:

答案 0 :(得分:40)

嗯,您已经找到了解决方案;)StackPanels默认不会填充任何剩余空间,因为它们的大小始终等于其子元素的组合所需大小。 Grid是一个很好的方法,因为它会在浏览器大小更改时动态调整大小。 Mark的使用DockPanel的答案也很好。唯一的另一种方法是在父控件的大小更改时手动调整元素的大小。通常情况下,坚持使用Grids作为外部布局,然后使用StackPanels和其他控件填充它们,您应该进行设置。

答案 1 :(得分:20)

您可以使用DockPanel。将第一个项目设置为停靠顶部,将第二个项目设置为停靠填充,或使用LastChildFill属性:

<toolkit:DockPanel LastChildFill="True"
 xmlns:toolkit="http://schemas.microsoft.com/winfx/2006/xaml/presentation/toolkit">    
    <Button DockPanel.Dock="Top" Height="30" Width="100" 
     Content="Get Content" x:Name="GetContent"/>
    <ListBox Background="Azure" />
</toolkit:DockPanel>

答案 2 :(得分:15)

我同意詹姆斯的观察,即“StackPanels默认不填充任何剩余空间,因为它们的大小总是等于其子元素所需的总大小。”这正是发生的事情,但这不是预期的结果。

我可以看到为什么这条指令会将内容压缩到最小的必要空间。

<StackPanel Height="Auto" Width="Auto">

但是...... StackPanel接受一个Horizo​​ntalAlignment参数 - 如果选中该参数,则应该使堆栈面板填充其父容器的内容。这正是您设置Orientation =“Vertical”时发生的情况。请注意,在这种情况下,StackPanel将确定可用的水平空间量并将其分配给子控件。

<StackPanel Height="30" Orientation="Vertical" HorizontalAlignment="Stretch" > 
   <TextBox /> <!--TextBox fills entire space-->
</StackPanel>

仅当Orientation =“Horizo​​ntal”时,水平子尺寸才会出现故障。

<StackPanel Height="30" Orientation="Horizontal" HorizontalAlignment="Stretch" > 
   <TextBox /> <!--TextBox fills smallest space available-->
</StackPanel>

答案 3 :(得分:2)

使用UniformGrid Columns =“2”而不是StackPanel。