Qt绘制滑动验证

在登陆界面中，经常用到滑动验证的方式，来确保账号安全
效果图：
样式1

样式2

头文件

#ifndef QWHSLIDERVERIFICATION_H
#define QWHSLIDERVERIFICATION_H

#include <QWidget>
#include <QPaintEvent>
#include <QMouseEvent>
#include <QResizeEvent>
#include <QPainter>
#include <QTime>

class QWHSliderVerification : public QWidget
{
    Q_OBJECT
    Q_ENUMS(SliderType)
public:
    enum SliderType
    {
        SliderType_Normal,  //标准滑块验证方式
        SliderType_Picture  //图片滑块验证方式
    };

    explicit QWHSliderVerification(QWidget *parent = nullptr);
    ~QWHSliderVerification();

protected:
    void paintEvent(QPaintEvent *);
    void mousePressEvent(QMouseEvent *event);
    void mouseMoveEvent(QMouseEvent *event);
    void mouseReleaseEvent(QMouseEvent *event);
    void resizeEvent(QResizeEvent *event);

    void drawNormalSlider(QPainter *painter);
    void drawPictureSlider(QPainter *painter);

private:
    QPainterPath pixPath(const QRectF pixRect);
signals:
    void passVerification(bool verification);
public slots:
private:
    int m_sliderX;                  //滑块左侧位置
    int m_sliderWidth;              //滑块宽度
    int m_sliderHeight;             //滑块高度
    float m_sliderWRatioH;          //滑块宽度与高度比值，值为0+，推荐1.2
    int m_pointLeftWidth;           //鼠标按下点距滑块左侧距离
    bool m_pressedInSlider;         //鼠标是否按下且在滑块中
    bool m_passVerification;        //是否通过验证

    QColor m_sliderBorderColor;     //边框颜色
    QColor m_sliderBgColor;         //滑动条背景颜色
    QColor m_sliderTipTextColor;    //滑动条提示文本颜色
    QColor m_sliderBlockMoveColor;  //滑块划过区域颜色
    QColor m_sliderBlockBgColor;    //滑块背景色
    QColor m_sliderBlockTextColor;  //滑块文本颜色

    QColor m_topRectColor;          //图片样式中：上方图片滑块背景颜色
    int m_picLRMargin;              //图片样式中：滑块离左右两侧边距
    float m_picTopPosRatioH;        //图片样式中：滑块图片离顶部边距与控件高度比值，值为0-1，推荐0.1

    QTime m_pressTime;              //滑块按下时间
    QTime m_releaseTime;            //滑块释放时间
    SliderType m_sliderType;        //滑块验证样式
};

#endif // QWHSLIDERVERIFICATION_H

核心代码

void QWHSliderVerification::paintEvent(QPaintEvent *)
{
    QPainter painter(this);
    painter.setRenderHints(QPainter::Antialiasing | QPainter::TextAntialiasing);

	if (m_sliderType == SliderType_Normal)
	{
    	drawNormalSlider(&painter);
	}
	else if (m_sliderType == SliderType_Picture)
	{
    	drawPictureSlider(&painter);
	}
}

void QWHSliderVerification::drawNormalSlider(QPainter *painter)
{
    painter->save();

    int width = this->width();
    int height = this->height();

    QFont font;
    font.setPixelSize(height / 2.0);
    painter->setFont(font);

    //绘制背景
    painter->setPen(Qt::NoPen);
    painter->setBrush(m_sliderBgColor);
    painter->drawRect(rect());

    if (!m_passVerification)
    {
        //绘制滑块
        painter->setPen(m_sliderBorderColor);
        painter->setBrush(m_sliderBlockBgColor);
        painter->drawRect(QRect(m_sliderX, 0, m_sliderWidth, m_sliderHeight));
        //绘制滑块文字
        painter->setPen(QPen(m_sliderBlockTextColor));
        painter->setBrush(Qt::NoBrush);
        painter->drawText(QRect(m_sliderX, 0, height * 1.2, height), Qt::AlignCenter, QString(">>"));
        //绘制滑块滑过的区域
        painter->setPen(Qt::NoPen);
        painter->setBrush(m_sliderBlockMoveColor);
        painter->drawRect(QRect(0, 0, m_sliderX, height));
        //绘制提示文字
        painter->setPen(m_sliderTipTextColor);
        painter->setBrush(Qt::NoBrush);
        painter->drawText(QRect(0, 0, width, height), Qt::AlignCenter, QStringLiteral("请按住滑块，拖动到最右边"));
    }
    //验证通过后
    else if (m_passVerification)
    {
        //绘制滑块滑过的区域
        painter->setPen(Qt::NoPen);
        painter->setBrush(m_sliderBlockMoveColor);
        painter->drawRect(QRect(0, 0, m_sliderX, height));
        //绘制提示文字
        painter->setPen(m_sliderBgColor);
        painter->setBrush(Qt::NoBrush);
        painter->drawText(QRect(0, 0, width, height), Qt::AlignCenter, QStringLiteral("验证通过"));
        //绘制滑块
        painter->setPen(m_sliderBorderColor);
        painter->setBrush(m_sliderBgColor);
        painter->drawRect(m_sliderX, 0, m_sliderWidth, m_sliderHeight);
        //绘制滑块内容
        painter->setBrush(m_sliderBlockMoveColor);
        painter->drawEllipse(QPoint(m_sliderX + height * 0.6, height / 2.0), (int)(height * 0.3), (int)(height * 0.3));
        painter->setPen(QPen(m_sliderBlockBgColor, height / 15.0, Qt::SolidLine, Qt::RoundCap, Qt::MiterJoin));
        painter->setBrush(Qt::NoBrush);
        QVector<QPointF> points;
        points.push_back(QPointF(m_sliderX + height * 0.42, height / 2.0));
        points.push_back(QPointF(m_sliderX + height * 0.54, height * 0.65));
        points.push_back(QPointF(m_sliderX + height * 0.54, height * 0.65));
        points.push_back(QPointF(m_sliderX + height * 0.78, height * 0.35));
        painter->drawLines(points);
    }

    painter->restore();
}