當(dāng)前位置：首頁(yè) > 编程语言 > c/c++ >内容正文

c/c++

QT 控件重绘

發(fā)布時(shí)間：2023/12/14 c/c++ 23 豆豆

生活随笔收集整理的這篇文章主要介紹了 QT 控件重绘小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

前言：

轉(zhuǎn)載請(qǐng)附上連接,本帖原創(chuàng)請(qǐng)勿照抄。

????? QT重繪控件是指通過實(shí)現(xiàn)控件頭文件，使用QSS或者樣式表來(lái)對(duì)某個(gè)控件進(jìn)行重新繪制。

????? 1、重繪QButton按鈕；2、重繪QComboBox下拉框；3、其它控件重繪的辦法。

1. 重繪QButton

????? 重繪控件感覺一般在VS里面開發(fā)的時(shí)候，使用重繪比較方便，相對(duì)于關(guān)聯(lián)控件設(shè)置來(lái)說，直接代碼重繪要比關(guān)聯(lián)控件要便捷，如果使用QT Creator來(lái)進(jìn)行開發(fā)的話個(gè)人感覺還是拖控件再用樣式表較為方便。

//.h 源文件 //引入按鈕抬頭 #include<QPushButton> //.cpp實(shí)現(xiàn)文件QPushButton *button1= new QPushButton(this);QPushButton *button2= new QPushButton(this);QPushButton *button3= new QPushButton(this);//new完記得刪除指針//背景QPalette pal;pal.setColor(QPalette::ButtonText, QColor(255, 255, 255));//定義按鈕大小背景//setStyleSheet注釋因?yàn)樵跇邮奖韺懺赒SS里面button1->setText("按鈕1");button1->setGeometry(40,120,93,28);//93 28button1->setObjectName("btn1");//button1->setStyleSheet("background-color:rgb(17,17,17);");button1->setPalette(pal);button2->setText("按鈕2");button2->setGeometry(140,120,120,28);button2->setObjectName("btn2");//button2->setStyleSheet("font-size:200px;");button2->setPalette(pal);button3->setText("按鈕3");button3->setGeometry(340,120,120,28);button3->setObjectName("btn3");//button3->setStyleSheet("font-size:200px;");button3->setPalette(pal);//顯示按鈕button1->show();button2->show();button3->show();//關(guān)聯(lián)槽函數(shù)connect(button1, SIGNAL(clicked()), this, SLOT(chooseBtn()));connect(button2, SIGNAL(clicked()), this, SLOT(chooseBtn()));connect(button3, SIGNAL(clicked()), this, SLOT(chooseBtn())); //QSS樣式表 myqss.qss QPushButton{background:qlineargradient(spread:pad, x1:0.460227, y1:0, x2:0.465818, y2:0.875, stop:0 rgba(170, 255, 255, 255), stop:1 rgba(255, 255, 255, 255));border-radius:8px;border:2px solid rgb(0, 170, 255);color:rgb(17,17,17); } QPushButton:hover{background:qlineargradient(spread:pad, x1:0.460227, y1:0, x2:0.443091, y2:0.898, stop:0 rgba(0, 255, 255, 255), stop:1 rgba(255, 255, 255, 255)) }QPushButton:hover:pressed{background:qlineargradient(spread:pad, x1:0.460227, y1:0, x2:0.465818, y2:0.875, stop:0 rgba(170, 255, 255, 255), stop:1 rgba(255, 255, 255, 255)); } #btn2{background:qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1, stop:0 rgba(211 ,239 ,250 ,255 ), stop:0.12 rgba(208 ,241 ,250 ,255 ),stop:0.21 rgba(215 ,227 ,243 ,255 ), stop:0.3 rgba(214 ,233 ,247 ,255 ),stop:0.364 rgba(218 ,215 ,236 ,255 ),stop:0.459 rgba(220 ,200 ,229 ,255 ),stop:0.7 rgba(227 ,194 ,225 ,255 ),stop:0.9 rgba(233 ,166 ,209 ,255 ),stop:0.92 rgba(236 ,159 ,189 ,255 ),stop:1 rgba(237 ,153 ,202 , 255));border-radius:8px;border:2px solid rgb(0, 170, 255);color:red; } #btn3{background:qlineargradient(spread:pad, x1:0.460227, y1:0, x2:0.465818, y2:0.875, stop:0 rgba(255, 69, 0, 255), stop:1 rgba(255, 255, 255, 255));border-radius:8px;border:2px solid rgb(255, 127, 80) }

