WPF 密码框水印与明文切换

最新推荐文章于 2024-05-21 17:59:06 发布

dotNET跨平台

最新推荐文章于 2024-05-21 17:59:06 发布

阅读量333

点赞数

文章标签： wpf html rpc css ext

原文链接：https://gitee.com/yanjinhua/WPFDevelopers.git

版权

WPF开发者QQ群： 340500857

欢迎转发、分享、点赞、在看，谢谢~。

效果预览（更多效果请下载源码体验）：

一、PasswordWithPlainText.xaml 代码如下

<UserControl x:Class="WpfPasswrod.CustomControls.PasswordWithPlainText"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:input="clr-namespace:System.Windows.Input;assembly=PresentationCore"
             xmlns:local="clr-namespace:WpfPasswrod.CustomControls"
             Name="uc" Foreground="Black"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800">
    <UserControl.Resources>
        <ResourceDictionary>
            <VisualBrush x:Key="HelpBrush" TileMode="None" Opacity="0.3" Stretch="None" AlignmentY="Center" 
                     AlignmentX="{Binding AlignmentX,ElementName=uc}"
                     ViewportUnits="RelativeToBoundingBox">
                <VisualBrush.Viewport>
                    <Rect X="0.01" Y="0" Width="1" Height="1"></Rect>
                </VisualBrush.Viewport>
                <VisualBrush.Visual>
                    <TextBlock VerticalAlignment="Stretch" HorizontalAlignment="Left" 
                               TextAlignment="{Binding TextAlignment,ElementName=uc}"
                           Foreground="{Binding Foreground,ElementName=uc}"
                           Text="{Binding Hint,ElementName=uc}"
                           FontSize="{Binding FontSize,ElementName=uc}"/>
                </VisualBrush.Visual>
            </VisualBrush>


            <SolidColorBrush x:Key="ImageToggleButton.Static.Background" Color="#FFDDDDDD"/>
            <SolidColorBrush x:Key="ImageToggleButton.Static.Border" Color="#FF707070"/>
            <SolidColorBrush x:Key="ImageToggleButton.MouseOver.Background" Color="#FFBEE6FD"/>
            <SolidColorBrush x:Key="ImageToggleButton.IsChecked.Background" Color="#FFBEE6FD"/>




            <Style TargetType="{x:Type local:ImageToggleButton}">
                <Setter Property="SnapsToDevicePixels" Value="true"/>
                <Setter Property="UseLayoutRounding" Value="True"/>
                <Setter Property="VerticalContentAlignment" Value="Center"/>
                <Setter Property="HorizontalContentAlignment" Value="Center"/>
                <Setter Property="Background" Value="{StaticResource ImageToggleButton.Static.Background}"/>
                <Setter Property="BorderBrush" Value="{StaticResource ImageToggleButton.Static.Border}"/>
                <Setter Property="Cursor" Value="Hand"/>


                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type local:ImageToggleButton}">
                            <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"
                Background="{TemplateBinding Background}"
                SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                UseLayoutRounding="True"
                CornerRadius="{Binding Path=CornerRadius, RelativeSource={RelativeSource Mode=TemplatedParent}}"
                HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                <Grid>
                                    <Image x:Name="image"  Focusable="False" Margin="0,1,0,0"
                       Source="{Binding NormalImage, RelativeSource={RelativeSource TemplatedParent}}"
                       HorizontalAlignment="Center" VerticalAlignment="Center" Height="20" Width="20"/>
                                </Grid>
                            </Border>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsChecked" Value="true">
                                    <Setter TargetName="border" Property="Background" Value="{StaticResource ImageToggleButton.IsChecked.Background}"/>
                                    <Setter TargetName="image" Property="Source" Value="{Binding UnImage, RelativeSource={RelativeSource TemplatedParent}}"/>
                                </Trigger>
                                
                                <Trigger Property="IsMouseOver" Value="true">
                                    <Setter TargetName="border" Property="Background" Value="{StaticResource ImageToggleButton.MouseOver.Background}"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
