三亩地 三亩地SAN MU DI · CODE DIARY
ARTICLE DETAIL

日记详情

真实记录编程学习的某一天,欢迎挑你感兴趣的翻一翻。

【WinForm UI控件系列】scratchCode 刮刮乐、识别码、防伪码、验证码控件

【WinForm UI控件系列】scratchCode 刮刮乐、识别码、防伪码、验证码控件

ScratchCode 是一个刮刮卡/防伪码/识别码/验证码控件,支持鼠标擦除涂层显示底层验证码。适用于抽奖活动、防伪验证、验证码等场景

功能特性

  • 多种验证码类型:支持数字、字母、字母数字混合、汉字
  • 可擦除涂层:鼠标拖动擦除涂层,支持圆形/方形橡皮擦
  • 干扰线:可选添加干扰线增加识别难度
  • 自定义外观:支持涂层颜色、文本颜色、边框样式等
  • 圆角边框:支持圆角矩形外观
  • 擦除进度检测:自动检测擦除百分比,达到阈值触发揭示事件
  • 校验功能:内置验证码校验方法

一、效果图





二、使用说明

属性说明

数据属性

属性名类型默认值说明
Codestring随机生成当前验证码
CodeLengthint6验证码长度(半角4-12位,汉字2-6个)
CodeTypeScratchCodeTypeAlphanumeric验证码类型
IsRevealedboolfalse是否已完全揭示(只读)
ScratchPercentfloat0已擦除百分比(只读)

验证码外观

属性名类型默认值说明
CodeColorColor24, 144, 255验证码文本颜色
CodeFontFontArial 20 Bold验证码字体

涂层属性

属性名类型默认值说明
CoatingColorColor192, 192, 192涂层底色
CoatingPatternColorColor160, 160, 160涂层纹理颜色
CoatingPatternDensityint50涂层纹理密度(0-100)

干扰线属性

属性名类型默认值说明
ShowInterferenceLinesbooltrue是否显示干扰线
InterferenceLineCountint3干扰线数量(0-10)
InterferenceLineColorColor100, 100, 100干扰线颜色

橡皮擦属性

属性名类型默认值说明
EraserShapeEraserShapeCircle橡皮擦形状(圆形/方形)
EraserSizeint20橡皮擦大小(5-50像素)

外观属性

属性名类型默认值说明
CornerRadiusint4圆角半径(0-20)
BorderColorColor200, 200, 200边框颜色
BorderWidthint1边框宽度(0-5)
PaddingPadding4,4,4,4控件内边距
TextPaddingPadding8,8,8,8文本区域内边距

主题属性

属性名类型默认值说明
FollowGlobalThemebooltrue是否跟随全局主题切换

事件

事件名说明参数
CodeRevealed验证码被揭示时触发(擦除超过50%)EventArgs
ScratchProgressChanged擦除进度变化时触发ScratchProgressEventArgs
CodeVerified验证码校验完成时触发VerifyEventArgs

枚举类型

ScratchCodeType

值说明
Numeric纯数字(0-9)
Alphabetic纯字母(A-Z, a-z)
Alphanumeric字母数字混合
Chinese汉字(一、二、三…)

EraserShape

值说明
Square方形橡皮擦
Circle圆形橡皮擦

使用示例

基本用法

// 创建控件varscratchCode=newScratchCode();scratchCode.Size=newSize(150,50);scratchCode.Location=newPoint(20,20);// 添加到窗体this.Controls.Add(scratchCode);// 绑定事件scratchCode.CodeRevealed+=(sender,e)=>{MessageBox.Show("验证码已揭示!");};

自定义验证码类型

// 数字验证码scratchCode.CodeType=ScratchCodeType.Numeric;scratchCode.CodeLength=6;// 汉字验证码scratchCode.CodeType=ScratchCodeType.Chinese;scratchCode.CodeLength=4;// 2-6个汉字// 生成新的验证码scratchCode.GenerateNewCode();

自定义外观

// 验证码样式scratchCode.CodeColor=Color.Red;scratchCode.CodeFont=newFont("宋体",24,FontStyle.Bold);// 涂层样式scratchCode.CoatingColor=Color.Silver;scratchCode.CoatingPatternColor=Color.Gray;scratchCode.CoatingPatternDensity=60;// 干扰线scratchCode.ShowInterferenceLines=true;scratchCode.InterferenceLineCount=5;scratchCode.InterferenceLineColor=Color.DarkGray;// 橡皮擦scratchCode.EraserShape=EraserShape.Circle;scratchCode.EraserSize=25;// 边框scratchCode.BorderColor=Color.FromArgb(24,144,255);scratchCode.BorderWidth=2;scratchCode.CornerRadius=8;

