WPF 帶清除按鈕的文字框SearchTextBox
阿新 • • 發佈：2019-02-14
基於TextBox的帶清除按鈕的搜尋框
樣式部分：
<!--帶清除按鈕文字框--> <Style TargetType="{x:Type local:XSearchTextBox}"> <Setter Property="VerticalContentAlignment" Value="Center"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type local:XSearchTextBox}"> <Border CornerRadius="0" BorderBrush="#FFE2E0E0" BorderThickness="1" Padding="0,0,5,0" Background="{TemplateBinding Background}"> <DockPanel LastChildFill="True"> <Button Width="16" Height="16" DockPanel.Dock="Right" x:Name="PART_ContentHostClearButton"> <Button.Template> <ControlTemplate TargetType="{x:Type Button}"> <Border x:Name="PART_Border" CornerRadius="8" BorderBrush="Transparent" BorderThickness="0" Padding="2"> <Path x:Name="PART_Path" Data="M6,6 L6,6 10,10 M10,6 L10,6 6,10" Fill="Gray" Stretch="Fill" Stroke="Gray" StrokeThickness="2" HorizontalAlignment="Center" VerticalAlignment="Center" /> </Border> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter Property="Background" TargetName="PART_Border"> <Setter.Value> <LinearGradientBrush EndPoint="0,1" StartPoint="0,0"> <GradientStop Color="Silver" Offset="0.0" /> <GradientStop Color="White" Offset="0.5" /> <GradientStop Color="Silver" Offset="0.0" /> </LinearGradientBrush> </Setter.Value> </Setter> <Setter Property="Stroke" TargetName="PART_Path" Value="#FFBA3232"/> </Trigger> <Trigger Property="IsPressed" Value="True"> <Setter Property="UIElement.Effect"> <Setter.Value> <DropShadowEffect BlurRadius="10" Color="Black" Direction="0" Opacity="0.6" RenderingBias="Performance" ShadowDepth="0" /> </Setter.Value> </Setter> </Trigger> <Trigger Property="IsFocused" Value="True" /> </ControlTemplate.Triggers> </ControlTemplate> </Button.Template> </Button> <Button Width="16" Height="16" DockPanel.Dock="Right" Visibility="Collapsed" x:Name="PART_ContentHostSeachButton"> <Button.Template> <ControlTemplate TargetType="{x:Type Button}"> <Path Name="searchPath" Stretch="Fill" Fill="Gray" Data="F1 M 42.5,22C 49.4036,22 55,27.5964 55,34.5C 55,41.4036 49.4036,47 42.5,47C 40.1356,47 37.9245,46.3435 36,45.2426L 26.9749,54.2678C 25.8033,55.4393 23.9038,55.4393 22.7322,54.2678C 21.5607,53.0962 21.5607,51.1967 22.7322,50.0251L 31.7971,40.961C 30.6565,39.0755 30,36.8644 30,34.5C 30,27.5964 35.5964,22 42.5,22 Z M 42.5,26C 37.8056,26 34,29.8056 34,34.5C 34,39.1944 37.8056,43 42.5,43C 47.1944,43 51,39.1944 51,34.5C 51,29.8056 47.1944,26 42.5,26 Z "> <Path.RenderTransform> <RotateTransform Angle="-90" CenterX="8" CenterY="8" /> </Path.RenderTransform> </Path> </ControlTemplate> </Button.Template> </Button> <ScrollViewer DockPanel.Dock="Left" Margin="2" x:Name="PART_ContentHost" Background="{TemplateBinding Background}"/> </DockPanel> </Border> </ControlTemplate> </Setter.Value> </Setter> </Style>
程式碼部分：
public class XSearchTextBox : TextBox { static XSearchTextBox() { DefaultStyleKeyProperty.OverrideMetadata(typeof(XSearchTextBox), new FrameworkPropertyMetadata(typeof(XSearchTextBox))); } [CategoryAttribute("自定義屬性"), DescriptionAttribute("獲取或設定預設文字")] public string PlaceHolder { get { return (string)GetValue(PlaceHolderProperty); } set { SetValue(PlaceHolderProperty, value); } } [CategoryAttribute("自定義屬性"), DescriptionAttribute("獲取或設定預設文字")] public static readonly DependencyProperty PlaceHolderProperty = DependencyProperty.Register("PlaceHolder", typeof(string), typeof(XSearchTextBox)); public override void OnApplyTemplate() { base.OnApplyTemplate(); ButtonBase clearBtn = this.Template.FindName("PART_ContentHostClearButton", this) as ButtonBase; ButtonBase searchBtn = this.Template.FindName("PART_ContentHostSeachButton", this) as ButtonBase; searchBtn.Visibility = Visibility.Visible; clearBtn.Visibility = Visibility.Collapsed; this.Text = PlaceHolder; this.Opacity = 0.4; clearBtn.Click += (s, e) => { this.Text = ""; }; this.LostFocus += (s, e) => { if (this.Text.Length == 0) { this.Text = PlaceHolder; this.Opacity = 0.4; searchBtn.Visibility = Visibility.Visible; clearBtn.Visibility = Visibility.Collapsed; } else { clearBtn.Visibility = Visibility.Visible; searchBtn.Visibility = Visibility.Collapsed; } }; this.GotFocus += (s, e) => { if (this.Text == PlaceHolder) { this.Text = ""; } clearBtn.Visibility = Visibility.Visible; searchBtn.Visibility = Visibility.Collapsed; }; } protected override void OnTextChanged(TextChangedEventArgs e) { if (this.Text != PlaceHolder) { base.OnTextChanged(e); } if (this.Template != null) { ButtonBase clearBtn = this.Template.FindName("PART_ContentHostClearButton", this) as ButtonBase; ButtonBase searchBtn = this.Template.FindName("PART_ContentHostSeachButton", this) as ButtonBase; this.Opacity = 1; if (this.Text.Length > 0) { if (this.Text != PlaceHolder) { clearBtn.Visibility = Visibility.Visible; searchBtn.Visibility = Visibility.Collapsed; } else { this.Opacity = 0.4; searchBtn.Visibility = Visibility.Visible; clearBtn.Visibility = Visibility.Collapsed; } } else { if (this.IsFocused) { clearBtn.Visibility = Visibility.Visible; searchBtn.Visibility = Visibility.Collapsed; } else { this.Text = PlaceHolder; } } } } }