WPF Expander按钮设计样式,因此它位于Expander Header内

我正在使用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" ... />

调整负边距以获得所需的外观.这个解决方案比较简单,但是如果您切换到不同的系统主题,则所需的保证金可能会改变,并且您的扩展器可能不再看起来不错.

WPF Expander按钮设计样式,因此它位于Expander Header内

解决方法

猜你在找的Silverlight相关文章