Qt在設置窗口邊框圓角時有兩種方式,一種是設置樣式,另一種是在paintEvent事件中繪制窗口。下面分別敘述用這兩種方式來實現窗口邊框圓角的效果。
一、使用setStyleSheet方法
this->setStyleSheet(“QWidget{background-color:gray;border-top-left-radius:15px;border-top-right-radius:5px;}”));
使用的主要是使用border-radius 屬性,關於這個屬性,可選的樣式有
border-top-left-radius 設置左上角圓角;
border-top-right-radius 設置右上角圓角;
border-bottom-left-radius 設置左下角圓角;
border-bottom-right-radius 設置右下角圓角;
border-radius 設置四個角圓角;
關於border-radius 后面的參數
(1)一個參數
border-radius:15px
(2)兩個參數
border-radius: 15px 50px
第一個參數設置X軸方向的半徑
第二個參數設置Y軸方向的半徑
從圖中可以看出設置一個參數代表X軸和Y軸設置了同樣的值,而兩個參數分別為X軸和Y軸方向的半徑。大家可以根據不同需要去設置參數。
二、在paintEvent事件中繪制窗口邊框
這里我們需要重寫paintEvent方法,具體代碼如下:
void paintEvent(QPaintEvent *event) { QPainter painter(this); painter.setRenderHint(QPainter::Antialiasing); // 反鋸齒; painter.setBrush(QBrush(Qt::red)); painter.setPen(Qt::transparent); QRect rect = this->rect(); rect.setWidth(rect.width() - 1); rect.setHeight(rect.height() - 1); painter.drawRoundedRect(rect, 15, 15); //也可用QPainterPath 繪制代替 painter.drawRoundedRect(rect, 15, 15); { QPainterPath painterPath; painterPath.addRoundedRect(rect, 15, 15); p.drawPath(painterPath); } QWidget::paintEvent(event); }
效果如下:
如果不寫painter.setRenderHint(QPainter::Antialiasing);則圓角會出現鋸齒,如下圖。
仔細對比上圖可以看見圓角曲線有鋸齒狀。
注意:
(1)在使用這兩種方法的時候需要設置窗口的屬性。 this->setAttribute(Qt::WA_TranslucentBackground);//設置窗口背景透明 this->setWindowFlags(Qt::FramelessWindowHint); //設置無邊框窗口 (2)主窗體加載不了樣式時需要在paintEvent事件中加上如下代碼。 { QStyleOption opt; opt.init(this); QPainter p(this); style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this); QWidget::paintEvent(event); }
設置按鈕的背景邊框
原始圖
設置無邊框或者背景透明可以去掉白色方框
給按鈕設置如下樣式即可。
{background-color:transparent;}
或者
{border:none;}
原文鏈接:
Qt 之 設置窗口邊框的圓角