WPF自定义控件(二)——TextBox

  和之前一样,先来看看效果:

  

  这个TextBox可设置水印,可设置必填和正则表达式验证。

  验证?没错,就是验证! 就是在输入完成后,控件一旦失去焦点就会自动验证!会根据我开放出来的“是否可以为空”属性进行验证,一旦为空,则控件变为警告样式。

  但这还不是最特别的,为了各种手机号啊,邮箱啊的验证,我还开放了一个正则表达式的属性,在这个属性中填上正则表达式,同上, 一旦失去焦点就会自动验证输入的内容能否匹配正则表达式,如果不能匹配,则控件变为警告样式。

  之后,代码还可以通过我开放的另一个属性来判断当前输入框的输入是否有误!

  好了,来看代码吧:

 1 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 2                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 3                     xmlns:ctrl="clr-namespace:KAN.WPF.XCtrl.Controls">
 4     <Style TargetType="{x:Type ctrl:XTextBox}">
 5         <!--StyleFocusVisual在上一篇里说了-->
 6         <Style.Resources>
 7             <ResourceDictionary Source="/KAN.WPF.Xctrl;component/Themes/CommonStyle.xaml"/>
 8         </Style.Resources>
 9         <Setter Property="FocusVisualStyle" Value="{StaticResource StyleFocusVisual}"/>
