在 VisualState 中将 TextBox 前景更改为焦点

Question

我想使用Resources 中的VisualState 更改Silverlight3 中的TextBox 的Foreground。下面的代码是我迄今为止尝试过的。但它没有用。请指导我。

<TextBox x:Name="EmailTextBox" Text="{Binding UserName, Mode=TwoWay}"
    Grid.Row="0" Grid.Column="1" Style="{StaticResource TextBoxEmailStyle}"/>

这里是上面TextBox 的引用Style：

<Style x:Key="TextBoxEmailStyle" TargetType="TextBox">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="TextBox">
                <Grid x:Name="RootElement">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="FocusStates">
                            <VisualStateGroup.Transitions>
                                <VisualTransition GeneratedDuration="0:0:0.3"/>
                            </VisualStateGroup.Transitions>
                            <VisualState x:Name="Focused">
                                <Storyboard>
                                  <ColorAnimation
                                    Duration="0" To="#00000000"
                        Storyboard.TargetName="ContentElement"
                        Storyboard.TargetProperty="(ContentElement.Foreground).
                            (SolidColorBrush.Color)"/>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Border x:Name="Border"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        Background="{TemplateBinding Background}"
                        Opacity="1">
                        <Grid>
                          <Border x:Name="ReadOnlyVisualElement"
                              Background="#5EC9C9C9"
                              Opacity="0"/>
                          <Border x:Name="MouseOverBorder"
                              BorderBrush="Transparent"
                              BorderThickness="1">
                              <StackPanel Orientation="Horizontal">
                                  <Image
                                      Width="40"
                                      Source="/Images/sign_in_email.png"
                                      Margin="5,5,5,5"/>
                                  <ScrollViewer x:Name="ContentElement"
                                      BorderThickness="0"
                                      IsTabStop="False"
                                      Padding="{TemplateBinding Padding}"
                                      VerticalAlignment="Center"
                                      Margin="4"/>
                              </StackPanel>
                          </Border>
                        </Grid>
                    </Border>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Answer 1

您的 Storyboard.TargetProperty 不正确，您需要提供默认状态“未聚焦”而不更改 Foreground（否则您永远无法恢复“正常”）。

<VisualState x:Name="Unfocused"/>
<VisualState x:Name="Focused">
    <Storyboard>
        <ColorAnimation Duration="0" To="#00000000"
            Storyboard.TargetName="ContentElement"
            Storyboard.TargetProperty="(Control.Foreground).(SolidColorBrush.Color)"/>
    </Storyboard>
</VisualState>

顺便说一句：颜色#00000000 将不可见，也许您想将其更改为#FF000000

并确保 Foreground 默认设置为 SolidColorBrush 实例：

<ScrollViewer x:Name="ContentElement" Foreground="White" ... />

通常，当您想要更改控件的Template 时，您将包括为此控件定义的所有VisualStates。所以尝试添加这些状态，可能VisualState更新方法退出，因为the other TextBox states没有定义。

<VisualStateManager.VisualStateGroups>
    <VisualStateGroup x:Name="FocusStates">
        <VisualState x:Name="Focused">...</VisualState>
        <VisualState x:Name="Unfocused"/>
    </VisualStateGroup>
    <VisualStateGroup x:Name="CommonStates">
        <VisualState x:Name="Normal"/>
        <VisualState x:Name="MouseOver"/>
        <VisualState x:Name="Disabled"/>
        <VisualState x:Name="ReadOnly"/>
    </VisualStateGroup>
    <VisualStateGroup x:Name="ValidationStates">
        <VisualState x:Name="Valid"/>
        <VisualState x:Name="InvalidFocused"/>
        <VisualState x:Name="InvalidUnfocused"/>
    </VisualStateGroup>
</VisualStateManager.VisualStateGroups>

编辑： 好的，所以你说这在 SL4 中有效，但在 SL3 中无效？好吧，看看features added with SL4，看看你是否找到任何解释为什么模板不能在 SL3 中正确工作，但在 SL4 中却能正常工作的任何内容。