我正在嘗試繪制一個矩形漸變作為 QGraphicsView 的背景。
這張圖片是我想要實作的一個例子:

注意邊界周圍的光線漸變。
我嘗試使用從視窗的每個邊框到對面的 4 個 QLinearGradients(從右到左,從上到下等等)。我不認為這種方法非常有效(繪制這么多漸變物件)。也許將 Spread 設定為 ReflectSpread 的單個 QLinearGradient 就足夠了,但我有一個定位問題。這個想法是漸變應該像一個遮陽板,就像一個相機的框架。無論 QGraphicsView 的大小或比例如何,它都應該看起來一樣。
這是 QLinearGradient 的代碼:
QLinearGradient lGrad;
lGrad.setSpread(QGradient::ReflectSpread);
lGrad.setStart(0, 500);
lGrad.setColorAt(0, Qt::red);
lGrad.setColorAt(1, Qt::blue);
painter->fillRect(rect, lGrad);
我嘗試在邊框周圍使用樣式表,但它沒有給我想要的結果。似乎漸變不能應用于邊框,只能應用于工具提示。最小的例子:
#include <QGraphicsView>
// View
class View : public QGraphicsView
{
Q_OBJECT
public:
explicit View(QWidget* parent = nullptr)
{
// Stylesheet
setStyleSheet(
"border-left:40px solid qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0, stop:0 rgba(0, 0, 0,150), stop:1 rgba(0, 0, 0, 0) );"
"border-right:40px solid qlineargradient(spread:pad, x1:1, y1:0, x2:0, y2:0, stop:0 rgba(0, 0, 0,150), stop:1 rgba(0, 0, 0, 0) );"
"border-top:40px solid qlineargradient(spread:pad, x1:0, y1:0, x2:0, y2:1, stop:0 rgba(0, 0, 0,150), stop:1 rgba(0, 0, 0, 0) );"
"border-bottom:40px solid qlineargradient(spread:pad, x1:0, y1:1, x2:0, y2:0, stop:0 rgba(0, 0, 0,150), stop:1 rgba(0, 0, 0, 0) );"
"border-radius: 0.5px;"
"padding: 1px;"
"margin: 0px;"
"spacing: 0px;"
);
// Hidden because the stylesheet adds colors to them
setHorizontalScrollBarPolicy( Qt::ScrollBarAlwaysOff);
setVerticalScrollBarPolicy(Qt::ScrollBarAlwaysOff);
setDragMode(QGraphicsView::ScrollHandDrag);
setBackgroundBrush(QColor(35, 41, 56));
setCacheMode(CacheBackground);
setViewportUpdateMode(BoundingRectViewportUpdate);
setRenderHint(QPainter::Antialiasing);
setTransformationAnchor(AnchorUnderMouse);
scale(qreal(0.8), qreal(0.8));
setTransformationAnchor(QGraphicsView::AnchorUnderMouse);
}
void mousePressEvent(QMouseEvent *event) override
{
QGraphicsView::mousePressEvent(event);
if (event->button() == Qt::LeftButton)
{
_clickPos = mapToScene(event->pos());
}
}
void mouseMoveEvent(QMouseEvent *event) override
{
QGraphicsView::mouseMoveEvent(event);
if (scene()->mouseGrabberItem() == nullptr && event->buttons() == Qt::LeftButton)
{
if ((event->modifiers() & Qt::ShiftModifier) == 0)
{
QPointF difference = _clickPos - mapToScene(event->pos());
setSceneRect(sceneRect().translated(difference.x(), difference.y()));
}
}
}
}
// Main
#include <QMainWindow>
#include <QGraphicsScene>
int main(int argc, char *argv[])
{
QApplication app(argc, argv);
auto scene = new QGraphicsScene;
auto view = new View;
view->setScene(scene);
auto window = new QMainWindow;
window->setCentralWidget(view);
window->show();
return app.exec();
}
uj5u.com熱心網友回復:
我嘗試使用樣式表創建它,這是我的結果:

