水印控件windows phone中,制作一个自定义的密码输入框控件，含图片，有水印，星号显示

PS:今天上午，非常郁闷，有很多简单基础的问题搞得我有些迷茫，哎，代码几天不写就忘。目前又不当COO，还是得用心记代码哦！

最终结果：



关键点：

密码框中有图片之类的其他元素

在没有密码输入的时候，会表现诸如如图“密码”的水印

密码输入后，成“*”星号表现

新建一个控件，XAML代码如下：

<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit" x:Class="ewlan.PassWordBoxWithIcon"
mc:Ignorable="d"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}" d:DesignWidth="480" Height="60" Width="400">

<Grid x:Name="LayoutRoot" Background="{StaticResource TransparentBrush}">
//用一个border实现外面的灰色边框
<Border BorderBrush="#FFBFBFBF" BorderThickness="2" Margin="0">
<StackPanel Orientation="Horizontal">
<Grid Margin="10,0,0,0">
<Image Name="rememberPassword" HorizontalAlignment="Center" Source="/Images/password_icon.png" Stretch="None" VerticalAlignment="Center" Margin="0"/>
<Image Name="forgetPassword" Visibility="Collapsed" HorizontalAlignment="Center" Source="/Images/password_unlock_icon.png" Stretch="None" VerticalAlignment="Center" Margin="0"/>
</Grid>
<Grid Width="351">
//1.PhoneTextBox实现水印效果
//2.PasswordBox实现密码输入酿成“*”号效果
//3.两个控件做到大小分歧，为什么？一会再看！
<toolkit:PhoneTextBox Hint="静态密码" x:Name="passwordWatermark" Margin="0" FontSize="24" Width="270" HorizontalAlignment="Left" BorderThickness="0" Height="70" VerticalAlignment="Center"/>
<PasswordBox KeyDown="passwdInput_KeyDown"  Margin="0" x:Name="passwdInput" MaxLength="20" LostFocus="PasswordLostFocus" Opacity="0" GotFocus="PasswordGotFocus" Password="{Binding Password, Mode=TwoWay}" FontSize="24" Width="270" HorizontalAlignment="Left" BorderThickness="0" Height="70" VerticalAlignment="Center"/>
</Grid>
</StackPanel>
</Border>
</Grid>
</UserControl>

每日一道理

“多难兴才”曾一度被人定为规律。请看：屈原被放逐而作《离骚》；司马迁受宫刑而作《史记》；欧阳修两岁丧父笃学而成才；曹雪芹举家食粥而写出了不朽的《红楼梦》；越王勾践卧薪尝胆而雪洗国耻；韩信遭胯下辱而统率百万雄兵……他们都是在与逆境搏斗中成为伟人的！

以下是CS代码：

public partial class PassWordBoxWithIcon : UserControl
{

public PassWordBoxWithIcon()
{
InitializeComponent();
passWordBoxWithIconInstance = this;
}

//在手指头分开密码输入框后，检查水印表现逻辑
private void PasswordLostFocus(object sender, RoutedEventArgs e)
{
CheckPasswordWatermark();
}

public void CheckPasswordWatermark()
{
//发明用户没有输入，则将PasswordBox置于透明，PhoneTextBox置于100%不透明，以表现水印
//用户有输入，则相反，目标是用户不再看到水印！
var passwordEmpty = string.IsNullOrEmpty(passwdInput.Password.Trim());
passwordWatermark.Opacity = passwordEmpty ? 100 : 0;
passwdInput.Opacity = passwordEmpty ? 0 : 100;
}

private void PasswordGotFocus(object sender, RoutedEventArgs e)
{
//用户触摸取得焦点时，我们让passwordbox显现出来，以供输入！
passwordWatermark.Opacity = 0;
passwdInput.Opacity = 100;
}
}

聪明的你肯定明确了，好，就此结束！

文章结束给大家分享下程序员的一些笑话语录： 这个世界上只有10种人：懂得二进制的和不懂得二进制的。

---------------------------------
原创文章 By
水印和控件
---------------------------------