如何从ControlTemplate中的MultiTrigger启动ColorAnimation?

时间:2010-03-16 14:34:33

标签: wpf xaml controltemplate

我有一个WPF TabItem的以下ControlTemplate:

<ControlTemplate x:Key="DefaultTabItemTemplate" TargetType="{x:Type TabItem}">
    <ControlTemplate.Resources>
        <SolidColorBrush x:Key="UnselectedForegroundBrush" Color="#414141" />
        <!-- Unique color for this template -->
        <SolidColorBrush x:Key="SelectedForegroundBrush" Color="#457581" />
        <!-- Unique color for this template -->
        <SolidColorBrush x:Key="MouseOverTextBrush" x:Name="local_MouseOverTextBrush" Color="#FFF2F2F2"/>
    </ControlTemplate.Resources>
    <Grid>
        <Border Name="Border" MinHeight="30" Margin="0,0,0,-1" Background="{DynamicResource TabControlBackgroundBrush}" BorderBrush="{DynamicResource ndt_DisabledForegroundBrush}"  BorderThickness="1,1,1,1" CornerRadius="0,0,0,0" >
            <ContentPresenter x:Name="ContentSite" VerticalAlignment="Center" HorizontalAlignment="Center" TextElement.FontStretch="UltraExpanded" TextElement.FontWeight="UltraBlack" ContentSource="Header" Margin="12,2,12,2" RecognizesAccessKey="True" />
        </Border>
    </Grid>
    <ControlTemplate.Triggers>
        <Trigger Property="IsSelected" Value="True">
            <Setter Property="Panel.ZIndex" Value="2" />
            <Setter TargetName="Border" Property="Background" Value="{DynamicResource ndt_TabControlBackgroundBrush}" />
            <Setter TargetName="Border" Property="BorderThickness" Value="1,1,1,0" />
            <Setter TargetName="ContentSite" Property="TextElement.Foreground" Value="{StaticResource SelectedForegroundBrush}" />
        </Trigger>
        <Trigger Property="IsEnabled" Value="False">
            <Setter TargetName="Border" Property="Background" Value="{DynamicResource ndt_DisabledBackgroundBrush}" />
            <Setter TargetName="ContentSite" Property="TextElement.Foreground" Value="{DynamicResource ndt_DarkGray}" />
            <Setter Property="Foreground" Value="{DynamicResource ndt_DisabledForegroundBrush}" />
        </Trigger>
        <MultiTrigger>
            <MultiTrigger.Conditions>
                <Condition Property="IsMouseOver" Value="True" />
                <Condition Property="IsSelected" Value="False" />
            </MultiTrigger.Conditions>
            <Setter TargetName="Border" Property="Background" Value="{DynamicResource ndt_NavigationAreaBrush}" />
            <Setter TargetName="ContentSite" Property="TextElement.Foreground" Value="{DynamicResource MouseOverTextBrush}" />
        </MultiTrigger> 
    </ControlTemplate.Triggers>
</ControlTemplate>

到目前为止一切正常。模板末尾的MultiTrigger为未选择的TabItems定义鼠标悬停效果。 现在我认为这种鼠标效果的颜色变化看起来有点粗糙,所以让我们用ColorAnimation动画它。但是在孵化之前不要数鸡 - 我尝试的一切都不起作用。 也许我会监督明显的 - 但如何实现这一壮举?

提前致谢

万岁

2 个答案:

答案 0 :(得分:0)

您是否尝试过MultiTrigger.EnterActions?

在MultiTrigger中,您将拥有以下内容:

<MultiTrigger.EnterActions>
    <BeginStoryboard>
        <Storyboard>
            <ColorAnimation Storyboard.TargetName="YourObject'sName" Storyboard.TargetProperty="YourObject'sColorProperty" To="YourFavoriteColor" Duration"YourFavoriteNumber" />
        </Storyboard>
    </BeginStoryboard>
</MultiTrigger.EnterActions>

然后,如果你愿意,你可以随时添加以反转你的动画(或当你的触发不再是真的时做任何事情)

希望这有帮助!

编辑: 回答你的答案中提出的问题。 我没试过,但我不确定你能不能像那样直接为你的资源制作动画。而不是将背景设置为资源,而是将其直接设置为SolidColorBrush:

<Border Name="Border" MinHeight="30" Margin="0,0,0,-1" BorderBrush="{DynamicResource ndt_DisabledForegroundBrush}"  BorderThickness="1,1,1,1" CornerRadius="0,0,0,0" > 
    <Border.Background>
        <SolidColorBrush x:Name="local_TabControlBackgroundBrush" Color="#CBCBCB" />
    </Border.Background>
    <ContentPresenter x:Name="ContentSite" VerticalAlignment="Center" HorizontalAlignment="Center" TextElement.FontStretch="UltraExpanded" TextElement.FontWeight="UltraBlack" ContentSource="Header" Margin="12,2,12,2" RecognizesAccessKey="True" /> 
</Border> 

然后你的动画可能能够识别你的local_TabControlBackgroundBrush!

另外,我认为您可能需要将MultiTrigger移动到高于其他触发器的顶部。我认为无论何时你的MultiTrigger都是真的,你的基于IsSelected的触发器也是如此,并且因为它首先被列出所以会得到优先权。我可能是错的,但我会仔细检查一下,如果你没有收到错误,但你的多触发器仍无法正常工作。

希望它有所帮助!

答案 1 :(得分:0)

是的我之前尝试过,但在应用程序启动时遇到了运行时错误。不知道为什么,但现在我没有问题就找出了原因。你不允许像我在第一次尝试时那样在ColorAnimation中使用动态资源。因此,以下模板在启动时不会产生运行时错误:

<ControlTemplate x:Key="DefaultTabItemTemplate" TargetType="{x:Type TabItem}">
    <ControlTemplate.Resources>
        <SolidColorBrush x:Key="UnselectedForegroundBrush" Color="#414141" />
        <!-- Unique color for this template -->
        <SolidColorBrush x:Key="SelectedForegroundBrush" Color="#457581" />
        <!-- Unique color for this template -->
        <SolidColorBrush x:Key="MouseOverTextBrush" x:Name="local_MouseOverTextBrush" Color="#FFF2F2F2"/>
        <!-- Unique color for this template -->
        <SolidColorBrush x:Key="TabControlBackgroundBrush" x:Name="local_TabControlBackgroundBrush" Color="#CBCBCB" />
    </ControlTemplate.Resources>
    <Grid>
        <Border Name="Border" MinHeight="30" Margin="0,0,0,-1" Background="{DynamicResource TabControlBackgroundBrush}" BorderBrush="{DynamicResource ndt_DisabledForegroundBrush}"  BorderThickness="1,1,1,1" CornerRadius="0,0,0,0" >
            <ContentPresenter x:Name="ContentSite" VerticalAlignment="Center" HorizontalAlignment="Center" TextElement.FontStretch="UltraExpanded" TextElement.FontWeight="UltraBlack" ContentSource="Header" Margin="12,2,12,2" RecognizesAccessKey="True" />
        </Border>
    </Grid>
    <ControlTemplate.Triggers>
        <Trigger Property="IsSelected" Value="True">
            <Setter Property="Panel.ZIndex" Value="2" />
            <Setter TargetName="Border" Property="Background" Value="{DynamicResource ndt_TabControlBackgroundBrush}" />
            <Setter TargetName="Border" Property="BorderThickness" Value="1,1,1,0" />
            <Setter TargetName="ContentSite" Property="TextElement.Foreground" Value="{StaticResource SelectedForegroundBrush}" />
        </Trigger>
        <Trigger Property="IsEnabled" Value="False">
            <Setter TargetName="Border" Property="Background" Value="{DynamicResource ndt_DisabledBackgroundBrush}" />
            <Setter TargetName="ContentSite" Property="TextElement.Foreground" Value="{DynamicResource ndt_DarkGray}" />
            <Setter Property="Foreground" Value="{DynamicResource ndt_DisabledForegroundBrush}" />
        </Trigger>
        <MultiTrigger>
            <MultiTrigger.Conditions>
                <Condition Property="IsMouseOver" Value="True" />
                <Condition Property="IsSelected" Value="False" />
            </MultiTrigger.Conditions>
            <MultiTrigger.EnterActions>
                <BeginStoryboard>
                    <Storyboard>
                        <ColorAnimation Storyboard.TargetName="local_TabControlBackgroundBrush" Storyboard.TargetProperty="Color" To="{StaticResource ndt_NavigationAreaColor}" Duration="0:0:0.15" />
                    </Storyboard>
                </BeginStoryboard>
            </MultiTrigger.EnterActions>
        </MultiTrigger> 
    </ControlTemplate.Triggers>
</ControlTemplate>

但是 - 唉 - 当MultiTrigger触发时,我得到一个错误,上面写着“在名称'System.Windows.Control.ControlTemplate'中找不到名字'local_TabControlBackgroundBrush'。” (我不是来自英语国家,所以直接引用错误信息是没有用的。) 名称在模板的资源中定义 - 为什么他没找到它?