我graphicsView在我的小部件中添加了一個centralwidget并添加了這個樣式表:
border-left:20px solid qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0, stop:0 rgba(32, 180, 214,150), stop:1 rgba(0, 0, 0, 0) );
border-right:20px solid qlineargradient(spread:pad, x1:1, y1:0, x2:0, y2:0, stop:0 rgba(32, 180, 214,150), stop:1 rgba(0, 0, 0, 0) );
border-top:20px solid qlineargradient(spread:pad, x1:0, y1:0, x2:0, y2:1, stop:0 rgba(32, 180, 214,150), stop:1 rgba(0, 0, 0, 0) );
border-bottom:20px solid qlineargradient(spread:pad, x1:0, y1:1, x2:0, y2:0, stop:0 rgba(32, 180, 214,150), stop:1 rgba(0, 0, 0, 0) );
border-radius: 0.5px;
padding: 1px;
margin: 0px;
spacing: 0px;
我試圖得到你的顏色,但如果你玩它的 RGB,你可以得到你想要的顏色。我認為這是最簡潔的解決方案,因為通過改變視圖的大小,一切都改變了,樣式保持不變。

編輯和更新:
你不應該添加setBackgroundBrush(QColor(35, 41, 56));到你的QGraphicsView和View類中。我洗掉了這一行,而是將它作為 setStyleSheet 添加到 MainWindow 中。像這樣 :
在視圖類中:
View::View()
{
// Stylesheet
setStyleSheet(
"border-left:40px solid qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0, stop:0 rgba(0, 0, 0,150), stop:1 rgba(0, 0, 0, 0) );"
"border-right:40px solid qlineargradient(spread:pad, x1:1, y1:0, x2:0, y2:0, stop:0 rgba(0, 0, 0,150), stop:1 rgba(0, 0, 0, 0) );"
"border-top:40px solid qlineargradient(spread:pad, x1:0, y1:0, x2:0, y2:1, stop:0 rgba(0, 0, 0,150), stop:1 rgba(0, 0, 0, 0) );"
"border-bottom:40px solid qlineargradient(spread:pad, x1:0, y1:1, x2:0, y2:0, stop:0 rgba(0, 0, 0,150), stop:1 rgba(0, 0, 0, 0) );"
"border-radius: 0.5px;"
"padding: 1px;"
"margin: 0px;"
"spacing: 0px;"
);
// Hidden because the stylesheet adds colors to them
setHorizontalScrollBarPolicy(Qt::ScrollBarAlwaysOff);
setVerticalScrollBarPolicy(Qt::ScrollBarAlwaysOff);
setDragMode(QGraphicsView::ScrollHandDrag);
// setBackgroundBrush(QColor(35, 41, 56));
setCacheMode(CacheBackground);
setViewportUpdateMode(BoundingRectViewportUpdate);
setRenderHint(QPainter::Antialiasing);
setTransformationAnchor(AnchorUnderMouse);
scale(qreal(0.8), qreal(0.8));
setTransformationAnchor(QGraphicsView::AnchorUnderMouse);
}
在 MainWindow 類中:
MainWindow::MainWindow(QWidget *parent):
QMainWindow(parent),
ui(new Ui::MainWindow)
{
ui->setupUi(this);
setStyleSheet("background-color: rgb(35, 41, 43);");
auto scene = new QGraphicsScene;
auto view = new View;
view->setScene(scene);
setCentralWidget(view);
}
這是結果:

uj5u.com熱心網友回復:
我找到了一個解決方案,實際上是兩個。這個想法是在 QGraphicsView 的邊界處繪制漸變。效果應該是恒定的,并且不受平移視圖或調整小部件大小的影響。結果: https ://i.gyazo.com/af979432e86b9ecf3848a0114d950531.gif
使用 QGraphicsView 的矩形在QGraphicsView::drawBackground()中繪制漸變,但要確保背景沒有被快取。確保setCacheMode(CacheBackground); 未設定。如果設定了這個,就會有工件。
QLinearGradient leftGrad; leftGrad.setStart(rect.left(), 0); leftGrad.setFinalStop(rect.left() 200, 0); leftGrad.setColorAt(0.0, gradientColor); leftGrad.setColorAt(gradientPosition, Qt::transparent); painter->fillRect(rect, leftGrad);改為在QGraphicsView::drawForeground()中繪制漸變。這允許保持后臺快取以進行優化。
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/482824.html
上一篇:如何獲得可見專案邊界框?
