使用多个WPF网格和分离器保留最小尺寸

时间:2013-09-23 16:56:57

标签: wpf grid splitter

我有一个问题,就是让网格,分离器和扩展器的排列正常工作,特别是关于设置最小高度。我已经按照这里发布的一些建议(特别是关于如何组合拆分器和扩展器),并且已经使基本架构工作,但我无法使最终细节正常工作。我确信我可以通过反复试验获得一些工作,特别是如果我在代码隐藏中做了一些暴力工作,但我猜测有一些基本的原理如何WPF调整大小的工作我是在这里失踪。

以下xaml是实际结构的简化版本,为清晰起见添加了颜色和边框。我已经删除了设置MinHeights的尝试。 (目前没有代码隐藏。)

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  Width="450"
  Height="600">
  <Grid Background="Yellow">
    <Grid.RowDefinitions>
         <RowDefinition Height="*" />
         <RowDefinition Height="Auto"/>
         <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>

    <TextBox x:Name="Tree" Grid.Row="0" Text="Tree" BorderThickness="2" BorderBrush="Red" />

    <Expander IsExpanded="True" Grid.Row="1" Header="Expand/Collapse Details" ExpandDirection="Down"
          BorderThickness="2" BorderBrush="Black" VerticalAlignment="Bottom">
      <Expander.Content>
        <Grid x:Name="LowerAreaGrid" Margin="4">
         <Grid.RowDefinitions>
             <RowDefinition Height="*"/>
             <RowDefinition Height="Auto"/>
          </Grid.RowDefinitions>

          <GridSplitter HorizontalAlignment="Stretch" Grid.Row="0" Height="8" Background="DarkGray"
                        ResizeDirection="Rows" ResizeBehavior="CurrentAndNext" />

          <Grid x:Name="DetailsPaneAndSubpane" Margin="4" Grid.Row="1">
            <Grid.RowDefinitions>
               <RowDefinition Height="*" MaxHeight="{Binding ActualHeight, ElementName=DetailsPane}"/>
               <RowDefinition Height="Auto" />
               <RowDefinition Height="*"/>
            </Grid.RowDefinitions>

              <ScrollViewer ScrollViewer.VerticalScrollBarVisibility="Auto" Grid.Row="0">

                <TextBox x:Name="DetailsPane" Text="This is the Details Pane. It is 150 pixels high. If the available space is too small, it will grow a scrollbar to see all the content." 
                    TextWrapping="Wrap" BorderThickness="4" BorderBrush="Green" Height="150"/>
              </ScrollViewer>  

              <GridSplitter Grid.Row="1" HorizontalAlignment="Stretch" Height="8" Background="Brown"
                            ResizeDirection="Rows" ResizeBehavior="PreviousAndNext" />

              <Border BorderThickness="4" Grid.Row="2" BorderBrush="Blue">    
                <Grid x:Name="SubpaneAndButtons" Margin="4" Grid.Row="1">
                  <Grid.RowDefinitions>
                     <RowDefinition Height="*" />
                     <RowDefinition Height="Auto"/>
                  </Grid.RowDefinitions>

                  <TextBox Grid.Row="0" Text="This is the Details Subpane. It can grow and shrink."
                             BorderThickness="2" BorderBrush="Blue"/>

                  <Grid x:Name="SubpaneButtons" Grid.Row="1" Background="Blue" Margin="4">
                      <Button Width="200">Do something with subpane</Button>
                  </Grid>
                </Grid>
              </Border>
           </Grid>

        </Grid>
      </Expander.Content>
    </Expander>

    <Grid x:Name="CommandButtons" Grid.Row="2" Background="Pink" Margin="4">
        <Button Width="200">Do something with whole window</Button>
    </Grid>

  </Grid>
</Page>

如您所见,窗口有两个主要区域。顶部窗格中有一棵树,当选择树中的项目时,底部区域(包含在扩展器中)显示有关该项目的详细信息。有一个分离器可以改变顶部和底部区域的相对大小。细节区域进一步分为两部分:一个具有固定最大尺寸的细节窗格和一个可以增长和缩小的底部细节子窗格。第二个拆分器控制详细信息窗格和详细信息子窗格的相对大小。

窗口底部还有一个按钮,表示一组按钮,这些按钮是适用于整个窗口的命令。详细信息子窗格底部有一个按钮,表示一组按钮,这些按钮仅适用于详细信息子窗格。

这是不起作用的:

  1. 问题:第二个(棕色)分离器最初无法向上移动。 (预计不会向下移动,因为细节窗格处于最大尺寸。)您必须稍微移动灰色分割器,然后棕色分割器工作正常,即使您将灰色分离器移回其位置是

  2. 树的MinHeight应为75.问题:当您将滑块向上拖过75像素标记时,将其放在树的RowDefinition中会导致其余内容从窗口末端滑落。 (如果没有MinHeight,当分割器向上拖过窗口顶部时会发生滑动。)

  3. 详细信息窗格和详细信息子窗格的MinHeight应为50.问题:向下移动任何一个分割器可以将这些区域压缩到零。

  4. 两个拆分器都不会影响“使用子窗格执行某些操作”按钮行。它应始终完全可见,除非扩展器折叠。问题:再次,将两个分离器向下移动可以将该区域压缩到零。

  5. 这是有效的,并且应该在所有更改后继续工作:

    1. 折叠“展开/折叠详细信息”展开器时,它会折叠除“使用整个窗口执行操作”按钮行之外的所有内容。树占用了所有剩余的空间。

    2. 详细信息窗格是固定大小(150像素)。它不能长得比它大,如果它的空间要小于它,它会生长一个滚动条,让整个150像素仍然可见。

    3. 需要进行哪些更改(在xaml或代码隐藏中)才能使其生效?

0 个答案:

没有答案