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也是如此，但我也可以用同样的方式为他们做新的风格。

当用户点击文本框时，顶部边框几乎消失，看起来很奇怪。对于Windows 7，似乎这是默认行为。但是我不想要这个，文本框（或密码框）看起来应该完全相同，如果它是有焦点的话。

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

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

我尝试使用visualstates并在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>

但不知何故，这是错误的，我只看到一个空盒子。我不知道我需要添加到网格中，或者如果网格是个好主意，我根本无法将Visualstates添加到模板中，有人可以帮帮我吗？

或许有一个更简单的解决方案？我希望我的文本框和密码框具有上面的风格，背景和边框从上面开始，当它被聚焦时，它应该看起来一样，不会改变边框等......

非常感谢！埃里克

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。这将为您提供所有平台的一致外观。

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

1 个答案: