WPF文本框验证客户端

Question

I am did text box validation.

But i want to make some style on text box on various phase.

When my page 1st time load the textbox looks like following style.

When User start entering value and if value is wrong the entire textbox background will be RED.

When user enter right value the Text box have GREEN Border with 2PX.

I am Using Following Style :

  <Style x:Key="TxtEmailStyle" TargetType="{x:Type TextBox}">
        <Setter Property="Background" Value="#2d2f34"></Setter>
        <Setter Property="Foreground" Value="White"></Setter>
        <Setter Property="TextBlock.FontSize" Value="14" />
        <Setter Property="Padding" Value="5" />
        <Setter Property="BorderBrush" Value="Green"></Setter>
        <Setter Property="BorderThickness" Value="2"></Setter>
        <Setter Property="Validation.ErrorTemplate">
            <Setter.Value>
                <ControlTemplate>
                    <DockPanel LastChildFill="True">
                        <TextBlock DockPanel.Dock="Right" 
                        Foreground="Orange"
                        FontSize="12pt">
                        !!!!
                        </TextBlock>
                        <Border BorderBrush="Green" BorderThickness="1">
                            <AdornedElementPlaceholder />
                        </Border>
                    </DockPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <Trigger Property="IsFocused" Value="true">
                <Setter Property="Background" Value="#56585e" />
            </Trigger>
            <Trigger Property="IsMouseOver" Value="true">
                <Setter Property="Background" Value="#07839a" />
            </Trigger>
            <Trigger Property="Validation.HasError" Value="true">
                <Setter Property="ToolTip"
        Value="{Binding RelativeSource={x:Static RelativeSource.Self},
                        Path=(Validation.Errors)[0].ErrorContent}"/>
                <Setter Property="Background" Value="#cb0b38"></Setter>
            </Trigger>
            <!--<Trigger Property="Validation.HasError" Value="false">
                <Setter Property="BorderBrush" Value="Green"></Setter>
                <Setter Property="BorderThickness" Value="2"></Setter>
                <Setter Property="Background" Value="#2d2f34"></Setter>
            </Trigger>-->

        </Style.Triggers>
    </Style>

The following is my TextBox

 <TextBox x:Name="txtPlayerID"  HorizontalAlignment="Left" Height="30" TextWrapping="Wrap" 
                                     VerticalContentAlignment="Center"
                    Style="{StaticResource TxtEmailStyle}" VerticalAlignment="Top" Width="228" FontFamily="Arial Regular"
                    RenderTransformOrigin="0.408,-2.455" FontSize="14"
                                     Margin="27,0,0,0">

                                <TextBox.Text>

                                    <Binding Path="playerID" Source="{StaticResource Register}"
                          ValidatesOnDataErrors="True"     NotifyOnValidationError="True"
                         UpdateSourceTrigger="PropertyChanged">
                                        <Binding.ValidationRules>

                                            <ExceptionValidationRule/>
                                        </Binding.ValidationRules>
                                    </Binding>
                                </TextBox.Text>
                            </TextBox>

Answer 1

A tricky/ugly approach is to use a story board (might be tricky, as you don't want animation, but you can change the animation time to infinite anyway) below is the code snippet:

<Storyboard x:Key="ChangeBkColor" Storyboard.TargetProperty="(TextBox.Background)">
    <ColorAnimation Storyboard.TargetProperty="Background.Color" 
             From="Red" To="Red" Duration="0:0:10"/> <!--Change 10 secs to yours-->
</Storyboard>

And somewhere, eg in the text changed event handler

Storyboard sb = this.FindResource("ChangeBkColor") as Storyboard;
if (sb != null && SomeCondition1)  <!--SomeCondition1: for red background-->
{
     Storyboard.SetTarget(sb, this.txtPlayerID);
     sb.Begin();  // Here comes the effect!
}

You should create two story boards for your case, and in the text changed handler, tell what conditions, and selectively play the story boards.