如何创建类似于 SO 搜索框的文本框提示 [英] How do I create a textbox hint, simmiliar to SO's search box

问题描述

我正在为 wpf 应用程序及其文本框创建登录窗口，我想要做的与 Stack Overflow 网站右上角的搜索问答"的行为方式相同.

I'm creating a login window for a wpf application and for its textbox, what I want to do is the same as how the 'Search Q&A' on the upper right of the Stack Overflow website behaves.

有一个包含文本用户名"的文本框，当您聚焦时，该文本仍会显示，但是当您开始键入时，文本会消失并显示您的输入.然后当您尝试将其擦除并且文本框中没有任何内容时，它将恢复为文本用户名".

There is a text box containing a text 'Username' and when you focus, the text it will still be displayed, but when you start to type, the text disappear and your input will be displayed. then when you try to erase it back and nothing is in the textbox, it will revert back to the text 'Username'.

推荐答案

您要查找的术语是文本框提示

试试这个:

<Window.Resources>
    <VisualBrush x:Key="SearchHint" TileMode="None" Stretch="None" AlignmentX="Left">
        <VisualBrush.Transform>
            <TranslateTransform X="5" Y="0" />
        </VisualBrush.Transform>
        <VisualBrush.Visual>
            <Grid>
                <TextBlock FontStyle="Italic" Foreground="Black" Opacity="0.3" Text="Search …"/>
            </Grid>
        </VisualBrush.Visual>
    </VisualBrush>
</Window.Resources>

<StackPanel>
    <TextBox VerticalContentAlignment="Center"  Height="30">
        <TextBox.Style>
            <Style TargetType="TextBox">
                <Style.Triggers>
                    <Trigger Property="Text" Value="">
                        <Setter Property="Background" Value="{StaticResource SearchHint}"/>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </TextBox.Style>
    </TextBox>
</StackPanel>

结果:

这篇关于如何创建类似于 SO 搜索框的文本框提示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！