【Qt】qt自定义开关控件

基于QWidget实现一个简单的开关控件，左右动画效果切换，效果如下

样式在paintEvent中绘制

void RdSwitchButton::paintEvent(QPaintEvent *event)
{
    QPainter painter(this);
    painter.setRenderHint(QPainter::Antialiasing);
    painter.setPen(Qt::gray);
    painter.setBrush(m_normalColor);
    painter.drawRect(this->rect());

    painter.setPen(Qt::NoPen);
    painter.setBrush(m_selectColor);
    QRect selectRect;
    selectRect = QRect(m_xVal, 0, this->width()/2, this->height());
    painter.drawRect(selectRect);

    painter.setPen(m_leftPenColor);
    painter.drawText(QRect(0, 0, this->width()/2, this->height()), Qt::AlignCenter, m_leftText);
    painter.setPen(m_rightPenColor);
    painter.drawText(QRect(this->width()/2, 0, this->width()/2, this->height()), Qt::AlignCenter, m_rightText);

    QWidget::paintEvent(event);
}

mouseReleaseEvent触发开关切换

void RdSwitchButton::mouseReleaseEvent(QMouseEvent *event)
{
    QPoint curPos = event->pos();
    bool bChecked = curPos.x() <= this->width()/2 ? false : true;
    if(bChecked == m_bChecked)
        return;
    m_bChecked = bChecked;
    m_xVal = bChecked == false ? this->width()/2 : 0;
    m_pTimer->start();


    QWidget::mouseReleaseEvent(event);
}

定时器实现动画效果

    m_pTimer = new QTimer(this);
    m_pTimer->setInterval(20);
    connect(m_pTimer, &QTimer::timeout, this, &RdSwitchButton::onTimeout);

void RdSwitchButton::onTimeout()
{
    if(!m_bChecked) {
        m_xVal -= 6;
        if(m_xVal <= 0) {
            m_xVal = 0;
            m_leftPenColor = Qt::white;
            m_rightPenColor = Qt::black;
            m_pTimer->stop();
            QTimer::singleShot(10, this, [=]{
                emit sigClick(m_bChecked);
            });
        }
    }
    else {
        m_xVal += 6;
        if(m_xVal >= this->width()/2) {
            m_xVal = this->width()/2;
            m_leftPenColor = Qt::black;
            m_rightPenColor = Qt::white;
            m_pTimer->stop();
            QTimer::singleShot(10, this, [=]{
                emit sigClick(m_bChecked);
            });
        }
    }
    update();
}

实现比较简单，简单记录一下

完整的代码下载

csdn下载