如何将 Textbox 样式变成可重用的控件模板？

Question

我希望我的文本框具有水印样式。我有下面的代码，我在这里得到了https://stackoverflow.com/a/21672408/9928363

<Grid>

    <TextBox  Width="250"  VerticalAlignment="Center" HorizontalAlignment="Left" x:Name="SearchTermTextBox" Margin="5"/>

    <TextBlock IsHitTestVisible="False" Text="Enter Search Term Here" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="10,0,0,0" Foreground="DarkGray">

        <TextBlock.Style>

            <Style TargetType="{x:Type TextBlock}">

                <Setter Property="Visibility" Value="Collapsed"/>

                <Style.Triggers>

                    <DataTrigger Binding="{Binding Text, ElementName=SearchTermTextBox}" Value="">

                        <Setter Property="Visibility" Value="Visible"/>

                    </DataTrigger>

                </Style.Triggers>

            </Style>

        </TextBlock.Style>

    </TextBlock>

</Grid>

我有很多文本框，我只希望其中一些使用该样式，但不是全部。我将如何做到这一点？

Answer 1

有多种方法可以将水印添加到文本框，包括替换 TextBox 的 ControlTemplate（正如您的问题所暗示的那样）。但是，替换 TextBox 的 ControlTemplate 可能并不理想，因为这样做您需要负责绘制整个控件，包括边框、不同状态的样式等。这并不难（您可以使用 Visual Studio 或 Espression Blend 复制您当前主题中的模板），但除非您做了大量工作，否则您将失去将常用控件的样式调整为当前 Windows 主题的 WPF 功能。如果您想要一种不需要更改控件模板的简单、可重用、纯 XAML 方法，那么使用 a 声明样式资源VisualBrush是一种有效的方法。见下文，我们有 3 个文本框，水印样式应用于其中两个。当文本框具有输入焦点时，通过删除水印，此样式比您的示例更进一步。<Window ...>&nbsp; &nbsp; <Window.Resources>&nbsp; &nbsp; &nbsp; &nbsp; <Style TargetType="TextBox" x:Key="Watermark">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <Style.Resources>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <VisualBrush x:Key="WatermarkBrush" AlignmentX="Left" AlignmentY="Center" Stretch="None">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <VisualBrush.Visual>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <Label Content="Enter Search Term Here" Foreground="LightGray" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </VisualBrush.Visual>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </VisualBrush>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </Style.Resources>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <Style.Triggers>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <DataTrigger Binding="{Binding RelativeSource={RelativeSource Self}, Path=Text}" Value="">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <Setter Property="Background" Value="{StaticResource WatermarkBrush}" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </DataTrigger>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <Trigger Property="IsKeyboardFocused" Value="True">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <Setter Property="Background" Value="{x:Null}" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </Trigger>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </Style.Triggers>&nbsp; &nbsp; &nbsp; &nbsp; </Style>&nbsp; &nbsp; </Window.Resources>&nbsp; &nbsp; <StackPanel>&nbsp; &nbsp; &nbsp; &nbsp; <TextBox Width="250" VerticalAlignment="Center" FontSize="20"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; HorizontalAlignment="Left" Style="{StaticResource Watermark}"/>&nbsp; &nbsp; &nbsp; &nbsp; <TextBox Width="250" VerticalAlignment="Center"&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; HorizontalAlignment="Left"/>&nbsp; &nbsp; &nbsp; &nbsp; <TextBox Width="250" VerticalAlignment="Center"&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; HorizontalAlignment="Left" Style="{StaticResource Watermark}"/>&nbsp; &nbsp; </StackPanel></Window>如果您需要水印对不同的字体大小做出反应，您可以使用该Stretch属性：-<VisualBrush x:Key="WatermarkBrush" AlignmentX="Left" AlignmentY="Center" Stretch="Uniform">&nbsp; &nbsp; <VisualBrush.Visual>&nbsp; &nbsp; &nbsp; &nbsp; <Label Padding="2 1" Content="Enter Search Term Here" Foreground="LightGray" />&nbsp; &nbsp; </VisualBrush.Visual></VisualBrush>