diff --git a/slidepuzzlewidget/Resources/back1.png b/slidepuzzlewidget/Resources/back1.png
new file mode 100644
index 0000000..ff8baa9
Binary files /dev/null and b/slidepuzzlewidget/Resources/back1.png differ
diff --git a/slidepuzzlewidget/Resources/back2.png b/slidepuzzlewidget/Resources/back2.png
new file mode 100644
index 0000000..203e262
Binary files /dev/null and b/slidepuzzlewidget/Resources/back2.png differ
diff --git a/slidepuzzlewidget/Resources/back3.png b/slidepuzzlewidget/Resources/back3.png
new file mode 100644
index 0000000..ba3db89
Binary files /dev/null and b/slidepuzzlewidget/Resources/back3.png differ
diff --git a/slidepuzzlewidget/Resources/back4.png b/slidepuzzlewidget/Resources/back4.png
new file mode 100644
index 0000000..c077c29
Binary files /dev/null and b/slidepuzzlewidget/Resources/back4.png differ
diff --git a/slidepuzzlewidget/frmslidepuzzlewidget.cpp b/slidepuzzlewidget/frmslidepuzzlewidget.cpp
new file mode 100644
index 0000000..1f081ff
--- /dev/null
+++ b/slidepuzzlewidget/frmslidepuzzlewidget.cpp
@@ -0,0 +1,18 @@
+#include "frmslidepuzzlewidget.h"
+
+FrmSlidePuzzleWidget::FrmSlidePuzzleWidget(QWidget *parent)
+	: QWidget(parent)
+{
+	ui.setupUi(this);
+	this->initForm();
+}
+
+FrmSlidePuzzleWidget::~FrmSlidePuzzleWidget()
+{
+
+}
+
+void FrmSlidePuzzleWidget::initForm()
+{
+
+}
diff --git a/slidepuzzlewidget/frmslidepuzzlewidget.h b/slidepuzzlewidget/frmslidepuzzlewidget.h
new file mode 100644
index 0000000..7fd20b1
--- /dev/null
+++ b/slidepuzzlewidget/frmslidepuzzlewidget.h
@@ -0,0 +1,22 @@
+#ifndef FRMSLIDEPUZZLEWIDGET_H
+#define FRMSLIDEPUZZLEWIDGET_H
+
+#include <QtWidgets/QWidget>
+#include "ui_frmslidepuzzlewidget.h"
+
+class FrmSlidePuzzleWidget : public QWidget
+{
+	Q_OBJECT
+
+public:
+	FrmSlidePuzzleWidget(QWidget *parent = 0);
+	~FrmSlidePuzzleWidget();
+
+private:
+	void initForm();
+
+private:
+	Ui::FrmSlidePuzzleWidgetClass ui;
+};
+
+#endif // FRMSLIDEPUZZLEWIDGET_H
diff --git a/slidepuzzlewidget/frmslidepuzzlewidget.qrc b/slidepuzzlewidget/frmslidepuzzlewidget.qrc
new file mode 100644
index 0000000..2637c50
--- /dev/null
+++ b/slidepuzzlewidget/frmslidepuzzlewidget.qrc
@@ -0,0 +1,8 @@
+<RCC>
+    <qresource prefix="/FrmSlidePuzzleWidget">
+        <file>Resources/back1.png</file>
+        <file>Resources/back2.png</file>
+        <file>Resources/back3.png</file>
+        <file>Resources/back4.png</file>
+    </qresource>
+</RCC>
diff --git a/slidepuzzlewidget/frmslidepuzzlewidget.ui b/slidepuzzlewidget/frmslidepuzzlewidget.ui
new file mode 100644
index 0000000..9f46c2d
--- /dev/null
+++ b/slidepuzzlewidget/frmslidepuzzlewidget.ui
@@ -0,0 +1,50 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<ui version="4.0">
+ <class>FrmSlidePuzzleWidgetClass</class>
+ <widget class="QWidget" name="FrmSlidePuzzleWidgetClass">
+  <property name="geometry">
+   <rect>
+    <x>0</x>
+    <y>0</y>
+    <width>600</width>
+    <height>400</height>
+   </rect>
+  </property>
+  <property name="windowTitle">
+   <string>FrmSlidePuzzleWidget</string>
+  </property>
+  <layout class="QVBoxLayout" name="verticalLayout">
+   <property name="spacing">
+    <number>20</number>
+   </property>
+   <property name="leftMargin">
+    <number>20</number>
+   </property>
+   <property name="topMargin">
+    <number>20</number>
+   </property>
+   <property name="rightMargin">
+    <number>20</number>
+   </property>
+   <property name="bottomMargin">
+    <number>20</number>
+   </property>
+   <item>
+    <widget class="SliderPuzzleWidget" name="sliderpuzzleWidget" native="true"/>
+   </item>
+  </layout>
+ </widget>
+ <layoutdefault spacing="6" margin="11"/>
+ <customwidgets>
+  <customwidget>
+   <class>SliderPuzzleWidget</class>
+   <extends>QWidget</extends>
+   <header>sliderpuzzlewidget.h</header>
+   <container>1</container>
+  </customwidget>
+ </customwidgets>
+ <resources>
+  <include location="frmslidepuzzlewidget.qrc"/>
+ </resources>
+ <connections/>
+</ui>
diff --git a/slidepuzzlewidget/main.cpp b/slidepuzzlewidget/main.cpp
new file mode 100644
index 0000000..4c93ffd
--- /dev/null
+++ b/slidepuzzlewidget/main.cpp
@@ -0,0 +1,30 @@
+#pragma execution_character_set("utf-8")
+
+#include "frmslidepuzzlewidget.h"
+#include <QApplication>
+#include <QTextCodec>
+
+int main(int argc, char *argv[])
+{
+	QApplication a(argc, argv);
+	a.setFont(QFont("Microsoft Yahei", 10));
+
+#if (QT_VERSION <= QT_VERSION_CHECK(5,0,0))
+#if _MSC_VER
+	QTextCodec *codec = QTextCodec::codecForName("gbk");
+#else
+	QTextCodec *codec = QTextCodec::codecForName("utf-8");
+#endif
+	QTextCodec::setCodecForLocale(codec);
+	QTextCodec::setCodecForCStrings(codec);
+	QTextCodec::setCodecForTr(codec);
+#else
+	QTextCodec *codec = QTextCodec::codecForName("utf-8");
+	QTextCodec::setCodecForLocale(codec);
+#endif
+
+	FrmSlidePuzzleWidget w;
+	w.setWindowTitle("滑块图片验证码");
+	w.show();
+	return a.exec();
+}
diff --git a/slidepuzzlewidget/puzzlewidget.cpp b/slidepuzzlewidget/puzzlewidget.cpp
new file mode 100644
index 0000000..5491f73
--- /dev/null
+++ b/slidepuzzlewidget/puzzlewidget.cpp
@@ -0,0 +1,81 @@
+#include "puzzlewidget.h"
+
+#include <QPainter>
+#include <QPainterPath>
+#include <QTime>
+#include <QTimer>
+
+const int squarewidth = 46;
+const int squareradius = 20;
+PuzzleWidget::PuzzleWidget(QWidget *parent)
+	: QWidget(parent)
+{
+	m_value = 0;
+	m_offsetPoint = QPoint(0, 0);
+	qsrand(QTime(0, 0, 0).secsTo(QTime::currentTime()));
+}
+
+PuzzleWidget::~PuzzleWidget()
+{
+
+}
+
+void PuzzleWidget::setPixmap(const QString& pixmap)
+{
+	m_pixmap = pixmap;
+	QTimer::singleShot(10, this, SLOT(onUpdatePixmap()));
+}
+
+void PuzzleWidget::onUpdatePixmap()
+{
+	m_offsetPoint.rx() = qBound(0, qrand() % this->width() + squarewidth + squareradius, this->width() - squarewidth - squareradius);
+	m_offsetPoint.ry() = qBound(0, qrand() % this->height() + squarewidth + squareradius, this->height() - squarewidth - squareradius);
+	update();
+}
+
+void PuzzleWidget::setValue(int value)
+{
+	m_value = qBound(0, value, this->width() - squarewidth - squareradius + m_offsetPoint.x());
+	update();
+}
+
+void PuzzleWidget::paintEvent(QPaintEvent *event)
+{
+	QPainter painter(this);
+	painter.setRenderHints(QPainter::Antialiasing);
+	QPainterPath clippath;
+	clippath.addRoundedRect(this->rect(), 4, 4);
+	painter.setClipPath(clippath);
+	const QPixmap& pixmap = QPixmap(m_pixmap).scaled(this->width(), this->height(), Qt::IgnoreAspectRatio, Qt::SmoothTransformation);
+	painter.drawPixmap(0, 0, this->width(), this->height(), pixmap);
+
+	QPainterPath cutoutpath;
+	cutoutpath.setFillRule(Qt::WindingFill);
+	QRect rect(m_offsetPoint, QSize(squarewidth, squarewidth));
+	cutoutpath.addRoundedRect(rect, 2, 2);
+	cutoutpath.addEllipse(rect.center().x() - squareradius / 2, rect.top() - squareradius + 6, squareradius, squareradius);
+	QPainterPath subellipseparh;
+	subellipseparh.addEllipse(rect.right() - squareradius + 6, rect.center().y() - squareradius / 2, squareradius, squareradius);
+	cutoutpath -= subellipseparh;
+
+	painter.setPen(QPen(QColor(80, 80, 80), 1));
+	painter.setBrush(QColor(100, 100, 100, 220));
+	painter.drawPath(cutoutpath);
+
+	QPixmap puzzlePixmap(this->size());
+	puzzlePixmap.fill(Qt::transparent);
+	QPainter puzzlePainter(&puzzlePixmap);
+	puzzlePainter.setRenderHints(QPainter::Antialiasing);
+	puzzlePainter.setClipPath(cutoutpath);
+	puzzlePainter.setPen(QPen(QColor(80, 80, 80), 2));
+	puzzlePainter.setBrush(QColor(200, 200, 200, 100));
+	puzzlePainter.drawPixmap(0, 0, this->width(), this->height(), pixmap);
+	puzzlePainter.drawPath(cutoutpath);
+
+	painter.drawPixmap(-m_offsetPoint.x() + m_value, 0, this->width(), this->height(), puzzlePixmap);
+}
+
+bool PuzzleWidget::isOverlap()
+{
+	return qAbs(-m_offsetPoint.x() + m_value) < 5;
+}
\ No newline at end of file
diff --git a/slidepuzzlewidget/puzzlewidget.h b/slidepuzzlewidget/puzzlewidget.h
new file mode 100644
index 0000000..1181075
--- /dev/null
+++ b/slidepuzzlewidget/puzzlewidget.h
@@ -0,0 +1,34 @@
+#ifndef PUZZLEWIDGET_H
+#define PUZZLEWIDGET_H
+
+#include <QWidget>
+
+class PuzzleWidget : public QWidget
+{
+	Q_OBJECT
+	Q_PROPERTY(QString pixmap READ getPixmap WRITE setPixmap)
+
+public:
+	PuzzleWidget(QWidget *parent);
+	~PuzzleWidget();
+
+public:
+	QString getPixmap() const { return m_pixmap; };
+	void setPixmap(const QString& pixmap);
+
+	void setValue(int value);
+	bool isOverlap();
+
+private slots:
+	void onUpdatePixmap();
+
+protected:
+	void paintEvent(QPaintEvent *event);
+
+private:
+	int m_value;
+	QString m_pixmap;
+	QPoint m_offsetPoint;
+};
+
+#endif // PUZZLEWIDGET_H
diff --git a/slidepuzzlewidget/slidepuzzlewidget.pro b/slidepuzzlewidget/slidepuzzlewidget.pro
new file mode 100644
index 0000000..3e220f4
--- /dev/null
+++ b/slidepuzzlewidget/slidepuzzlewidget.pro
@@ -0,0 +1,29 @@
+# ----------------------------------------------------
+# This file is generated by the Qt Visual Studio Add-in.
+# ------------------------------------------------------
+
+QT       += core gui
+
+greaterThan(QT_MAJOR_VERSION, 4): QT += widgets
+
+TEMPLATE = app
+TARGET   = slidepuzzlewidget
+DESTDIR  = $$PWD/../bin
+
+CONFIG   += warn_off
+
+HEADERS += frmslidepuzzlewidget.h
+HEADERS += puzzlewidget.h
+HEADERS += sliderpuzzlewidget.h
+
+SOURCES += main.cpp
+SOURCES += frmslidepuzzlewidget.cpp
+SOURCES += puzzlewidget.cpp
+SOURCES += sliderpuzzlewidget.cpp
+
+FORMS += frmslidepuzzlewidget.ui
+FORMS += sliderpuzzlewidget.ui
+
+RESOURCES += frmslidepuzzlewidget.qrc
+
+
diff --git a/slidepuzzlewidget/sliderpuzzlewidget.cpp b/slidepuzzlewidget/sliderpuzzlewidget.cpp
new file mode 100644
index 0000000..d3987fd
--- /dev/null
+++ b/slidepuzzlewidget/sliderpuzzlewidget.cpp
@@ -0,0 +1,49 @@
+#pragma execution_character_set("utf-8")
+#include "sliderpuzzlewidget.h"
+
+#include <QTimer>
+#include <QMessageBox>
+
+SliderPuzzleWidget::SliderPuzzleWidget(QWidget *parent)
+	: QWidget(parent)
+{
+	ui.setupUi(this);
+	this->initForm();
+}
+
+SliderPuzzleWidget::~SliderPuzzleWidget()
+{
+
+}
+
+void SliderPuzzleWidget::initForm()
+{
+	QTimer::singleShot(10, this, SLOT(onUpdateWidget()));
+	connect(ui.horizontalSlider, &QSlider::valueChanged, this, &SliderPuzzleWidget::onSliderValueChanged);
+	connect(ui.horizontalSlider, &QSlider::sliderReleased, this, &SliderPuzzleWidget::onSliderReleased);
+	ui.puzzlewidget->setPixmap(":/FrmSlidePuzzleWidget/Resources/back1.png");
+}
+
+void SliderPuzzleWidget::onUpdateWidget()
+{
+	ui.horizontalSlider->setRange(0, this->width());
+}
+
+void SliderPuzzleWidget::onSliderValueChanged(int value)
+{
+	ui.puzzlewidget->setValue(value);
+}
+
+void SliderPuzzleWidget::onSliderReleased()
+{
+	QString content = ui.puzzlewidget->isOverlap() ? "验证成功！" : "验证失败！";
+	QMessageBox msgBox;
+	msgBox.setWindowTitle("滑块图片验证码");
+	msgBox.setText(content);
+	msgBox.exec();
+
+	static int testIndex = 1;
+	testIndex = testIndex + 1 > 4 ? 1 : testIndex + 1;
+	ui.horizontalSlider->setValue(0);
+	ui.puzzlewidget->setPixmap(QString(":/FrmSlidePuzzleWidget/Resources/back%1.png").arg(testIndex));
+}
\ No newline at end of file
diff --git a/slidepuzzlewidget/sliderpuzzlewidget.h b/slidepuzzlewidget/sliderpuzzlewidget.h
new file mode 100644
index 0000000..99875bf
--- /dev/null
+++ b/slidepuzzlewidget/sliderpuzzlewidget.h
@@ -0,0 +1,27 @@
+#ifndef SLIDERPUZZLEWIDGET_H
+#define SLIDERPUZZLEWIDGET_H
+
+#include <QWidget>
+#include "ui_sliderpuzzlewidget.h"
+
+class SliderPuzzleWidget : public QWidget
+{
+	Q_OBJECT
+
+public:
+	SliderPuzzleWidget(QWidget *parent = 0);
+	~SliderPuzzleWidget();
+
+private:
+	void initForm();
+
+private slots:
+	void onUpdateWidget();
+	void onSliderValueChanged(int value);
+	void onSliderReleased();
+
+private:
+	Ui::SliderPuzzleWidget ui;
+};
+
+#endif // SLIDERPUZZLEWIDGET_H
diff --git a/slidepuzzlewidget/sliderpuzzlewidget.ui b/slidepuzzlewidget/sliderpuzzlewidget.ui
new file mode 100644
index 0000000..10a0d8f
--- /dev/null
+++ b/slidepuzzlewidget/sliderpuzzlewidget.ui
@@ -0,0 +1,55 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<ui version="4.0">
+ <class>SliderPuzzleWidget</class>
+ <widget class="QWidget" name="SliderPuzzleWidget">
+  <property name="geometry">
+   <rect>
+    <x>0</x>
+    <y>0</y>
+    <width>717</width>
+    <height>320</height>
+   </rect>
+  </property>
+  <property name="windowTitle">
+   <string>SliderPuzzleWidget</string>
+  </property>
+  <layout class="QVBoxLayout" name="verticalLayout">
+   <property name="spacing">
+    <number>14</number>
+   </property>
+   <property name="leftMargin">
+    <number>0</number>
+   </property>
+   <property name="topMargin">
+    <number>0</number>
+   </property>
+   <property name="rightMargin">
+    <number>0</number>
+   </property>
+   <property name="bottomMargin">
+    <number>0</number>
+   </property>
+   <item>
+    <widget class="PuzzleWidget" name="puzzlewidget" native="true"/>
+   </item>
+   <item>
+    <widget class="QSlider" name="horizontalSlider">
+     <property name="orientation">
+      <enum>Qt::Horizontal</enum>
+     </property>
+    </widget>
+   </item>
+  </layout>
+ </widget>
+ <layoutdefault spacing="6" margin="11"/>
+ <customwidgets>
+  <customwidget>
+   <class>PuzzleWidget</class>
+   <extends>QWidget</extends>
+   <header>puzzlewidget.h</header>
+   <container>1</container>
+  </customwidget>
+ </customwidgets>
+ <resources/>
+ <connections/>
+</ui>