【WinForm UI控件系列】SliderCaptcha 支持拖动滑块验证码、旋转角度验证码、依次点击文本验证码、其他验证控件（手势锁屏、刮刮乐）

SliderCaptcha 是一个基于 web 设计风格的滑动验证码控件，支持多种验证类型：拼图滑块验证、旋转验证和文字顺序点击验证。

相关控件scratchCode：https://blog.csdn.net/uaime/article/details/161099147

相关控件imageLockScreen（图形解锁验证控件）见相关链接

一、示例演示

1.1 拖动滑块验证码、旋转A角度验证码、依次点击文本验证码

1.2 手势图案绘制解锁控件（imageLockScreen）

1.3 刮刮乐控件（scratchCode）

参考阅读：https://blog.csdn.net/uaime/article/details/161099147

二、使用文档

SliderCaptcha 滑动验证码控件

概述

SliderCaptcha 是一个基于 web 设计风格的滑动验证码控件，支持多种验证类型：拼图滑块验证、旋转验证和文字顺序点击验证。

功能特性

多种验证类型：拼图滑块、旋转验证、文字顺序点击
丰富的滑块样式：圆形、方形、五角星、三角形等多种拼图形状
自定义背景：支持自定义背景图片
验证反馈：成功/失败状态动画提示
主题适配：支持亮色/暗色主题切换
右键刷新：右键点击可刷新验证码
事件通知：验证完成时触发 ValidationCompleted 事件

验证类型

1. 拼图滑块验证 (CaptchaType.Puzzle)

用户拖动滑块将拼图块移动到空缺位置完成验证。

特性：

随机生成拼图形状和位置
空缺位置在右2/3区域内随机生成
支持多种拼图形状（圆形、方形、五角星等）

2. 旋转验证 (CaptchaType.Rotate)

用户拖动滑块旋转字母 A 到目标角度完成验证。

特性：

目标角度随机生成（20-340度）
初始角度与目标角度相差60-180度
实时显示目标角度和当前角度
容错范围15度

3. 文字顺序点击验证 (CaptchaType.Text)

用户按照提示顺序依次点击显示的字符完成验证。

特性：

随机生成4个字符的顺序
字符随机分布，确保不重叠
点击区域40x40像素
按提示顺序点击即可验证成功

属性列表

属性名	类型	说明	默认值
CaptchaType	CaptchaType	验证码类型（Puzzle/Rotate/Text）	Puzzle
PuzzleShape	PuzzleShape	拼图形状（Circle/Square/Star/Triangle/Diamond/Pentagon）	Circle
BackgroundImage	Image	自定义背景图片（拼图模式）	null
SuccessColor	Color	成功状态颜色	#52c41a
FailedColor	Color	失败状态颜色	#ff4d4f
HintText	string	提示文字	"请拖动滑块完成验证"
HintTextColor	Color	提示文字颜色	#e6e6e6

事件

事件名	说明	参数
ValidationCompleted	验证完成时触发	CaptchaResult（Success/Failed）

使用示例

基本用法

csharp 复制代码

using AntdUIEx.Controls;
using AntdUIEx.Enum;

// 创建滑动验证码控件
var sliderCaptcha = new SliderCaptcha();
sliderCaptcha.Dock = DockStyle.Fill;
sliderCaptcha.CaptchaType = CaptchaType.Puzzle;
sliderCaptcha.PuzzleShape = PuzzleShape.Star;

// 设置自定义背景图片
sliderCaptcha.BackgroundImage = Image.FromFile("images/2.jpg");

// 订阅验证完成事件
sliderCaptcha.ValidationCompleted += (sender, result) =>
{
    if (result == CaptchaResult.Success)
    {
        MessageBox.Show("验证成功！");
    }
    else
    {
        MessageBox.Show("验证失败，请重试！");
    }
};

this.Controls.Add(sliderCaptcha);

旋转验证模式

csharp 复制代码

var sliderCaptcha = new SliderCaptcha();
sliderCaptcha.CaptchaType = CaptchaType.Rotate;
sliderCaptcha.HintText = "拖动旋转字母到目标角度";

文字顺序点击模式

csharp 复制代码

var sliderCaptcha = new SliderCaptcha();
sliderCaptcha.CaptchaType = CaptchaType.Text;
sliderCaptcha.HintText = "请依次点击:";

切换验证类型

csharp 复制代码

// 切换到拼图模式
sliderCaptcha.CaptchaType = CaptchaType.Puzzle;

// 切换到旋转模式
sliderCaptcha.CaptchaType = CaptchaType.Rotate;

// 切换到文字点击模式
sliderCaptcha.CaptchaType = CaptchaType.Text;

重置验证码

csharp 复制代码

// 方法1：调用 Reset 方法
sliderCaptcha.Reset();

// 方法2：用户右键点击控件自动刷新

验证码类型枚举

csharp 复制代码

public enum CaptchaType
{
    /// <summary>
    /// 拼图滑块验证
    /// </summary>
    Puzzle,
    
    /// <summary>
    /// 旋转验证
    /// </summary>
    Rotate,
    
    /// <summary>
    /// 文字顺序点击验证
    /// </summary>
    Text
}

拼图形状枚举

csharp 复制代码

public enum PuzzleShape
{
    /// <summary>
    /// 圆形
    /// </summary>
    Circle,
    
    /// <summary>
    /// 方形
    /// </summary>
    Square,
    
    /// <summary>
    /// 五角星
    /// </summary>
    Star,
    
    /// <summary>
    /// 三角形
    /// </summary>
    Triangle,
    
    /// <summary>
    /// 菱形
    /// </summary>
    Diamond,
    
    /// <summary>
    /// 五边形
    /// </summary>
    Pentagon
}

验证结果枚举

csharp 复制代码

public enum CaptchaResult
{
    /// <summary>
    /// 验证成功
    /// </summary>
    Success,
    
    /// <summary>
    /// 验证失败
    /// </summary>
    Failed
}

设计时支持

SliderCaptcha 控件完全支持 Visual Studio 设计器：

在属性窗口中可直接切换验证码类型
实时预览不同验证模式的外观
属性修改即时生效

注意事项

背景图片：建议使用尺寸适中的图片，过大的图片可能影响性能
控件大小：建议设置控件最小尺寸为 300x200，以确保正常显示
右键刷新：用户可通过右键点击刷新验证码，无需额外添加刷新按钮
主题适配：控件会自动跟随全局主题切换，也可通过 FollowGlobalTheme 属性控制

三、后记

更多控件，敬请关注，如有需求、好的建议，请留言(xue5zhijing)