WPF Expander Button Styled so it is inside Expander Header

Question

I am using the Expander control and have styled the header as shown in the picture below:

http://www.hughgrice.com/Expander.jpg

The problem I have i

Answer 1

I see that you want to actually move the expander button into your HeaderTemplate, not just restyle it. This is easily done with FindAncestor:

First add a ToggleButton and bind its IsChecked property using FindAncestor, along these lines:

  
    
      
      

      
      ...
    
  
           

This adds an expand button inside the header template but does not hide the original button provided by the Expander. To do this I recommend you replace the Expander's ControlTemplate.

Here is a complete copy of Expander's ControlTemplate with the ToggleButton replaced with a simple ContentPresenter:

It might be used as follows:

  
    
      
        
          
          ... other header template content here ...

A simpler alternative would be to just set a negative margin in yourHeaderTemplate to cover the expander button. Instead of the ControlTemplate shown above, your DataTemplat would just contain something like this:

Adjust the negative margin to get the look you want. This solution is simpler but inferior in that if you switch to a different system theme the required margin may change and your expander may no longer look good.