Qt如何實(shí)現(xiàn)高亮按鈕控件

這篇文章主要介紹Qt如何實(shí)現(xiàn)高亮按鈕控件，文中介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們一定要看完！

一、前言

這個高亮按鈕控件并非本人原創(chuàng)作品，是參考的Qt界的一個大師級人物公孫二狗的作品，各位有興趣可以去搜索查看，在原作者的代碼上，我只是改成了自己的控件的框架結(jié)構(gòu)，然后完善了一些細(xì)節(jié)，比如增加了各種顏色設(shè)置，提供直接切換顏色模擬交通燈等。

其實(shí)整個編程學(xué)習(xí)過程都是一個不斷學(xué)習(xí)借鑒的過程，不斷參考別人的代碼，參考自帶demo的代碼，參考幫助文檔，面向搜索編程等，遇到問題不斷的先自己努力解決，并思考如何更好的辦法，建議學(xué)習(xí)編程的過程中，多看幫助文檔很重要，基本上涵蓋了所有函數(shù)的說明，起碼基本說明是有的，然后參考自帶的demo，這樣幾年搞下來，保準(zhǔn)水平蹭蹭蹭的上漲。

高亮按鈕控件功能：

1. 可設(shè)置文本,居中顯示

2. 可設(shè)置文本顏色

3. 可設(shè)置外邊框漸變顏色

4. 可設(shè)置里邊框漸變顏色

5. 可設(shè)置背景色

6. 可直接調(diào)用內(nèi)置的設(shè)置 綠色/紅色/黃色/黑色/藍(lán)色 等公有槽函數(shù)

7. 可設(shè)置是否在容器中可移動,當(dāng)成一個對象使用

8. 可設(shè)置是否顯示矩形

9. 可設(shè)置報(bào)警顏色+非報(bào)警顏色

10. 可控制啟動報(bào)警和停止報(bào)警,報(bào)警時閃爍

二、代碼思路

//繪制外邊框
void LightButton::drawBorderOut(QPainter *painter)
{
    int radius = 99;
    painter->save();
    painter->setPen(Qt::NoPen);
    QLinearGradient borderGradient(0, -radius, 0, radius);
    borderGradient.setColorAt(0, borderOutColorStart);
    borderGradient.setColorAt(1, borderOutColorEnd);
    painter->setBrush(borderGradient);
    painter->drawEllipse(-radius, -radius, radius * 2, radius * 2);
    painter->restore();
}
//繪制內(nèi)邊框
void LightButton::drawBorderIn(QPainter *painter)
{
    int radius = 90;
    painter->save();
    painter->setPen(Qt::NoPen);
    QLinearGradient borderGradient(0, -radius, 0, radius);
    borderGradient.setColorAt(0, borderInColorStart);
    borderGradient.setColorAt(1, borderInColorEnd);
    painter->setBrush(borderGradient);
    painter->drawEllipse(-radius, -radius, radius * 2, radius * 2);
    painter->restore();
}
//繪制主背景
void LightButton::drawBg(QPainter *painter)
{
    int radius = 80;
    painter->save();
    painter->setPen(Qt::NoPen);
    painter->setBrush(bgColor);
    painter->drawEllipse(-radius, -radius, radius * 2, radius * 2);
    painter->restore();
}
//繪制文字
void LightButton::drawText(QPainter *painter)
{
    if (text.isEmpty()) {
        return;
    }

    int radius = 100;
    painter->save();

    QFont font;
    font.setPixelSize(85);
    painter->setFont(font);
    painter->setPen(textColor);
    QRect rect(-radius, -radius, radius * 2, radius * 2);
    painter->drawText(rect, Qt::AlignCenter, text);
    painter->restore();
}
//繪制遮罩層
void LightButton::drawOverlay(QPainter *painter)
{
    if (!showOverlay) {
        return;
    }

    int radius = 80;
    painter->save();
    painter->setPen(Qt::NoPen);

    QPainterPath smallCircle;
    QPainterPath bigCircle;
    radius -= 1;
    smallCircle.addEllipse(-radius, -radius, radius * 2, radius * 2);
    radius *= 2;
    bigCircle.addEllipse(-radius, -radius + 140, radius * 2, radius * 2);

    //高光的形狀為小圓扣掉大圓的部分
    QPainterPath highlight = smallCircle - bigCircle;

    QLinearGradient linearGradient(0, -radius / 2, 0, 0);
    overlayColor.setAlpha(100);
    linearGradient.setColorAt(0.0, overlayColor);
    overlayColor.setAlpha(30);
    linearGradient.setColorAt(1.0, overlayColor);
    painter->setBrush(linearGradient);
    painter->rotate(-20);
    painter->drawPath(highlight);

    painter->restore();
}

三、效果圖

以上是“Qt如何實(shí)現(xiàn)高亮按鈕控件”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對大家有幫助，更多相關(guān)知識，歡迎關(guān)注億速云行業(yè)資訊頻道！