更改Expander头ContentPresenter HorisontalAlign属性 [英] change Expander header ContentPresenter HorisontalAlign property

问题描述

我想在Expander控件中有一个自定义标题。我想要一个左对齐的标题文本和一个右对齐的图片：

 < Expander> 
< Expander.Header> 
< DockPanel LastChildFill =TrueHorizo​​ntalAlignment =Stretch> 
< TextBlock DockPanel.Dock =LeftText =Some Header Text/> 
< Image DockPanel.Dock =RightHorizo​​ntalAlignment =Right/> 
< / DockPanel> 
< /Expander.Header> 
< StackPanel> 
< ItemsPresenter /> 
< / StackPanel> 
< / Expander> 
  

不幸的是，页眉被渲染在一个默认不拉伸的元素中。该元素是ContentPresenter控件，并且默认情况下它不会伸展，因为它的HorisontalAlign值是Left。如果我将它更改为Stretch（我已经在Snoop工具中完成了这项工作），那么头部会按照我的需要进行渲染。但是，我如何从代码中更改它？

我尝试使用正确的Horizo​​ntalAlignment值将ContentPresenter样式添加到Expander资源，但不幸的是它不起作用。可能ContentPresenter应用了一些自定义样式，这就是为什么它没有抓住我的样式。我试过这样：

 < Expander.Resources> 
< Converters：TodoTypeToHeaderTextConverter x：Key =TodoTypeToHeaderTextConverter/> 
< Style TargetType =ContentPresenter> 
< Setter Property =Horizo​​ntalAlignmentValue =Stretch/> 
< / style> 
< /Expander.Resources> 
  

那么我还有什么可以尝试的？

解决方案

尝试类似于此：

XAML文件：

 < Expander Name =expHeader =testLoaded =exp_Loaded> 
< Expander.HeaderTemplate> 
< DataTemplate> 
< DockPanel LastChildFill =TrueHorizo​​ntalAlignment =Stretch> 
< TextBlock DockPanel.Dock =LeftText ={Binding}/> 
< Image Source =/ ExpanderStyle; component / animation.pngWidth =20
 DockPanel.Dock =RightHorizo​​ntalAlignment =Right/> 
< / DockPanel> 
< / DataTemplate> 
< /Expander.HeaderTemplate> 
< / Expander> 
  

代码隐藏：

  private void exp_Loaded（object sender，RoutedEventArgs e）
 {
 var tmp = VTHelper.FindChild< ContentPresenter>（sender as Expander）; 
 if（tmp！= null）
 {
 tmp.Horizo​​ntalAlignment = System.Windows.Horizo​​ntalAlignment.Stretch; 
 
 
  

  public static class VTHelper 
 {
 public static T FindChild< T>（DependencyObject parent）其中T：DependencyObject 
 { 
 if（parent == null）return null; 
 
 T childElement = null; 
 int childrenCount = VisualTreeHelper.GetChildrenCount（parent）; 
 for（int i = 0; i< childrenCount; i ++）
 {
 var child = VisualTreeHelper.GetChild（parent，i）; 
 T childType = child as T; 
 if（childType == null）
 {
 childElement = FindChild< T>（child）; 
 if（childElement！= null）
 break; 
} 
 else 
 {
 childElement =（T）child; 
休息; 
} 
} 
 return childElement; 
} 
} 
  

I want to have a custom header in the Expander control. I want to have a header text with left alignment and a picture with a right alignment:

<Expander>
    <Expander.Header>
        <DockPanel LastChildFill="True" HorizontalAlignment="Stretch">
            <TextBlock DockPanel.Dock="Left" Text="Some Header Text"/>
            <Image DockPanel.Dock="Right" HorizontalAlignment="Right"  />
         </DockPanel>
     </Expander.Header>
     <StackPanel >
         <ItemsPresenter />
     </StackPanel>
</Expander>

Unfortunately the header is rendered inside of an element which doesn't stretch horizontaly by default. That element is a ContentPresenter control, and it doesn't stretch by default because it's HorisontalAlign value is Left. If I change it to Stretch (I've done this in the Snoop tool), then the header is rendered as I want it. But how do I change it from code?

I've tried adding ContentPresenter style to Expander resources with correct HorizontalAlignment value, but unfortunately it doesn't work. Probably ContentPresenter has some custom style applied, and that's why it didn't grab my styling. I've tried it like this:

<Expander.Resources>
    <Converters:TodoTypeToHeaderTextConverter x:Key="TodoTypeToHeaderTextConverter" />
    <Style TargetType="ContentPresenter">
        <Setter Property="HorizontalAlignment" Value="Stretch" />
    </Style>
</Expander.Resources>

So what else can I try?

解决方案

Try something like that:

XAML file:

<Expander Name="exp" Header="test" Loaded="exp_Loaded">
            <Expander.HeaderTemplate>
                <DataTemplate>
                    <DockPanel LastChildFill="True" HorizontalAlignment="Stretch">
                        <TextBlock DockPanel.Dock="Left" Text="{Binding}"/>
                        <Image Source="/ExpanderStyle;component/animation.png" Width="20"
                               DockPanel.Dock="Right" HorizontalAlignment="Right" />
                    </DockPanel>
                </DataTemplate>
            </Expander.HeaderTemplate>                
        </Expander>

Code-behind:

private void exp_Loaded(object sender, RoutedEventArgs e)
        {
            var tmp = VTHelper.FindChild<ContentPresenter>(sender as Expander);
            if (tmp != null)
            {
                tmp.HorizontalAlignment = System.Windows.HorizontalAlignment.Stretch;
            }
        }

And helper class:

public static class VTHelper
    {
        public static T FindChild<T>(DependencyObject parent) where T : DependencyObject
        {
            if (parent == null) return null;

            T childElement = null; 
            int childrenCount = VisualTreeHelper.GetChildrenCount(parent); 
            for (int i = 0; i < childrenCount; i++)
            {
                var child = VisualTreeHelper.GetChild(parent, i);
                T childType = child as T; 
                if (childType == null)
                {
                    childElement = FindChild<T>(child); 
                    if (childElement != null) 
                        break;
                }
                else
                {
                    childElement = (T)child; 
                    break;
                }
            } 
            return childElement;
        }
    }

这篇关于更改Expander头ContentPresenter HorisontalAlign属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！