WPF文本框密码框添加水印效果

WPF文本框密码框添加水印效果

来源: 阅读:559 时间:2014-12-31

分享:

按照惯例,先看下效果

WPF文本框密码框添加水印效果

WPF文本框密码框添加水印效果

文本框水印

文本框水印相对简单,不需要重写模板,仅仅需要一个VisualBrush   和触发器验证一下Text是否为空即可。

上代码:

<TextBox Name="txtSerachDataName" Width="120" Height="23" Grid.Column="3" Grid.Row="1">
<TextBox.Resources>
<VisualBrush x:Key="HelpBrush" TileMode="None" Opacity="0.3" Stretch="None" AlignmentX="Left">
<VisualBrush.Visual>
<TextBlock FontStyle="Italic" Text="水印效果"/>
</VisualBrush.Visual>
</VisualBrush>
</TextBox.Resources>
<TextBox.Style>
<Style TargetType="TextBox">
<Setter Property="Height" Value="23"></Setter>
<Setter Property="HorizontalAlignment" Value="Left"></Setter>
<Setter Property="VerticalAlignment" Value="Top"></Setter>
<Style.Triggers>
<Trigger Property="Text" Value="{x:Null}">
<Setter Property="Background" Value="{StaticResource HelpBrush}"/>
</Trigger>
<Trigger Property="Text" Value="">
<Setter Property="Background" Value="{StaticResource HelpBrush}"/>
</Trigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>

如上图,Text为空的时候去设置下背景的Bursh就行了。

密码框水印

关于密码框水印就不同于文本框了,可以写个Brush就搞定,因为密码框是没有可以用于判断输入非空的依赖属性的,这就需要我们去加一个,代码如下:

public class PasswordBoxMonitor : DependencyObject
{
public static bool GetIsMonitoring(DependencyObject obj)
{
return (bool)obj.GetValue(IsMonitoringProperty);
} public static void SetIsMonitoring(DependencyObject obj, bool value)
{
obj.SetValue(IsMonitoringProperty, value);
} public static readonly DependencyProperty IsMonitoringProperty =
DependencyProperty.RegisterAttached("IsMonitoring", typeof(bool), typeof(PasswordBoxMonitor), new UIPropertyMetadata(false, OnIsMonitoringChanged)); public static int GetPasswordLength(DependencyObject obj)
{
return (int)obj.GetValue(PasswordLengthProperty);
} public static void SetPasswordLength(DependencyObject obj, int value)
{
obj.SetValue(PasswordLengthProperty, value);
} public static readonly DependencyProperty PasswordLengthProperty =
DependencyProperty.RegisterAttached("PasswordLength", typeof(int), typeof(PasswordBoxMonitor), new UIPropertyMetadata(0)); private static void OnIsMonitoringChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
var pb = d as PasswordBox;
if (pb == null)
{
return;
}
if ((bool)e.NewValue)
{
pb.PasswordChanged += PasswordChanged;
}
else
{
pb.PasswordChanged -= PasswordChanged;
}
} static void PasswordChanged(object sender, RoutedEventArgs e)
{
var pb = sender as PasswordBox;
if (pb == null)
{
return;
}
SetPasswordLength(pb, pb.Password.Length);
}
}

加一个PasswordLength  用于判断密码框长度是否为0,当为0的时候就显示水印,否则就隐藏。

在使用重构的PasswordBox的时候需要去引用一下:xmlns:WpfTest="clr-namespace:WpfApplication2"   我写的是示范的demo   所以命名空间是WpfApplication2。

Xaml代码如下:

<PasswordBox Name="pb" Width="120" VerticalAlignment="Bottom" Height="35"  Grid.Column="3" Grid.Row="3">
<PasswordBox.Style>
<Style TargetType="PasswordBox">
<Setter Property="Height" Value="23"></Setter>
<Setter Property="HorizontalAlignment" Value="Left"></Setter>
<Setter Property="VerticalAlignment" Value="Top"></Setter>
<Setter Property="WpfTest:PasswordBoxMonitor.IsMonitoring" Value="True"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type PasswordBox}">
<Border Name="Bd" Background="{TemplateBinding Background}" BorderThickness="{TemplateBinding BorderThickness}"
BorderBrush="{TemplateBinding BorderBrush}" SnapsToDevicePixels="true">
<Grid>
<ScrollViewer x:Name="PART_ContentHost" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
<StackPanel Orientation="Horizontal" Visibility="Collapsed" Name="myStackPanel"> <TextBlock HorizontalAlignment="Left" VerticalAlignment="Center" Foreground="LightGray" Text="水印效果"/>
</StackPanel>
</Grid>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Visibility" TargetName="myStackPanel" Value="Collapsed"/>
</Trigger>
<Trigger Property="WpfTest:PasswordBoxMonitor.PasswordLength" Value="0">
<Setter Property="Visibility" TargetName="myStackPanel" Value="Visible"/> </Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</PasswordBox.Style>
</PasswordBox>

如上面的代码,重写了一下ControlTemplate,加了一个StackPanel    判断一下密码框的内容长度,不为0的时候显示StanckPanel   否则不显示。

当然也可以不使用模板,像文本框里面的那种方式去显示,只是给PasswordBox注册一个依赖属性即可,这里只是多告诉大家一种使用方式,根据不同的情况可选择适用的方式。

上一篇:php中ajax跨域请求---小记


下一篇:跨域调用webapi web端跨域调用webapi