【WPF】自定义样式:SearchBox搜索框


![[png-SearchBox.png]]

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Style
       TargetType="{x:Type TextBox}"
       x:Key="ModernTextBox">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TextBox}">
                    <Border CornerRadius="10"
                            Background="#282C34"
                            Width="{TemplateBinding Width}" Height="{TemplateBinding Height}">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="20"/>
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>
                            <Image Height="10" Source="/Images/search.png"/>
                            <Grid Grid.Column="1">
                                <Rectangle StrokeThickness="1"/>
                                <TextBox Margin="1"
                                     Text="{TemplateBinding Text}"
                                     BorderThickness="0"
                                     Background="Transparent"
                                     VerticalAlignment="Center"
                                     FontSize="{TemplateBinding FontSize}"
                                     Foreground="White"
                                     x:Name="SearchBox"/>
                                <TextBlock IsHitTestVisible="False"
                                       Text="Search"
                                       VerticalAlignment="Center"
                                       HorizontalAlignment="Left"
                                       Margin="1,0,0,0"
                                       FontSize="11"
                                       Foreground="DarkGray"
                                       Grid.Column="1">
                                    <TextBlock.Style>
                                        <Style TargetType="{x:Type TextBlock}">
                                            <Style.Triggers>
                                                <!--当TextBox为空的时候,显示:(PlaceHolder)-->
                                                <DataTrigger Binding="{Binding Text,ElementName=SearchBox}" Value="">
                                                    <Setter Property="Visibility" Value="Visible"/>
                                                </DataTrigger>
                                            </Style.Triggers>
                                            <Setter Property="Visibility" Value="Hidden"/>
                                        </Style>
                                    </TextBlock.Style>
                                </TextBlock>
                            </Grid>
                        </Grid>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>![[Pasted image 20250227193919.png]]
posted @ 2025-04-12 09:07  Sitar  阅读(85)  评论(0)    收藏  举报