看到网上的点击式验证码,觉得很方便.

环境 W8.1 VS2013 .NET4.5 WPF

验证码类 CreateValidateImg 主要包含生成验证图片的方法,和比较验证码的方法

  1. /// <summary>
  2.     /// 生成验证码图片
  3.     /// 随机的验证码包含0-9十个数字和A-Z 26个字母(ascii65-90)
  4.     /// </summary>
  5.     internal class CreateValidateImg
  6.     {
  7.         private static string codesource = "QAZXSWEDCVFRTGBNHYUJMKIOLP0123456789";// 随机源
  8.         private static Random rand = new Random();// 随机工具
  9.         private static Dictionary<Point, string> pointdic = null;// 坐标系(键)所在验证码(值)
  10.         private static string codestr = null;// 验证码
  11.         private static int width = 201;// 宽
  12.         private static int height = 121;// 高
  13.         internal static MemoryStream ms = null;// 保存验证码选择图片的流
  14.         public static MemoryStream mscode = null;// 保存验证码图片的流
  15.         
  16.         /// <summary>
  17.         /// 画出验证码图片,
  18.         /// </summary>
  19.         /// <returns></returns>
  20.         internal static void ValidateImg()
  21.         {
  22.             /*创建验证码选择图片*/
  23.             Bitmap vpic = new Bitmap(width, height);// 创建一个图片 用于验证码选择
  25.             Graphics g = Graphics.FromImage(vpic);// 根据这个图片创建绘画工具
  26.             // 开始绘画
  27.             g.FillRectangle(Brushes.Gold, 0, 0, width, height);// 填充一个颜色
  28.             // 1.画一个3行4列的网格,均分160长 60高
  29.             for (int i = 0; i < 4; i++)
  30.             {
  31.                 g.DrawLine(Pens.Blue, new Point(0, i * 40), new Point(width, i * 40));
  32.             }
  33.             for (int i = 0; i < 5; i++)
  34.             {
  35.                 g.DrawLine(Pens.Blue, new Point(i * 50, 0), new Point(i * 50,width));
  36.             }
  37.             // 2.画12个字符
  38.             pointdic = new Dictionary<Point, string>(12);// 初始化坐标系的值
  39.             for (int i = 0; i < 3; i++)
  40.             {
  41.                 for (int j = 0; j < 4; j++)
  42.                 {
  43.                     char a = codesource[rand.Next(0, 36)];// 码
  44.                     g.DrawString(a.ToString(), new Font("Anonymous Pro", 15,FontStyle.Bold), Brushes.Black,
  45.                         new Point(j * 50 + 16, i * 40 + 10));// 画画
  46.                     pointdic.Add(new Point(j,i), a.ToString());// 坐标 码 键值对
  47.                 }
  48.             }
  49.             // 创建内存流,将图片保存在其中
  50.             ms = new MemoryStream();
  51.             vpic.Save(ms, System.Drawing.Imaging.ImageFormat.Jpeg);
  52.             // 让内存流回到开头的位置
  53.             ms.Seek(0, SeekOrigin.Begin);
  55.             /********再创建验证码图片********/
  56.             Bitmap vimg = new Bitmap(200,30);
  57.             g = Graphics.FromImage(vimg);
  58.             g.FillRectangle(Brushes.Orange, 0, 0, 200, 30);
  59.             // 从字典中随机5个验证码字符
  60.             string[] vcodearray = pointdic.Values.ToArray<string>();
  61.             codestr = "";
  62.             for (int i = 0; i < 5; i++)
  63.             {
  64.                 string vc = vcodearray[rand.Next(0, 12)];
  65.                 g.DrawString(vc, new Font("Anonymous Pro", 15, FontStyle.Bold), Brushes.Black,
  66.                         new Point(i*30+30,5));// 画画
  67.                 codestr = codestr + vc;
  68.             }
  69.             mscode = new MemoryStream();
  70.             vimg.Save(mscode, System.Drawing.Imaging.ImageFormat.Jpeg);
  71.             mscode.Seek(0, SeekOrigin.Begin);
  72.         }
  75.         /// <summary>
  76.         /// 画出验证码图片中被点击的部分
  77.         /// </summary>
  78.         /// <param name="newxy"></param>
  79.         /// <returns></returns>
  80.         internal static MemoryStream ValidateImgPartial(int x,int y)
  81.         {
  83.             // 当前的验证码图片 从流中读出来
  84.             Bitmap bmp = new Bitmap(ms);
  85.             // 将点击指定的部分复制出来
  86.             Bitmap pbmp = bmp.Clone(new Rectangle(x * 50, y * 40, 51, 41), System.Drawing.Imaging.PixelFormat.Format24bppRgb);
  87.             // 返回图片数据
  88.             MemoryStream pms = new MemoryStream();
  89.             pbmp.Save(pms, System.Drawing.Imaging.ImageFormat.Jpeg);
  90.             pms.Seek(0, SeekOrigin.Begin);
  91.             return pms;
  92.         }
  93.         /// <summary>
  94.         /// 根据坐标键获取单个验证码
  95.         /// </summary>
  96.         /// <param name="xy"></param>
  97.         internal static string GetCodeByPoint(int x ,int y)
  98.         {
  99.             Point xy = new Point(x, y);
  100.             if(pointdic.ContainsKey(xy))
  101.             {
  102.                 string c=pointdic[xy];
  103.                 return c;
  104.             }
  105.             return "no code are finded";
  106.         }
  108.         /// <summary>
  109.         /// 根据坐标数组比较验证码正确性
  110.         /// </summary>
  111.         /// <param name="point"></param>
  112.         /// <returns></returns>
  113.         internal static string ToValidate(Point[] point)
  114.         {
  115.             StringBuilder sb = new StringBuilder();
  116.             foreach (Point item in point)
  117.             {
  118.                 if (pointdic.ContainsKey(item))
  119.                 {
  120.                     sb.Append(pointdic[item]);
  121.                 }
  122.                 else
  123.                 {
  124.                     return "验证码有误";
  125.                 }
  126.             }
  127.             if (string.Compare(codestr, sb.ToString(), true)==0)
  128.             {
  129.                 return "验证码正确";
  130.             }
  131.             else
  132.             {
  133.                 return "验证码有误";
  134.             }
  135.         }
  136.     }

