WPFエクスパンダーヘッダーのスタイルを設定するには？

Question

WPF Expanderヘッダーにスタイルを適用したいと思います。次のXAMLでは、Expanderを持っていますが、スタイルはヘッダーだけでなく、すべてのためです。

ありがとうございました。

<Page 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
Width="640" 
> 
    <StackPanel> 
     <StackPanel.Resources> 
      <Style TargetType="Expander"> 
       <Style.Resources> 
        <LinearGradientBrush x:Key="BackBrush" StartPoint="0.5,0" EndPoint="0.5,1"> 
         <GradientStop Color="#EF3132" Offset="0.1" /> 
         <GradientStop Color="#D62B2B" Offset="0.9" /> 
        </LinearGradientBrush> 
       </Style.Resources> 
       <Setter Property="Background" Value="{StaticResource BackBrush}"/> 
      </Style> 
     </StackPanel.Resources> 
     <Expander> 
      <StackPanel> 
       <TextBlock>Bike</TextBlock> 
       <TextBlock>Car</TextBlock> 
       <TextBlock>Truck</TextBlock> 
      </StackPanel> 
     </Expander> 
    </StackPanel> 
</Page> 

Answer 1

Josh SmithとMSDNからいくつかのXAMLを組み合わせて解決策が出ました。実際、コントロール（少なくともヘッダー）は再現されなければならない。

<Page 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
Width="400"> 
    <StackPanel> 
     <StackPanel.Resources> 

      <Style TargetType="Border" x:Key="RacePitBorderStyle" > 
       <Style.Resources> 
        <LinearGradientBrush x:Key="BackBrush" StartPoint="0.5,0" EndPoint="0.5,1"> 
         <GradientStop Color="#EF3132" Offset="0.1" /> 
         <GradientStop Color="#D62B2B" Offset="0.9" /> 
        </LinearGradientBrush> 
       </Style.Resources> 
       <Setter Property="Background" Value="{StaticResource BackBrush}"/> 
      </Style> 

      <DataTemplate x:Key="titleText"> 
       <Border Style="{StaticResource RacePitBorderStyle}" Height="24"> 
        <TextBlock Text="{Binding}" 
         Margin="4 0" 
         VerticalAlignment="Center" 
         Foreground="White" 
         FontSize="11" 
         FontWeight="Normal" 
         Width="{Binding 
         RelativeSource={RelativeSource 
         Mode=FindAncestor, 
         AncestorType={x:Type Expander}}, 
         Path=ActualWidth}" 
         TextWrapping="Wrap"/> 
       </Border> 
      </DataTemplate> 

      <Style TargetType="{x:Type Expander}"> 
       <Setter Property="HeaderTemplate" Value="{StaticResource titleText}"/> 
      </Style> 

     </StackPanel.Resources> 

     <Expander Name="hcontCtrl" Header="This is the header."> 
      <StackPanel> 
       <TextBox>This is a textbox</TextBox> 
       <Button>A button</Button> 
      </StackPanel> 
     </Expander> 

    </StackPanel> 
</Page> 

Answer 2

スタイルに合わせてスタイルを変えることができます。ヘッダー内のコンテンツを変更する場合は、すべてのUIをExpander.Headerプロパティに配置するだけで、ヘッダー領域に表示されます。

あなたのニーズを満たしていない場合は、おそらくコントロールを再テンプレートする必要があります。 WPFで出荷されるコントロールテンプレートを見てくださいhere

Answer 3

私はVasileの答えが正しいと思っていますが、それは元のポスターよりもはるかに多いようです。元々の質問はヘッダーの背景を変更することでした。提示された変更はそれを行いますが、他のことも行います。

これらの他のものの1つは、デフォルトの実装を置き換えることです。私はContentPresenterをTextBlockで置き換えます。後でこのスタックパネルに2番目のエクスパンダを追加するとどうなりますか？おそらく次のようなものがあります。

<Expander> 
    <Expander.Header> 
     <StackPanel> 
      <Border height="5" width="5" Foreground="Blue"/> 
      <TextBlock>Ha!</TextBlock> 
     </StackPanel> 
    </Expander.Header> 
</Expander> 

わかりませんが、良くありません。代わりに、私はこれを単純にしておきたいと思います。

<DataTemplate x:Key="expanderHeader"> 
    <ContentPresenter 
     Content={Binding} 
     TextBlock.Background={StaticResource myBrush}/> 
</DataTemplate> 

<Style TargetType="Expander"> 
    <Setter Property="HeaderTemplate" Value="{StaticResource expanderHeader}"/> 
</Style> 

このように、誰かが私たちのスタイルのエキスパンダーにテキストではないものを置くと、私たちは壊れません。あなたは、彼らはおそらく希望されるこのような背景、と何の全体を包むことを確認したい場合は、それは次のようになります。

<DataTemplate x:Key="expanderHeader"> 
    <Border Background={StaticResource myBrush}> 
     <ContentPresenter Content={Binding}/> 
    </Border> 
</DataTemplate>