1、問題背景

   在某個類中，用到了一個組合的widget，有按鈕進度條等，類似於視訊播放器按鈕控制區和進度條（參考了很多feiyangqingyun的文章，感謝），除錯正常後整理程式碼，為了提高程式碼可讀性，把widget提到一個單獨的類中，重新命名為FlowPanel，子類化後發現之前設定的widget背景色無法生效。

2、在父類中直接建立widget控制面板

步驟1：

在父控制元件類中直接建立widiget：

flowPanel2=newQWidget(this);

initFlowpanel();

步驟2：呼叫初始化函式，設定元素和樣式

voidPlayWidget::initFlowpanel()

{

    flowPanel2->setObjectName("flowPanel");

    QHBoxLayout*layout=newQHBoxLayout;

    layout->setSpacing(3);

    layout->setMargin(0);

    layout->addStretch();

    flowPanel2->setLayout(layout);

    //按鈕集合

    QList<QString>btns;

    btns<<"btnFlowVideo"<<"btnFlowSnap"<<"btnFlowSound"<<"btnFlowAlarm"<<"btnFlowClose";

    QList<QIcon>icons;

    icons<<QApplication::style()->standardIcon

    icons<<QApplication::style()->standardIcon(QStyle::SP_FileIcon);

    icons<<QApplication::style()->standardIcon(QStyle::SP_DirIcon);

    icons<<QApplication::style()->standardIcon(QStyle::SP_DialogOkButton);

    icons<<QApplication::style()->standardIcon(QStyle::SP_DialogCancelButton);

    //迴圈新增頂部按鈕

    for(inti=0;i<btns.count();i++){

        QPushButton*btn=newQPushButton;

        connect(btn,SIGNAL(clicked(bool)),this,SLOT(btnClicked()));

        //設定標識,用來區別按鈕

        btn->setObjectName(btns.at(i));

        btn->setFixedWidth(20);

        //設定拉伸策略使得填充

        btn->setSizePolicy(QSizePolicy::Preferred,QSizePolicy::Expanding);

        //設定焦點策略

        btn->setFocusPolicy(Qt::NoFocus);

        //設定圖示大小和圖示

        btn->setIconSize(QSize(16,16));

        btn->setIcon(icons.at(i));

        //將按鈕加到佈局中

        layout->addWidget(btn);

    }

    //設定樣式

    flowPanel2->setStyleSheet("#flowPanel{background-color:rgba(0,0,0,30);border:none;}");

}

3、使用子類化建立widget控制面板

因為這個panel要新增多個按鈕，做不同的工作，為了提高程式碼的可讀性，把flowpanel子類化。

問題出來了，子類化後panel的背景色消失了。

修改過程：

步驟1：子類化方式建立panel

//自定義工具欄

    flowPanel=newFlowPanel(this);

步驟2：完成FlowPanel類的建構函式，新增元素和設定樣式。

FlowPanel::FlowPanel(QWidget*parent):QWidget(parent)

{

    this->setObjectName("flowPanel");

    QHBoxLayout*layout=newQHBoxLayout;

   ........ // 全部拷貝的上面的內容，完全一樣

    //設定樣式

    this->setStyleSheet("#flowPanel{background-color:rgba(0,0,0,30);border:none;}");

}

執行效果如下：

4、解決方法

參考大神的部落格：一去二三裡（https://waleon.blog.csdn.net/article/details/50357715）。

重寫繪圖事件，背景色設定正常，和修改前一樣。

void FlowPanel::paintEvent(QPaintEvent *event)

{

    Q_UNUSED(event);

    QStyleOption opt;

    opt.init(this);

    QPainter p(this);

    style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this);

}

程式碼美化後效果如下：

&n