9

我有一个 WPF 应用程序,我正在尝试使用 .Net v4 Visual State Manager 设置 TextBox 的样式。具体来说,我正在尝试为 MouseOver 状态设置前景和背景的颜色。

正在发生的事情是,虽然背景和边框正在完美地改变,但前景却没有。如果我使用的画笔通过 StaticResource 获得颜色,那么前景根本不会改变。如果我使用的画笔通过 DynamicResource 获得颜色,那么当我将鼠标悬停在 TextBox 上时,所有 TextBox 的前景都会发生变化。显然,要么我做错了什么,要么我想做的事情根本不可能使用 VSM(这将是相当令人失望的)。

以下是我正在使用的资源:

<Color x:Key="ControlBackgroundColor" R="178" G="178" B="178" A="255" />
<Color x:Key="ControlForegroundColor" R="0" G="0" B="0" A="255" />
<Color x:Key="BorderColor" R="127" G="127" B="127" A="255" />
<Color x:Key="MouseOverControlBackgroundColor" R="0" G="0" B="0" A="255" />
<Color x:Key="MouseOverControlForegroundColor" R="255" G="255" B="255" A="255" />
<Color x:Key="MouseOverBorderColor" R="178" G="178" B="178" A="255" />

<SolidColorBrush PresentationOptions:Freeze="True" x:Key="ControlBackgroundBrush" Color="{DynamicResource ControlBackgroundColor}" />
<SolidColorBrush PresentationOptions:Freeze="True" x:Key="ControlForegroundBrush" Color="{DynamicResource ControlForegroundColor}" />
<SolidColorBrush PresentationOptions:Freeze="True" x:Key="BorderBrush" Color="{DynamicResource BorderColor}" />

<SolidColorBrush PresentationOptions:Freeze="True" x:Key="MouseOverControlBackgroundBrush" Color="{DynamicResource MouseOverControlBackgroundColor}" />
<SolidColorBrush PresentationOptions:Freeze="True" x:Key="MouseOverControlForegroundBrush" Color="{DynamicResource MouseOverControlForegroundColor}" />
<SolidColorBrush PresentationOptions:Freeze="True" x:Key="MouseOverBorderBrush" Color="{DynamicResource MouseOverBorderColor}" />

<Style TargetType="{x:Type TextBox}" >
    <Setter Property="BorderThickness" Value="1"/>
    <Setter Property="Padding" Value="2"/>
    <Setter Property="Margin" Value="1" />
    <Setter Property="BorderBrush" Value="{DynamicResource BorderBrush}" />
    <Setter Property="Background" Value="{DynamicResource ControlBackgroundBrush}" />
    <Setter Property="Foreground" Value="{DynamicResource ControlForegroundBrush}" />

    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="TextBox">
                <Grid x:Name="RootElement">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <ColorAnimation Storyboard.TargetName="MouseOverBorder" Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" To="{DynamicResource MouseOverBorderColor}" Duration="0:0:0.3"/>
                                    <ColorAnimation Storyboard.TargetName="MouseOverBorder" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" To="{DynamicResource MouseOverControlBackgroundColor}" Duration="0:0:0.3"/>
                                    <ColorAnimation Storyboard.TargetName="PART_ContentHost" Storyboard.TargetProperty="(Foreground).(SolidColorBrush.Color)" To="{DynamicResource MouseOverControlForegroundColor}" Duration="0:0:0.3"/>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Border x:Name="Border" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="1" Opacity="1" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}">
                        <Grid x:Name="ContentGrid">
                            <Border x:Name="MouseOverBorder" BorderThickness="1" BorderBrush="Transparent" Background="Transparent">
                                <ScrollViewer x:Name="PART_ContentHost" Padding="{TemplateBinding Padding}" Foreground="{TemplateBinding Foreground}" BorderThickness="0" IsTabStop="False"/>
                            </Border>
                        </Grid>
                    </Border>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

对我来说很奇怪的是,无论我使用静态资源还是动态资源,以完全相同的方式创建和动画的背景和边框画笔都能完美地工作,但前景色却没有。

如果有人有任何想法,或者如果有更好的方法来做到这一点,我很想听听。

大卫穆林 IMA 技术

4

1 回答 1

16

VisualStateManager无法控制通过绑定设置值的属性。在您的示例中,两者BackgroundBorderBrush都设置为本地值 ( Transparent),因此 VSM 可以为它们设置动画。另一方面,Foreground使用 aTemplateBinding设置,因此如果绑定值有效,VSM 将无法对其进行动画处理。

这是 的一般限制,VisualStateManager您将在使用它的所有示例中看到它。解决该问题的典型策略是使用图层和不透明度来产生彩色动画的错觉,而实际上正在发生的是从一个元素到另一个元素的淡入淡出。这是有效的,因为您可以完全控制隐藏层,而不必将其绑定到任何东西。不幸的是,这不能满足您的需求,因为该元素不是静态的;你不能有两个文本框。

最终效果是,我认为您不能同时为文本前景色设置动画并允许用户指定前景色。

于 2011-04-24T22:57:04.400 回答