Question

在下面的示例中，我无法让ScrollViewer填充可用空间，由于上面的动态内容，高度未知，但是它是否无法填充可用空间而不是过度运行？

   <Grid x:Name="Main" Height="200" MaxHeight="200">
      <StackPanel>
         <Grid x:Name="MainContent" Height="170" MaxHeight="170">
            <StackPanel>
               <TextBlock FontSize="24" Text="Dynamic data "/>
               <TextBlock FontSize="24" Text="height "/>
               <TextBlock FontSize="24" Text="unknown... "/>
               <Grid x:Name="Results" Background="Red">
                  <ScrollViewer>
                     <StackPanel>
                        <TextBlock FontSize="24" Text="Result set... 0"/>
                        <TextBlock FontSize="24" Text="Result set... 1"/>
                        <TextBlock FontSize="24" Text="Result set... 2"/>
                        <TextBlock FontSize="24" Text="Result set... 3"/>
                     </StackPanel>
                  </ScrollViewer>
               </Grid>
            </StackPanel>
         </Grid>
         <Grid x:Name="Nav">
            <Button HorizontalAlignment="Left" Content="Back"/>
            <Button HorizontalAlignment="Right" Content="Forward"/>
         </Grid>
      </StackPanel>
   </Grid>

Answer 1

MainContent Grid中的

使用DockPanel代替StackPanel代替LastChildFill=True，如下所示：

<Grid x:Name="MainContent" Height="170" MaxHeight="170">
    <DockPanel LastChildFill="True">
        <TextBlock DockPanel.Dock="Top" FontSize="24" Text="Dynamic data "/>
        <TextBlock DockPanel.Dock="Top" FontSize="24" Text="height "/>
        <TextBlock DockPanel.Dock="Top" FontSize="24" Text="unknown... "/>
        <Grid x:Name="Results" Background="Red">
            <ScrollViewer>
                <StackPanel>
                    <TextBlock FontSize="24" Text="Result set... 0"/>
                    <TextBlock FontSize="24" Text="Result set... 1"/>
                    <TextBlock FontSize="24" Text="Result set... 2"/>
                    <TextBlock FontSize="24" Text="Result set... 3"/>
                </StackPanel>
            </ScrollViewer>
        </Grid>               
    </DockPanel>
</Grid>

然后DockPanel的最后一个元素将自己调整为可用空间

Answer 2

首先，你的布局有点混乱。为什么需要将StackPanel作为Grid的唯一子项。对于行？在处理RowDefinitions

时，请使用ColumnDefinitions和Grid

根据我对您的布局的理解，您只需Grid和DockPanel即可完成所需的一切。处理布局容器时，目标是尽可能“有效”地使用“最少”数量的容器进行布局。即使它没有任何真正的性能优势，但在通过别人的代码进行冗余嵌套时，它会有很大的帮助

<Grid x:Name="Main">
  <Grid.RowDefinitions>
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="*" />
    <RowDefinition Height="Auto" />
  </Grid.RowDefinitions>
  <TextBlock Grid.Row="0"
              FontSize="24"
              Text="Dynamic data " />
  <TextBlock Grid.Row="1"
              FontSize="24"
              Text="height " />
  <TextBlock Grid.Row="2"
              FontSize="24"
              Text="unknown... " />
  <ScrollViewer Grid.Row="3"
                Background="Red">
    <StackPanel>
      <TextBlock FontSize="24"
                  Text="Result set... 0" />
      <TextBlock FontSize="24"
                  Text="Result set... 1" />
      <TextBlock FontSize="24"
                  Text="Result set... 2" />
      <TextBlock FontSize="24"
                  Text="Result set... 3" />
    </StackPanel>
  </ScrollViewer>
  <DockPanel x:Name="Nav"
              Grid.Row="4"
              LastChildFill="False">
    <Button Content="Back"
            DockPanel.Dock="Left" />
    <Button Content="Forward"
            DockPanel.Dock="Right" />
  </DockPanel>
</Grid>

这应该可以为您提供所需的一切。如果您需要使用静态值限制Height维度，请在绝对需要时相应地添加它们。

对于“导航”DockPanel，是的，您可以使用HorizontalAlignment将Button定位为左右，从而不使用DockPanel，但是会违背尝试在“Grid单元格中保留”一个“项目并因此使用DockPanel的概念。

Answer 3

我通过为Scrollviewer的Height添加另一个元素来解决它：

<grid Grid.row="3" x:Name="Mirror">
</grid>
<ScrollViewer Grid.row="3" Height="{Binding ElementName=uxMirror,XPath=ActualHeight}">
</ScrollViewer>

使ScrollViewer填充动态区域

3 个答案: