WPF 带有watermark的文本输入框

 用户名输入框:

1.没有获取焦点时, 如果输入内容为空,显示Mask文本:Please input username。如果不为空,显示文本内容。

2.获取焦点后, 如果是Mask文本,清除。如果不是,保留输入的内容。

这种例子很多,相信大家都熟悉。

 

public  class  MaskTextBox : TextBox
     {
         #region MaskText
         /// <summary>
         /// view sort style, desc arrow
         /// </summary>
         public  static  readonly  DependencyProperty MaskTextProperty =
                    DependencyProperty.Register( "MaskText" , typeof ( string ), typeof (MaskTextBox));
 
         public  string  MaskText
         {
             get  { return  ( string )GetValue(MaskTextProperty); }
             set  { SetValue(MaskTextProperty, value); }
         }
         #endregion
 
         public  MaskTextBox()
         {
             Loaded += (sender, args) =>
                 {
                     if  ( string .IsNullOrEmpty( base .Text))
                     {
                         base .Text = MaskText;
                         base .Foreground = Brushes.Gray;
                     }
                 };
 
             base .GotFocus += (sender, args) =>
             {
                 base .Foreground = Brushes.Black;
                 if  ( base .Text == MaskText)
                     base .Text = string .Empty;
             };
             base .LostFocus += (sender, args) =>
             {
                 if  (! string .IsNullOrEmpty( base .Text))
                     return ;
 
                 base .Text = MaskText;
                 base .Foreground = Brushes.Gray;
             };
         }
 
         public  new  string  Text
         {
             get
             {
                 if  ( base .Text == MaskText)
                     return  string .Empty;
                 else
                     return  base .Text;
             }
             set  { base .Text = value; }
         }
     }

  

   调用很简单:

<local:MaskTextBox Width="200" Height="30"   Margin="20,10,10,10" x:Name="tbUserName" MaskText="Please Input Username"/>

如果用触发器等等,实现起来很麻烦,做了一半做不下去了,所以这么干。

 原文:http://www.cnblogs.com/xiaokang088/archive/2012/09/05/2672070.html

posted on 2014-12-17 14:27 louvens 阅读( ...) 评论( ...) 编辑 收藏

转载于:https://www.cnblogs.com/louvens/p/4169316.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值