View Code

 

WPF窗体 包含一个验证码图片框 ,一个验证码选择图片框,点击时存放所点击的验证码图片的框(共有5个) 

  1. /// <summary>
  2.     /// VImage.xaml 的交互逻辑
  3.     /// </summary>
  4.     public partial class VImage : Window
  5.     {
  6.         public VImage()
  7.         {
  8.             InitializeComponent();
  9.         }
  10.         private List<System.Drawing.Point> pointlist = new List<System.Drawing.Point>();// 收集每次点击的坐标,在重置按钮时会被清空
  11.         private void Window_Loaded(object sender, RoutedEventArgs e)
  12.         {
  13.             InItValidateImage();
  14.         }
  16.         private void InItValidateImage()
  17.         {
  18.             // 1。验证码图片
  19.             BitmapImage big = new BitmapImage();
  20.             big.BeginInit();// 初始化开始
  21.             CreateValidateImg.ValidateImg();
  22.             big.StreamSource = CreateValidateImg.mscode;// 图片源来自这个流
  23.             big.EndInit();// 初始化完成 
  24.             imgcode.Source = big;// 设为IMAGE控件的源
  26.             // 2。验证码选框图片
  27.             big = new BitmapImage();// 用于IMAGE控件的图像源
  28.             big.BeginInit();// 初始化开始
  29.             big.StreamSource = CreateValidateImg.ms;// 图片源来自这个流
  30.             big.EndInit();// 初始化完成 
  31.             imgbox.Source = big;// 设为IMAGE控件的源
  32.         }
  34.         private void imgbox_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
  35.         {
  36.             Point xy = e.GetPosition(imgbox);
  37.             //MessageBox.Show((int)xy.X / 50 + "   " + (int)xy.Y / 40);
  38.             Image[] img5 = new Image[] { vimg1, vimg2, vimg3, vimg4, vimg5 };
  39.             for (int i = 0; i < img5.Length; i++)
  40.             {
  41.                 if (img5[i].Source == null)
  42.                 {
  43.                     BitmapImage big = new BitmapImage();
  44.                     big.BeginInit();
  45.                     big.StreamSource=CreateValidateImg.ValidateImgPartial((int)xy.X / 50,(int)xy.Y / 40);
  46.                     big.EndInit();
  47.                     img5[i].Source = big;
  48.                     //MessageBox.Show(CreateImg.GetCodeByPoint((int)xy.X / 50, (int)xy.Y / 40) + "  " + (int)xy.X / 50 + "   " + (int)xy.Y / 40);
  49.                     this.pointlist.Add(new System.Drawing.Point((int)xy.X / 50, (int)xy.Y / 40));// 加入到坐标集合
  50.                     if (i != img5.Length-1)
  51.                         break;
  52.                     // 比对验证码.当点完最后一个时才会验证
  53.                     // 1.收集所有点击过的坐标(目前是放在本窗口定义的一个成员内)
  54.                     isvalidatelbl.Content = CreateValidateImg.ToValidate(this.pointlist.ToArray());
  55.                 }
  56.             }
  57.         }
  59.         // 重置
  60.         private void Button_Click(object sender, RoutedEventArgs e)
  61.         {
  62.             // 清空图片
  63.             Image[] img5 = new Image[] { vimg1, vimg2, vimg3, vimg4, vimg5 };
  64.             foreach (Image item in img5)
  65.             {
  66.                 item.Source = null;
  67.             }
  68.             // 清空坐标列表
  69.             this.pointlist = new List<System.Drawing.Point>();
  70.             // 清空验证结果信息
  71.             isvalidatelbl.Content = "请选择验证码";
  72.             // 更换验证码
  73.             this.InItValidateImage();
  74.         }
  76.         
  78.     }