10         <Setter Property="BorderBrush" Value="Silver"/>
11         <Setter Property="BorderThickness" Value="1"/>
12         <Setter Property="Template">
13             <Setter.Value>
14                 <ControlTemplate TargetType="{x:Type ctrl:XTextBox}">
15                     <Border Name="brdText" Background="{TemplateBinding Background}"  BorderThickness="{TemplateBinding BorderThickness}"
16                           BorderBrush="{TemplateBinding BorderBrush}"  SnapsToDevicePixels="true" Padding="2">
17                         <Grid>
18                             <ScrollViewer x:Name="PART_ContentHost" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
19                             <StackPanel Orientation="Horizontal" Visibility="Collapsed" Name="stpWatermark">
20                                 <TextBlock HorizontalAlignment="Left" VerticalAlignment="Center"
21                                            FontSize="{TemplateBinding FontSize}" FontFamily="{TemplateBinding FontFamily}"
22                                            Foreground="{Binding XWmkForeground, RelativeSource={RelativeSource TemplatedParent}}"
23                                            Text="{Binding XWmkText, RelativeSource={RelativeSource TemplatedParent}}" Cursor="IBeam" />
24                             </StackPanel>
25                             <ContentPresenter></ContentPresenter>
26                         </Grid>
27                     </Border>
28                     <ControlTemplate.Triggers>
29                         <!--当失去焦点并且没有输入任何内容时-->
30                         <MultiTrigger>
31                             <MultiTrigger.Conditions>
32                                 <Condition Property="Text" Value=""/>
33                                 <Condition Property="IsFocused" Value="False"/>
34                             </MultiTrigger.Conditions>
35                             <MultiTrigger.Setters>
36                                 <Setter Property="Visibility" TargetName="stpWatermark" Value="Visible"/>
37                             </MultiTrigger.Setters>
38                         </MultiTrigger>
39                         <!--当验证失败时-->
40                         <Trigger Property="XIsError" Value="true">
41                             <Setter TargetName="brdText" Property="BorderBrush" Value="Red" />
42                             <Setter TargetName="brdText" Property="Background" Value="Beige" />
43                         </Trigger>
44                     </ControlTemplate.Triggers>
45                 </ControlTemplate>
46             </Setter.Value>
47         </Setter>
48     </Style>
49 </ResourceDictionary>

  再来看看CS:

  1 using System;
  2 using System.Windows;
  3 using System.Windows.Controls;
  4 using System.Windows.Media;
  5 using System.Windows.Input;
  6 using System.Text.RegularExpressions;
  7
  8 namespace KAN.WPF.XCtrl.Controls
  9 {
 10     /// <summary>
 11     /// 扩展输入框:可设置水印,可设置必填,可设置正则表达式验证
 12     /// </summary>
 13     public class XTextBox:TextBox
 14     {
 15         #region 依赖属性
 16         public static readonly DependencyProperty XWmkTextProperty;//水印文字
 17         public static readonly DependencyProperty XWmkForegroundProperty;//水印着色
 18         public static readonly DependencyProperty XIsErrorProperty;//是否字段有误
 19         public static readonly DependencyProperty XAllowNullProperty;//是否允许为空
 20         public static readonly DependencyProperty XRegExpProperty;//正则表达式
 21         #endregion
 22
 23         #region 内部方法
 24         /// <summary>
 25         /// 注册事件
 26         /// </summary>
 27         public XTextBox()
 28         {
 29             this.LostFocus += new RoutedEventHandler(XTextBox_LostFocus);
 30             this.GotFocus += new RoutedEventHandler(XTextBox_GotFocus);
 31             this.PreviewMouseDown += new MouseButtonEventHandler(XTextBox_PreviewMouseDown);
 32         }
 33
 34         /// <summary>
 35         /// 静态构造函数
 36         /// </summary>
 37         static XTextBox()
 38         {
 39             //注册依赖属性
 40             XTextBox.XWmkTextProperty = DependencyProperty.Register("XWmkText", typeof(String), typeof(XTextBox), new PropertyMetadata(null));
 41             XTextBox.XAllowNullProperty = DependencyProperty.Register("XAllowNull", typeof(bool), typeof(XTextBox), new PropertyMetadata(true));
 42             XTextBox.XIsErrorProperty = DependencyProperty.Register("XIsError", typeof(bool), typeof(XTextBox), new PropertyMetadata(false));
 43             XTextBox.XRegExpProperty = DependencyProperty.Register("XRegExp", typeof(string), typeof(XTextBox), new PropertyMetadata(""));
 44             XTextBox.XWmkForegroundProperty = DependencyProperty.Register("XWmkForeground", typeof(Brush),
 45                 typeof(XTextBox), new PropertyMetadata(Brushes.Silver));
 46             FrameworkElement.DefaultStyleKeyProperty.OverrideMetadata(typeof(XTextBox), new FrameworkPropertyMetadata(typeof(XTextBox)));
 47         }
 48
 49         /// <summary>
 50         /// 失去焦点时检查输入
 51         /// </summary>
 52         /// <param name="sender"></param>
 53         /// <param name="e"></param>
 54         void XTextBox_LostFocus(object sender, RoutedEventArgs e)
 55         {
 56             this.XIsError = false;
 57             if (XAllowNull == false && this.Text.Trim() == "")
 58             {
 59                 this.XIsError = true;
 60             }
 61             if (Regex.IsMatch(this.Text.Trim(), XRegExp) == false)
 62             {
 63                 this.XIsError = true;
 64             }
 65         }
 66
 67         /// <summary>
 68         /// 获得焦点时选中文字
 69         /// </summary>
 70         /// <param name="sender"></param>
 71         /// <param name="e"></param>
 72         void XTextBox_GotFocus(object sender, RoutedEventArgs e)
 73         {
 74             this.SelectAll();
 75         }
 76
 77         /// <summary>
 78         /// 鼠标点击时选中文字
 79         /// </summary>
 80         /// <param name="sender"></param>
 81         /// <param name="e"></param>
 82         void XTextBox_PreviewMouseDown(object sender, MouseButtonEventArgs e)
 83         {
 84             if (this.IsFocused == false)
 85             {
 86                 TextBox textBox = e.Source as TextBox;
 87                 textBox.Focus();
 88                 e.Handled = true;
 89             }
 90         }
 91         #endregion
 92
 93         #region 公布属性
 94         /// <summary>
 95         /// 公布属性XWmkText(水印文字)
 96         /// </summary>
 97         public String XWmkText
 98         {
 99             get
100             {
101                 return base.GetValue(XTextBox.XWmkTextProperty) as String;
102             }
103             set
104             {
105                 base.SetValue(XTextBox.XWmkTextProperty, value);
106             }
107         }
108
109         /// <summary>
110         /// 公布属性XWmkForeground(水印着色)
111         /// </summary>
112         public Brush XWmkForeground
113         {
114             get
115             {
116                 return base.GetValue(XTextBox.XWmkForegroundProperty) as Brush;
117             }
118             set
119             {
120                 base.SetValue(XTextBox.XWmkForegroundProperty, value);
121             }
122         }
123
124         /// <summary>
125         /// 公布属性XIsError(是否字段有误)
126         /// </summary>
127         public bool XIsError
128         {
129             get
130             {
131                 return (bool)base.GetValue(XTextBox.XIsErrorProperty);
132             }
133             set
134             {
135                 base.SetValue(XTextBox.XIsErrorProperty, value);
136             }
137         }
138
139         /// <summary>
140         /// 公布属性XAllowNull(是否允许为空)
141         /// </summary>
142         public bool XAllowNull
143         {
144             get
145             {
146                 return (bool)base.GetValue(XTextBox.XAllowNullProperty);
147             }
148             set
149             {
150                 base.SetValue(XTextBox.XAllowNullProperty, value);
151             }
152         }
153
154         /// <summary>
155         /// 公布属性XRegExp(正则表达式)
156         /// </summary>
157         public string XRegExp
158         {
159             get
160             {
161                 return base.GetValue(XTextBox.XRegExpProperty) as string;
162             }
163             set
164             {
165                 base.SetValue(XTextBox.XRegExpProperty, value);
166             }
167         }
168         #endregion
169     }
170 }

  怎么样?还算不错吧!我觉得这个控件的用处算是最大的了!用上这个和上一篇的Button基本可以完成很多WPF项目了!

  不过~好像还少了个主窗体!没错!下一篇就来说说怎么自定义主窗体!

  有疑问的多留言哟!

