我正在使用Expander控件,并将标题设置为如下图所示:
http://www.hughgrice.com/Expander.jpg
我遇到的问题是我希望扩展器按钮被包含在标题中,以便标题模板结尾的行与扩展器内容对齐,即我最终想要得到类似于下面的图像的东西:
http://www.hughgrice.com/Expander.gif
提前致谢.
解决方法
我看到你想实际上将扩展器按钮移动到HeaderTemplate中,而不仅仅是修复它. FindAncestor很容易实现:
首先添加一个ToggleButton并使用FindAncestor绑定它的IsChecked属性,沿着这些行:
<DataTemplate x:Key="MyHeaderTemplate"> <Border ...> <DockPanel> <!-- Expander button --> <ToggleButton IsChecked="{Binding IsExpanded,Mode=TwoWay,RelativeSource={RelativeSource FindAncestor,Header,1}}" Content=... /> <!-- Other content here --> ... </DockPanel> </Border> </DataTemplate>
这会在标题模板中添加一个扩展按钮,但不会隐藏扩展器提供的原始按钮.为此,我建议您更换Expander的ControlTemplate.
以下是使用简单的ContentPresenter替换的ToggleButton的Expander的ControlTemplate的完整副本:
<ControlTemplate x:Key="ExpanderWithoutButton" TargetType="{x:Type Expander}"> <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="3" SnapsToDevicePixels="true"> <DockPanel> <ContentPresenter Content="{TemplateBinding Header}" ContentTemplate="{TemplateBinding HeaderTemplate}" ContentTemplateSelector="{TemplateBinding HeaderTemplateSelector}" DockPanel.Dock="Top" Margin="1" Focusable="false" /> <ContentPresenter x:Name="ExpandSite" Visibility="Collapsed" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Margin="{TemplateBinding Padding}" Focusable="false" /> </DockPanel> </Border> <ControlTemplate.Triggers> <Trigger Property="IsExpanded" Value="true"> <Setter Property="Visibility" Value="Visible" TargetName="ExpandSite"/> </Trigger> <Trigger Property="IsEnabled" Value="false"> <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate>
它可能使用如下:
<Expander Template="{StaticResource ExpanderWithoutButton}"> <Expander.HeaderTemplate> <DataTemplate ...> <Border ...> <DockPanel> <ToggleButton ... IsChecked="{Binding IsExpanded,1}}" /> ... other header template content here ...
一个更简单的替代方法是在您的HeaderTemplate中设置一个负余量以覆盖扩展器按钮.而不是上面显示的ControlTemplate,您的DataTemplat将只包含以下内容:
<DataTemplate ...> <Border Margin="-20 0 0 0" ... />
调整负边距以获得所需的外观.这个解决方案比较简单,但是如果您切换到不同的系统主题,则所需的保证金可能会改变,并且您的扩展器可能不再看起来不错.