日期:2014-05-17  浏览次数:20714 次

windowsphone7下定制密码输入框

SDK中提供的PasswordBox很好用,但是不能实现显示密码的功能。

个人通过组合PhoneTextBox和PasswordBox来定制了一个用户控件,作为密码的输入框,并可以根据选择来实现隐藏或者显示密码。

xaml代码:

<UserControl x:Class="CustomControls.PasswordTextBox"
    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:tk="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}">
    
	<UserControl.Resources>
		<Style x:Name="MyCustomTextBoxStyle" TargetType="tk:PhoneTextBox">
			<Setter Property="Width" Value="375"/>
			<Setter Property="Margin" Value="0"/>
			<Setter Property="BorderThickness" Value="0"/>
			<Setter Property="Padding" Value="-5"/> 
			<Setter Property="Background" Value="Transparent"/>
			<Setter Property="FontSize" Value="24"/>
			<Setter Property="VerticalAlignment" Value="Center"/>
		</Style>
		
		<Style x:Name="CustomPasswordBoxStyle" TargetType="PasswordBox">
			<Setter Property="FontSize" Value="22"/>
			<Setter Property="Background" Value="White"/>
			<Setter Property="BorderThickness" Value="0"/>
			<Setter Property="VerticalAlignment" Value="Center"/>
			<Setter Property="Margin" Value="5 0 0 0"/>
		</Style>
	</UserControl.Resources>
	
    <Grid x:Name="LayoutRoot">
        <tk:PhoneTextBox x:Name="ShowPwdTB"
                Hint="请输入数字或字母"
                Style="{StaticResource MyCustomTextBoxStyle}"
                Visibility="Visible" TextChanged="OnShowPwdChanged"
                GotFocus="OnShowPwdTBGotFocus"/>
        <PasswordBox x:Name="HidePwdTB" Style="{StaticResource CustomPasswordBoxStyle}"
                LostFocus="OnHidePwdTBLostFocus"
                Padding="8 0 0 0" Visibility="Collapsed"/>
    </Grid>
</UserControl>

.cs文件代码:

    public partial class PasswordTextBox : UserControl
    {
        #region Dependency Properties

        public static readonly DependencyProperty IsShowPasswordProperty =
             DependencyProperty.Register("IsShowPassword", typeof(bool), typeof(PasswordTextBox),
             new PropertyMetadata(OnIsShowPasswordPropertyChanged));

        public static readonly DependencyProperty PasswordProperty =
             DependencyProperty.Register("Password", typeof(string), typeof(PasswordTextBox),
             new PropertyMetadata(OnPasswordPropertyChanged));

        #endregion

        #region Data Members

        // 当密码为空时,保留ShowPwdTB的可见性(用于显示Hint文本);此时设置隐藏密码的操作无效
        private bool m_IsNeedHidePassword;

        #endregion

        #region Constructor

        public PasswordTextBox()
        {
            InitializeComponent();

            m_IsNeedHidePassword = false;
        }

        #endregio