</Style>


        </ResourceDictionary>
    </UserControl.Resources>
    <Border BorderThickness="1" BorderBrush="{Binding BorderBrush,ElementName=uc}"
            CornerRadius="{Binding CornerRadius,ElementName=uc}">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition />
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <Image Source="{Binding IconImage,ElementName=uc}" Margin="4,0"
                   HorizontalAlignment="Center" VerticalAlignment="Center" Height="20" Width="20"/>
            <TextBox Name="tbPlainText" Grid.Column="1" 
                     Text="{Binding Password,Mode=TwoWay,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=local:PasswordWithPlainText}}"
                 FontSize="{Binding FontSize,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=local:PasswordWithPlainText}}" 
                     TextAlignment="{Binding AlignmentX,ElementName=uc}"
                 BorderThickness="0" HorizontalAlignment="Stretch" VerticalAlignment="Center" Visibility="Collapsed"
                 input:InputMethod.IsInputMethodEnabled="False" 
                 Foreground="{Binding Foreground,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=local:PasswordWithPlainText}}"
                 CaretBrush="{Binding CaretBrush,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=local:PasswordWithPlainText}}">
                <TextBox.Style>
                    <Style TargetType="TextBox">
                        <Setter Property="Background" Value="{Binding ElementName=textBox, Path=Background}"/>
                        <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>


            <PasswordBox Name="pwdCiphertext"  Grid.Column="1" local:PasswordBoxHelper.Attach="True" 
                         TextBlock.TextAlignment="{Binding AlignmentX,ElementName=uc}"
                     local:PasswordBoxHelper.Password="{Binding Password,Mode=TwoWay,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=local:PasswordWithPlainText}}"
                     FontSize="{Binding FontSize,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=local:PasswordWithPlainText}}"
                     BorderThickness="0" Background="{StaticResource HelpBrush}" HorizontalAlignment="Stretch" VerticalAlignment="Center"
                     PasswordChanged="pwdCiphertext_PasswordChanged"
                     Foreground="{Binding Foreground,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=local:PasswordWithPlainText}}"
                     CaretBrush="{Binding CaretBrush,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=local:PasswordWithPlainText}}"/>


              <local:ImageToggleButton Grid.Column="2" Width="30"
                                    NormalImage="/WpfPasswrod;component/Resources/Eye_50px.png"
                                    UnImage="/WpfPasswrod;component/Resources/Invisible_50px.png"
                                   Checked="ImageToggleButton_Checked"
                                  Unchecked="ImageToggleButton_Unchecked"/>
        </Grid>
    </Border>
    
</UserControl>

二、PasswordWithPlainText.cs.xaml 代码如下

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;


namespace WpfPasswrod.CustomControls
{
    /// <summary>
    /// PasswordWithPlainText.xaml 的交互逻辑
    /// </summary>
    public partial class PasswordWithPlainText : UserControl
    {
        public PasswordWithPlainText()
        {
            InitializeComponent();
        }
        /// <summary>
        /// 图标
        /// </summary>
        public static readonly DependencyProperty IconImageProperty =
                             DependencyProperty.Register("IconImage", typeof(ImageSource), typeof(PasswordWithPlainText), new PropertyMetadata(new BitmapImage(new Uri("pack://application:,,,/Resources/Lock_48px.png"))));
        /// <summary>
        /// 图标
        /// </summary>
        public ImageSource IconImage
        {
            get { return (ImageSource)GetValue(IconImageProperty); }
            set { SetValue(IconImageProperty, value); }
        }
        /// <summary>
        /// 文本框提示文字
        /// </summary>
        public string Hint
        {
            get { return (string)GetValue(HintProperty); }
            set { SetValue(HintProperty, value); }
        }
        // Using a DependencyProperty as the backing store for Hint.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty HintProperty =
            DependencyProperty.Register("Hint", typeof(string), typeof(PasswordWithPlainText), new PropertyMetadata(null));
        /// <summary>
        /// 获取或设置水印背景的水平对齐方式
        /// </summary>
        public AlignmentX AlignmentX
        {
            get { return (AlignmentX)GetValue(AlignmentXProperty); }
            set { SetValue(AlignmentXProperty, value); }
        }