QSS樣式表引入可以借鑒

https://blog.csdn.net/qq_37529913/article/details/109288422

2、重繪QComboBox下拉框

????? 部分定制樣式可以借鑒該博客：https://www.cnblogs.com/bclshuai/p/9809679.html

????? 其實(shí)大部分樣式也可以借鑒CSS樣式來(lái)做大部分樣式是和CSS通用的，可以進(jìn)行嘗試。

//上面的下拉框控件重繪過后的 //下面的下拉框控件是默認(rèn)的 //.h源文件 #include<QComboBox> //.cpp實(shí)現(xiàn)文件//可編輯模式ui->comboBox->setEditable(true);ui->comboBox_2->setEditable(true);/** #comboBox* combobox-popup Value(0、1)兩個(gè)下拉框樣式,默認(rèn)0* border:2px solid #2080F7; Value 邊框圓滑程度(不設(shè)置顏色邊框默認(rèn)白色)** #comboBox:hover* background-color 觸發(fā)背景* color 字體* border comboBox邊框** #comboBox::down-arrow 下拉框按鈕圖標(biāo)* #comboBox::down-arrow:on 下拉框按鈕圖標(biāo)* #comboBox::drop-down 下拉框按鈕圖標(biāo)設(shè)置** #comboBox* QAbstractItemView::item 下拉列表樣式* QAbstractItemView::item:hover 下拉列表樣式** #comboBox* QAbstractScrollArea QScrollBar::vertical 垂直滾動(dòng)條** #comboBox* QScrollBar::handle::vertical 垂直滾動(dòng)條滑塊屬性設(shè)置*/QString style ="#comboBox {combobox-popup: 0; border:2px solid #2080F7;}""#comboBox:hover{background-color:white;color: black;border:1px;border-color:rgb(2,141,193);border-style:solid;}""#comboBox::down-arrow{width: 16px;height: 16px;image: url(:./01.png);}""#comboBox::down-arrow:on{image: url(:./02.png);}""#comboBox::drop-down{subcontrol-origin: padding;subcontrol-position: right;width: 20px;border: 0px;}""#comboBox QAbstractItemView::item{height: 30px;min-height:30px;color:rgb(0,0,0);background-color:white;}""#comboBox QAbstractItemView::item:hover{color:rgb(0,0,0);background-color:rgb(2,141,193);}""#comboBox QAbstractScrollArea QScrollBar::vertical{background-color:white;width: 12px;}""#comboBox QScrollBar::handle::vertical {width: 12px;background:rgb(112,112,112);}";ui->comboBox->setStyleSheet(style);QStringList list;list << "test1" << "test2" << "test3" << "test4" << "test5"<< "test6"<< "test7" << "test8"<< "test9"<< "test10"<< "test11"<< "test12";ui->comboBox->addItems(list);ui->comboBox_2->addItems(list);ui->comboBox->setView(new QListView());ui->comboBox->setMaxVisibleItems(10);

下拉框樣式和控制：https://blog.csdn.net/imred/article/details/78158238

CSS樣式W3C：https://www.w3school.com.cn/cssref/pr_border-style.asp

滾動(dòng)條垂直水平和樣式控制：http://www.voidcn.com/article/p-wgnigvhf-brr.html

全面的QSS樣式：https://www.cnblogs.com/bclshuai/p/9809679.html

3、其它控件重繪的辦法。

????? 其實(shí)控件重繪的辦法都是類似的，重繪定制每個(gè)空間的樣式都需要按照每個(gè)空間的方法來(lái)通過樣式表來(lái)進(jìn)行重繪定制某個(gè)部分。

????? 接下來(lái)會(huì)發(fā)布正則驗(yàn)證、自繪圖形、C\S架構(gòu)的服務(wù)器和客戶端