View Code

WPF窗体XAML

  1. <Window x:Class="WpfApplication1.VImage"
  2.         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  3.         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4.         Title="VImage" Height="400" Width="300" Loaded="Window_Loaded" WindowStartupLocation="CenterOwner">
  5.     <Grid>
  6.         <Image x:Name="imgbox" HorizontalAlignment="Left" Height="121" Margin="52,79,0,0" VerticalAlignment="Top" Width="201" MouseLeftButtonUp="imgbox_MouseLeftButtonUp"/>
  7.         <WrapPanel x:Name="wpl1" Height="45" Margin="0,214,0,0" VerticalAlignment="Top">
  8.             <Image x:Name="vimg1" Height="41" Width="51" RenderTransformOrigin="0.5,0.5" VerticalAlignment="Top" HorizontalAlignment="Left"/>
  9.             <Image x:Name="vimg2" Height="41" Width="51" OpacityMask="#FFDE4A4A" RenderTransformOrigin="0.5,0.5" VerticalAlignment="Top" HorizontalAlignment="Left"/>
  10.             <Image x:Name="vimg3" Height="41" Width="51" OpacityMask="#FFDE4A4A" RenderTransformOrigin="0.5,0.5" VerticalAlignment="Top" HorizontalAlignment="Left"/>
  11.             <Image x:Name="vimg4" Height="41" OpacityMask="#FFDE4A4A" Width="51" RenderTransformOrigin="0.5,0.5" VerticalAlignment="Top" HorizontalAlignment="Left"/>
  12.             <Image x:Name="vimg5" Height="41" Width="51" RenderTransformOrigin="0.5,0.5" OpacityMask="#FFDE4A4A" VerticalAlignment="Top" HorizontalAlignment="Left"/>
  13.         </WrapPanel>
  14.         <Button Content="reset" HorizontalAlignment="Left" Height="22" Margin="106,322,0,0" VerticalAlignment="Top" Width="68" Click="Button_Click" RenderTransformOrigin="2.088,0.727"/>
  15.         <Image x:Name="imgcode" HorizontalAlignment="Left" Height="31" Margin="65,43,0,0" VerticalAlignment="Top" Width="148" RenderTransformOrigin="0.574,0.774"/>
  16.         <Label Content="请在表格中点击输入验证码" HorizontalAlignment="Left" Height="28" Margin="25,10,0,0" VerticalAlignment="Top" Width="187"/>
  17.         <Label x:Name="isvalidatelbl" Content="请点击图片选择验证码" VerticalAlignment="Top" Margin="0,275,0,0" HorizontalContentAlignment="Center" Foreground="#FF8D2121" FontWeight="Bold"/>
  18.  
  19.     </Grid>
  20. </Window>

View Code

大体实现思路:

1.画出两个图片,一张是包含验证码的图片(小图),一张是包含验证码和其它字符的图片(大图),在这图上点击选择验证码,这两个图的生成是同时的,成对的.

2.将两张图片保存为流,并且设为Image控件的Source值.这个方法见http://www.cnblogs.com/pilang/archive/2010/05/30/1747485.html

3.点选时,得到坐标.就是那个3行4列表格里的数字的左上角坐标,如上图中的X坐标是(2,1).当点击选择时,通过获取点击的坐标计算所点字符的相对坐标,如点击X所在的方格时,会得到此时鼠标的坐标值(须以当前图片做为参照元素),将X/50,Y/40就得到X(2,1)的相对坐标.50,40指X所在方格的长宽.

4.将上面得到的坐标还原成实际方格所在坐标,就是再乘以相应的长和宽.到原图中复制出以此坐标为起点,长和宽的值为大小构造的矩形区域.实际就是那个被点的字符块.复制后设为下面的小格中的Image的source值

5.对比验证码,收集每次点击的坐标,在后台字典中(坐标和验证码字符的键值对)找出这些值,然后比较字符即可

其它 :坐标计算 图片部分复制 WPF控件的用法和winform差别很大,以前的办法都不好使了

版权声明：本文为mirrortom原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://www.cnblogs.com/mirrortom/p/3991117.html