        // Using a DependencyProperty as the backing store for AlignmentX.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty AlignmentXProperty =
            DependencyProperty.Register("AlignmentX", typeof(AlignmentX), typeof(PasswordWithPlainText), new PropertyMetadata(AlignmentX.Left));
        /// <summary>
        /// 获取或设置密码
        /// </summary>
        public string Password
        {
            get { return (string)GetValue(PasswordProperty); }
            set { SetValue(PasswordProperty, value); }
        }


        // Using a DependencyProperty as the backing store for Password.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty PasswordProperty =
            DependencyProperty.Register("Password", typeof(string), typeof(PasswordWithPlainText), new PropertyMetadata(null));
        /// <summary>
        /// 获取或设置光标颜色
        /// </summary>
        public Brush CaretBrush
        {
            get { return (Brush)GetValue(CaretBrushProperty); }
            set { SetValue(CaretBrushProperty, value); }
        }


        // Using a DependencyProperty as the backing store for CaretBrush.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty CaretBrushProperty =
            DependencyProperty.Register("CaretBrush", typeof(Brush), typeof(PasswordWithPlainText), new PropertyMetadata(Brushes.Black));


        /// <summary>
        /// 获取或设置光标颜色
        /// </summary>
        public Brush BorderBrush
        {
            get { return (Brush)GetValue(BorderBrushProperty); }
            set { SetValue(BorderBrushProperty, value); }
        }


        // Using a DependencyProperty as the backing store for CaretBrush.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty BorderBrushProperty =
            DependencyProperty.Register("BorderBrush", typeof(Brush), typeof(PasswordWithPlainText), new PropertyMetadata(Brushes.Black));




        public static readonly DependencyProperty CornerRadiusProperty = DependencyProperty.Register("CornerRadius", typeof(CornerRadius), typeof(PasswordWithPlainText),
                                                                            new PropertyMetadata(new CornerRadius(0, 0, 0, 0), OnCornerRadiusChanged));
        public CornerRadius CornerRadius
        {
            get { return (CornerRadius)GetValue(CornerRadiusProperty); }
            set
            {
                SetValue(CornerRadiusProperty, value);
            }
        }


        private static void OnCornerRadiusChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            CornerRadius cornerRadius = new CornerRadius();
            cornerRadius = (CornerRadius)e.NewValue;
        }


        /// <summary>
        /// 切换成明文
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        /// 
       
       private void ImageToggleButton_Checked(object sender, RoutedEventArgs e)
        {
            pwdCiphertext.Visibility = Visibility.Collapsed;
            tbPlainText.Visibility = Visibility.Visible;
        }
        /// <summary>
        /// 切换成密文
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
          private void ImageToggleButton_Unchecked(object sender, RoutedEventArgs e)
        {
            pwdCiphertext.Visibility = Visibility.Visible;
            tbPlainText.Visibility = Visibility.Collapsed;
        }
        private void pwdCiphertext_PasswordChanged(object sender, RoutedEventArgs e)
        {
            PasswordBox pwd = sender as PasswordBox;
            if (pwd != null)
            {
                if (!string.IsNullOrEmpty(pwd.Password))
                {
                    pwd.Background = Brushes.Transparent;
                }
                else
                {
                    pwd.Background = (Brush)FindResource("HelpBrush");
                }
            }
        }


       
    }
}

源码地址

github：https://github.com/yanjinhuagood/WPFDevelopers.git

gitee：https://gitee.com/yanjinhua/WPFDevelopers.git

WPF开发者QQ群： 340500857

blogs： https://www.cnblogs.com/yanjinhua

Github：https://github.com/yanjinhuagood

出处：https://www.cnblogs.com/yanjinhua

版权：本作品采用「署名-非商业性使用-相同方式共享 4.0 国际」许可协议进行许可。

转载请著名作者出处 https://github.com/yanjinhuagood