WPF自定义搜索框代码分享
作者:WinterFish 时间:2023-07-18 23:31:04
首先下载搜索图标:
控件中的搜索图标下载地址:http://www.easyicon.net/1183666-Search_icon.html
搜索框设计过程比较简单:
1、先定义一个Rectangle作为背景
2、然后中间放TextBox输入,可以重写其中的模板。提示语Label放在模板中,可以在模板的触发器中控制隐藏显示~
3、搜索按钮-大家随便在网上下个就行了。
UserControl界面:
<UserControl x:Class="WpfApplication18.SearchControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d" MinHeight="30" MinWidth="150" Background="Transparent"
d:DesignHeight="30" d:DesignWidth="150">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="15"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="36"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Rectangle Grid.Column="0" Grid.ColumnSpan="3" Fill="LightGray" RadiusX="15" RadiusY="15" Opacity="0.8"></Rectangle>
<TextBox x:Name="TbxInput" Grid.Column="1" KeyDown="TbxInput_OnKeyDown">
<TextBox.Template>
<ControlTemplate TargetType="TextBox">
<Grid>
<TextBlock x:Name="Uc_TblShow" Text="请输入..." Foreground="Gray" Opacity="0.5" VerticalAlignment="Center" Visibility="Collapsed"></TextBlock>
<TextBox x:Name="Uc_TbxContent" Foreground="Gray" Background="Transparent" VerticalAlignment="Center" VerticalContentAlignment="Center" BorderThickness="0"
Text="{Binding ElementName=TbxInput,Path=Text,Mode=TwoWay}" FontSize="18"></TextBox>
</Grid>
<ControlTemplate.Triggers>
<Trigger SourceName="Uc_TbxContent" Property="Text" Value="">
<Setter TargetName="Uc_TblShow" Property="Visibility" Value="Visible"></Setter>
</Trigger>
<Trigger SourceName="Uc_TbxContent" Property="IsFocused" Value="True">
<Setter TargetName="Uc_TblShow" Property="Visibility" Value="Collapsed"></Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</TextBox.Template>
</TextBox>
<Button x:Name="BtnSearch" Grid.Column="2" Click="BtnSearch_OnClick" Cursor="Hand">
<Button.Template>
<ControlTemplate TargetType="Button">
<Grid>
<Image x:Name="Uc_Image" Source="1181298.png" Height="20" Width="20"></Image>
<ContentPresenter></ContentPresenter>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter TargetName="Uc_Image" Property="Height" Value="25"></Setter>
<Setter TargetName="Uc_Image" Property="Width" Value="25"></Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Button.Template>
</Button>
</Grid>
</UserControl>
UserControl后台:
public partial class SearchControl : UserControl
{
public SearchControl()
{
InitializeComponent();
}
public event EventHandler<SearchEventArgs> OnSearch;
private void BtnSearch_OnClick(object sender, RoutedEventArgs e)
{
ExeccuteSearch();
}
private void TbxInput_OnKeyDown(object sender, KeyEventArgs e)
{
ExeccuteSearch();
}
private void ExeccuteSearch()
{
if (OnSearch!=null)
{
var args=new SearchEventArgs();
args.SearchText = TbxInput.Text;
OnSearch(this, args);
}
}
}
public class SearchEventArgs : EventArgs
{
public string SearchText { get; set; }
}
直接引用就行了:<wpfApplication18:SearchControl></wpfApplication18:SearchControl>
标签:WPF,搜索框
0
投稿
猜你喜欢
Django {{ MEDIA_URL }}无法显示图片的解决方式
2023-06-20 07:42:22
oracle 集合
2009-06-19 18:09:00
开发保留标准的浏览器功能的AJAX应用
2008-02-03 14:03:00
如何在Win下mysql备份恢复命令
2010-03-03 17:23:00
索引在Oracle中的应用深入分析
2023-07-04 19:50:49
图片放大镜,多图片放大(已更新)[可调整倍数、区域大小、展示区域位置]
2011-06-16 20:43:07
网站的视觉路径和版式设计
2008-04-15 14:35:00
XML教程—编写结构完整的XML文档
2008-10-11 13:43:00
如何保持Oracle数据库的优良性能
2009-02-26 10:39:00
减少SQL Server死锁的方法
2009-01-05 13:49:00
教程:打造SQL Server2000的安全策略
2008-12-23 15:52:00
PHP工厂模式Factory Pattern的实现及特点
2023-05-25 05:19:24
解决新版Pycharm中Matplotlib图像不在弹出独立的显示窗口问题
2023-06-28 02:44:14
如何正确显示模式对话框showModalDialog中的中文?
2010-06-28 18:24:00
Chrome和firefox使用比较测评
2010-03-26 12:13:00
从一个项目中来看三层架构
2008-08-06 12:50:00
怎样取得局域网中所有SQL Server的实例
2009-01-08 13:20:00
解析ASP的Application和Session对象
2007-09-14 10:13:00
搞定web设计中网页路径问题
2007-09-22 08:52:00
Sql Server表死锁的解决方法分享
2011-09-01 19:08:00