验证码校验

// 用户输入验证stringuserInput=textBox1.Text;boolisValid=scratchCode.Verify(userInput,ignoreCase:true);if(isValid){MessageBox.Show("验证成功!");}else{MessageBox.Show("验证失败,请重新输入!");scratchCode.Reset();// 重置涂层}// 绑定校验事件scratchCode.CodeVerified+=(sender,e)=>{if(e.IsValid){labelResult.Text=$"✓ 验证通过";labelResult.ForeColor=Color.Green;}else{labelResult.Text=$"✗ 验证失败,正确答案是:{e.CorrectCode}";labelResult.ForeColor=Color.Red;}};

擦除进度监控

scratchCode.ScratchProgressChanged+=(sender,e)=>{// 更新进度条progressBar1.Value=(int)(e.Progress*100);// 显示百分比labelPercent.Text=$"已擦除:{e.Progress:P0}";};

设置自定义验证码

// 使用自定义验证码(不随机生成)scratchCode.SetCustomCode("A1B2C3");// 完全揭示验证码(用于测试或自动展示)scratchCode.RevealAll();// 重置涂层(重新开始刮)scratchCode.Reset();

完整示例

publicpartialclassForm1:Form{privateScratchCodescratchCode;privateTextBoxtxtInput;privateButtonbtnVerify;privateLabellblResult;publicForm1(){InitializeComponent();InitializeScratchCode();}privatevoidInitializeScratchCode(){// 创建刮刮卡控件scratchCode=newScratchCode{Size=newSize(180,60),Location=newPoint(20,20),CodeType=ScratchCodeType.Alphanumeric,CodeLength=6,BorderColor=Color.FromArgb(24,144,255),BorderWidth=2,CornerRadius=8,EraserSize=25};// 创建输入框txtInput=newTextBox{Location=newPoint(20,90),Size=newSize(100,25),MaxLength=6};// 创建验证按钮btnVerify=newButton{Text="验证",Location=newPoint(130,90),Size=newSize(70,25)};btnVerify.Click+=BtnVerify_Click;// 创建结果标签lblResult=newLabel{Location=newPoint(20,120),Size=newSize(180,25),TextAlign=ContentAlignment.MiddleCenter};// 绑定事件scratchCode.CodeRevealed+=(s,e)=>{lblResult.Text="验证码已揭示,请输入!";lblResult.ForeColor=Color.Blue;txtInput.Focus();};// 添加到窗体this.Controls.Add(scratchCode);this.Controls.Add(txtInput);this.Controls.Add(btnVerify);this.Controls.Add(lblResult);}privatevoidBtnVerify_Click(objectsender,EventArgse){if(string.IsNullOrEmpty(txtInput.Text)){MessageBox.Show("请输入验证码!");return;}boolisValid=scratchCode.Verify(txtInput.Text,ignoreCase:true);if(isValid){lblResult.Text="✓ 验证成功!";lblResult.ForeColor=Color.Green;// 验证成功后生成新的验证码scratchCode.GenerateNewCode();txtInput.Clear();}else{lblResult.Text="✗ 验证失败!";lblResult.ForeColor=Color.Red;txtInput.SelectAll();txtInput.Focus();}}}

事件参数类

ScratchProgressEventArgs

属性类型说明
Progressfloat已擦除百分比(0.0 - 1.0)

VerifyEventArgs

属性类型说明
IsValidbool验证是否成功
Inputstring用户输入的验证码
CorrectCodestring正确的验证码

注意事项

  1. 验证码长度限制:

    • 半角字符(数字/字母):4-12位
    • 汉字:2-6个
  2. 擦除阈值:默认擦除50%以上视为已揭示,触发CodeRevealed事件

  3. 性能考虑:

    • 控件大小建议不超过300x100像素
    • 涂层纹理密度过高可能影响性能
  4. 线程安全:所有UI操作需在UI线程执行

  5. 资源释放:控件会自动管理Bitmap资源,无需手动释放

  6. 汉字支持:汉字验证码使用常用数字汉字(一、二、三…十、百、千、万、亿)

  7. 校验规则:

    • 字母类型默认忽略大小写
    • 汉字类型必须完全匹配
    • 空字符串或null始终返回验证失败
  8. 主题适配:

    • 支持自动跟随全局主题切换(亮色/暗色)
    • 深色模式下验证码显示为亮蓝色,涂层显示为深灰色
    • 可通过FollowGlobalTheme属性禁用自动主题切换

三、后记

陆续补充完善中,敬请关注,如有需求,有好的建议,请留言(xue5zhijing)

← 返回列表