时间: 2024-10-26 03:22:13

WPF自定义控件(二)——TextBox的相关文章

WPF自定义控件与样式(3)-TextBox &amp; RichTextBox &amp; PasswordBox样式、水印、Label标签、功能扩展

原文:WPF自定义控件与样式(3)-TextBox & RichTextBox & PasswordBox样式.水印.Label标签.功能扩展 一.前言.预览 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要是对文本输入控件进行样式开发,及相关扩展功能开发,主要内容包括: 基本文本框TextBox控件样式及扩展功能,实现了样式.水印.Label标签.功能扩展: 富

WPF自定义控件与样式(7)-列表控件DataGrid与ListView自定义样式

一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: DataGrid自定义样式: ListView自定义样式: 二.DataGrid自定义样式 DataGrid是常用的数据列表显示控件,先看看实现的效果(动态图,有点大): DataGrid控件样式结构包括以下几个部分: 列头header样式 调整列头宽度的列分割线样式 行样式 行头调整高度样式 行头部样式

WPF自定义控件与样式(12)-缩略图ThumbnailImage /gif动画图/图片列表

原文:WPF自定义控件与样式(12)-缩略图ThumbnailImage /gif动画图/图片列表 一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要针对WPF项目开发中图片的各种使用问题,经过总结,把一些经验分享一下.内容包括: WPF常用图像数据源ImageSource的创建: 自定义缩略图控件ThumbnailImage,支持网络图片.大图片.图片异步加载

WPF自定义控件与样式(10)-进度控件ProcessBar自定义样

一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: ProcessBar自定义标准样式: ProcessBar自定义环形进度样式: 二.ProcessBar标准样式 效果图: ProcessBar的样式非常简单: <!--ProgressBar Style--> <Style TargetType="ProgressBar" x

WPF自定义控件与样式(5)-Calendar/DatePicker日期控件自定义样式及扩展

一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: 日历控件Calendar自定义样式: 日期控件DatePicker自定义样式,及Label标签.水印.清除日期功能扩展: 二.Calendar自定义样式 先看看效果: 从上面图可以看出,日历的显示其实有三种状态,如下面的分解图: "日"部分的显示: "月"部分的显示: &qu

WPF自定义控件与样式(6)-ScrollViewer与ListBox自定义样式

原文:WPF自定义控件与样式(6)-ScrollViewer与ListBox自定义样式 一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: ScrollViewer的样式拆解及基本样式定义: ListBox集合控件的样式定义: 二.ScrollViewer自定义样式 ScrollViewer在各种列表.集合控件中广泛使用的基础组建,先看看效果图: 如上图,

WPF自定义控件与样式(15)-终结篇

原文:WPF自定义控件与样式(15)-终结篇 系列文章目录  WPF自定义控件与样式(1)-矢量字体图标(iconfont) WPF自定义控件与样式(2)-自定义按钮FButton WPF自定义控件与样式(3)-TextBox & RichTextBox & PasswordBox样式.水印.Label标签.功能扩展 WPF自定义控件与样式(4)-CheckBox/RadioButton自定义样式 WPF自定义控件与样式(5)-Calendar/DatePicker日期控件自定义样式及扩展

WPF自定义控件与样式(15)-终结篇 &amp; 系列文章索引 &amp; 源码共享

系列文章目录  WPF自定义控件与样式(1)-矢量字体图标(iconfont) WPF自定义控件与样式(2)-自定义按钮FButton WPF自定义控件与样式(3)-TextBox & RichTextBox & PasswordBox样式.水印.Label标签.功能扩展 WPF自定义控件与样式(4)-CheckBox/RadioButton自定义样式 WPF自定义控件与样式(5)-Calendar/DatePicker日期控件自定义样式及扩展 WPF自定义控件与样式(6)-ScrollV

WPF自定义控件与样式(14)-轻量MVVM模式实践

一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. MVVM是WPF中一个非常实用的编程模式,充分利用了WPF的绑定机制,体现了WPF数据驱动的优势.  图片来源:(WPF的MVVM) 关于MVVM网上很多介绍或者示例,本文不多做介绍了,本文的主要目的是提供一个轻量级的View Model实现,本文的主要内容: 依赖通知InotifyPropertyChanged实现: 命

WPF自定义控件与样式(13)-自定义窗体Window &amp; 自适应内容大小消息框MessageBox

一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: 自定义Window窗体样式: 基于自定义窗体实现自定义MessageBox消息提示框: 二.自定义Window窗体样式 自定义的Window窗体效果:   因为WPF默认的窗体比较简陋,大都需要自己实现Window窗体样式效果,基本思路很简单: 第一步:干掉默认样式:WindowStyle = Windo