c# - WPF 控件，节省空间

Question

我对 WPF 和 C# 还很陌生，正在尝试帮助解决一些 GUI 工作问题。我们基本上有 3 个部分，一个 LHS(左侧)[第 1 部分]，一个具有顶部和底部部分的 RHS [第 2 部分和第 3 部分]。看起来像这样

1 | 2
1 | -
1 | 3

他们想要一种通过单击按钮来缩小每个部分的方法。目前|和 - 是间隔项，可以拖动(编辑:这是使用他们不喜欢的 gridsplitter 完成的)。我做了一些研究，发现有扩展器项目和 Accordion 项目。我不知道这两种方法是否都可以用于这种情况，以及什么是最不麻烦的。在稍微尝试一下每个控件时，我想到了一些关于控件的其他问题，因为我对它们不熟悉。

扩展器: 通过缩小第 1 部分，是否会使第 2 部分和第 3 部分占据整个屏幕？或者这只能用 Accordion 来完成？ 将 <> 图标更改为 +- 图标很难/容易吗？如果是的话，有什么教程吗？

Accordion : <>可以改成+-吗？如果是的话，有什么教程吗？ 可以更改默认的蓝色吗？

TIA

Answer 1

Expander 听起来是适合您情况的选择。幸运的是，与 Accordion 控件不同，它包含在 WPF 中，开箱即用。但我发现这个问题与Accordion control相关并认为这对您有用。

要更改 Expander 切换按钮的外观，您需要修改其 control template 。更改模板以显示加号或减号而不是箭头并不是太困难。如果您访问该链接，您会发现您需要更改模板的 ExpanderToggleButton 部分。

由于您只想从使用箭头更改为使用加号/减号，因此您只需更改折叠/展开箭头的Path 数据即可。您可以看看here有关使用路径绘制简单形状的更多信息。

Here是某人修改 Expander 的控件模板的示例。它适用于外观不同的一周，但如果您决定走这条路，它应该很有用。

编辑:

非常简单的示例(不改变 ToggleButton 外观)来了解如何折叠和节省空间:

<Grid>
   <Grid.ColumnDefinitions>
       <ColumnDefinition Width="Auto" />
       <ColumnDefinition Width="Auto" />
   </Grid.ColunmDefinitions>
   <Grid.RowDefinitions>
       <RowDefinition Height="Auto" />
       <RowDefinition Height="Auto" />
   </Grid.RowDefinitions>
   <Expander Name="Section1" Grid.RowSpan="2" Grid.Colunm="0" ExpandDirection="Left">
       <!-- Stuff goes here -->
   </Expander>
   <Expander Name="Section2" Grid.RowSpan="0" Grid.Colunm="1" 
       <!-- Stuff goes here -->
   </Expander>
   <Expander Name="Section3" Grid.RowSpan="1" Grid.Colunm="0" 
       <!-- Stuff goes here -->
   </Expander>
</Grid>