WPF文本框验证客户端

Question

我做了文本框验证。

但我想在各个阶段的文本框上制作一些风格。

当我的第一次加载页面时，文本框看起来像下面的样式。

当用户开始输入值时，如果值错误，整个文本框背景将为红色。

当用户输入正确的值时，文本框具有带2PX的绿色边框

我正在使用以下风格：

  <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>

以下是我的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

一个棘手/丑陋的方法是使用故事板（可能很棘手，因为你不想要动画，但你可以将动画时间改为无限）下面是代码片段：

<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>

在某处，例如在文本中更改了事件处理程序

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!
}

你应该为你的案例创建两个故事板，并在文本中更改处理程序，告诉你什么条件，并有选择地播放故事板。