TextBox的样式，该样式应在聚焦时关闭样式更改

Question

我的文本框有一个简单的样式：

<Style x:Key="PortalFocusVisualStyle" TargetType="TextBox">
    <!--<Setter Property="Focusable" Value="False"/>-->
    <Setter Property="BorderBrush">
        <Setter.Value>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="#7FFFFFFF" Offset="1"/>
                <GradientStop Color="#3FFFFFFF"/>
            </LinearGradientBrush>
        </Setter.Value>
    </Setter>
    <Setter Property="Background">
        <Setter.Value>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="#0CFFFFFF" Offset="0"/>
                <GradientStop Color="#26FFFFFF" Offset="1"/>
            </LinearGradientBrush>
        </Setter.Value>
    </Setter>
</Style>

这就是我所有的文本框应该有的样子。顺便说一下，如果可能的话，PasswordBoxes也是，但我也可以用同样的方式为它们做一个新的样式。

当用户点击文本框时，顶部边框几乎消失，看起来很奇怪。对于Windows7来说，这似乎是默认行为。但我不想这样，文本框（或密码框）现在看起来应该完全一样——不管它是否聚焦。

所以我的想法是将这种风格用于风格和focusvisualstyle，如下所示：

我的问题仍然是焦点文本框看起来不一样。

我尝试使用可视化状态，并在setter中为我的上述风格添加了一个模板：

    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="TextBox" >
                <Grid x:Name="RootElement" Background="{TemplateBinding Background}" >
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="FocusStates">
                            <VisualState x:Name="Focused"/>
                            <VisualState x:Name="Unfocused"/>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
               </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>

但不知怎么的，这是错误的，我只看到一个空盒子。我不知道我需要向网格中添加什么，或者如果网格是个好主意，我根本无法向模板中添加Visualstate，有人能帮我吗？

或者可能有一个更简单的解决方案？我希望我的文本框和密码框具有上面的样式，背景和边框来自上面，当它聚焦时，它应该看起来一样，而不是更改边框等。

非常感谢！Eric

Answer 1

这就是您需要做的：

<Style TargetType="{x:Type TextBox}">
        <Setter Property="Margin" Value="0" />
        <Setter Property="Padding" Value="0" />
        <Setter Property="FocusVisualStyle" Value="{x:Null}" />
        <Setter Property="BorderBrush">
            <Setter.Value>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="#7FFFFFFF" Offset="1"/>
                    <GradientStop Color="#3FFFFFFF"/>
                </LinearGradientBrush>
            </Setter.Value>
        </Setter>
        <Setter Property="Background">
            <Setter.Value>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="#0CFFFFFF" Offset="0"/>
                    <GradientStop Color="#26FFFFFF" Offset="1"/>
                </LinearGradientBrush>
            </Setter.Value>
        </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TextBox}">
                    <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}">
                        <ScrollViewer Margin="0" x:Name="PART_ContentHost"/>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

Scrollviewer是文本框模板的实际内容宿主。这里的秘密是将FocusVisualStyle设置为null。这将使您在所有平台上都有一个一致的外观。