我有两个机会画一个网格:
从QGraphicsView 派生一个类并重载paintEvent() 并在回退到QGraphicsView::paintEvent() 之前绘制网格
在QGraphicsItemGroup 下添加网格线作为场景项,以控制可见性。
第一种方法的优点是它可以无缝地适应任何视口的大小调整。
这是我的示例代码testQGraphicsView-BgGrid.cc:
#include <QtWidgets>
class Canvas: public QGraphicsView {
private:
int _gridSize;
QColor _gridColor;
bool _gridVisible;
public:
explicit Canvas(QWidget *pQParent = nullptr):
QGraphicsView(pQParent),
_gridSize(20), _gridColor(0x0a8affu), _gridVisible(true)
{ }
bool gridVisible() const { return _gridVisible; }
void setGridVisible(bool gridVisible)
{
_gridVisible = gridVisible;
viewport()->update();
}
protected:
virtual void paintEvent(QPaintEvent *pQEvent) override
{
QPainter qPainter(viewport());
if (_gridVisible) {
const int wView = viewport()->width(), hView = viewport()->height();
qPainter.setPen(_gridColor);
for (int x = _gridSize / 2; x < wView; x += _gridSize) {
qPainter.drawLine(x, 0, x, hView - 1);
}
for (int y = _gridSize / 2; y < hView; y += _gridSize) {
qPainter.drawLine(0, y, wView - 1, y);
}
}
QGraphicsView::paintEvent(pQEvent);
}
};
void makeGrid(
QGraphicsItemGroup &qItemGrp, const QSize &size,
int gridSize = 20, const QColor &gridColor = 0x0a8affu)
{
const int wView = size.width(), hView = size.height();
for (int x = gridSize / 2; x < wView; x += gridSize) {
QGraphicsLineItem *pQItem = new QGraphicsLineItem(x, 0, x, hView - 1);
pQItem->setPen(gridColor);
qItemGrp.addToGroup(pQItem);
}
for (int y = gridSize / 2; y < hView; y += gridSize) {
QGraphicsLineItem *pQItem = new QGraphicsLineItem(0, y, wView - 1, y);
pQItem->setPen(gridColor);
qItemGrp.addToGroup(pQItem);
}
}
int main(int argc, char **argv)
{
QApplication app(argc, argv);
// setup GUI
QWidget qWnd;
QGridLayout qGrid;
QLabel qLblL(QString::fromUtf8("Grid as part of scene"));
qGrid.addWidget(&qLblL, 0, 0);
QCheckBox qTglGridL(QString::fromUtf8("Show Grid"));
qGrid.addWidget(&qTglGridL, 0, 1);
QGraphicsView qGraphView;
qGrid.addWidget(&qGraphView, 1, 0, 1, 2);
QLabel qLblR(QString::fromUtf8("Grid painted as background"));
qGrid.addWidget(&qLblR, 0, 2);
QCheckBox qTglGridR(QString::fromUtf8("Show Grid"));
qGrid.addWidget(&qTglGridR, 0, 3);
Canvas canvas;
qGrid.addWidget(&canvas, 1, 2, 1, 2);
qWnd.setLayout(&qGrid);
qWnd.show();
// init GUI
QGraphicsScene qGraphSceneL;
QGraphicsItemGroup qItemGrid;
makeGrid(qItemGrid, qGraphView.viewport()->size());
qGraphSceneL.addItem(&qItemGrid);
qGraphView.setScene(&qGraphSceneL);
qTglGridL.setCheckState(
qItemGrid.isVisible() ? Qt::Checked : Qt::Unchecked);
qTglGridR.setCheckState(
canvas.gridVisible() ? Qt::Checked : Qt::Unchecked);
// install signal handlers
QObject::connect(&qTglGridL, &QCheckBox::stateChanged,
[&qItemGrid](int state)
{
qItemGrid.setVisible(state != Qt::Unchecked);
});
QObject::connect(&qTglGridR, &QCheckBox::stateChanged,
[&canvas](int state)
{
canvas.setGridVisible(state != Qt::Unchecked);
});
// runtime loop
return app.exec();
}
使用 VS2013 和 Qt 5.9.2 编译,在 Window 10(64 位)上测试:
更新:
QMake 脚本testQGraphicsView-BgGrid.pro:
SOURCES = testQGraphicsView-BgGrid.cc
QT += widgets
在 cygwin 上的 bash 中构建和测试:
$ qmake-qt5 testQGraphicsView-BgGrid.pro
$ make
g++ -c -fno-keep-inline-dllexport -D_GNU_SOURCE -pipe -O2 -Wall -W -D_REENTRANT -DQT_NO_DEBUG -DQT_WIDGETS_LIB -DQT_GUI_LIB -DQT_CORE_LIB -I. -isystem /usr/include/qt5 -isystem /usr/include/qt5/QtWidgets -isystem /usr/include/qt5/QtGui -isystem /usr/include/qt5/QtCore -I. -I/usr/lib/qt5/mkspecs/cygwin-g++ -o testQGraphicsView-BgGrid.o testQGraphicsView-BgGrid.cc
g++ -o testQGraphicsView-BgGrid.exe testQGraphicsView-BgGrid.o -lQt5Widgets -lQt5Gui -lQt5Core -lGL -lpthread
$ ./testQGraphicsView-BgGrid
与 X11 应用程序相同的程序:
又一次更新:
我必须承认,在我的第一个版本中,我专注于 如何使用复选框更改 QGraphicsView 背景,重点是 复选框 忽略 QGraphicsScene::drawBackground() (我不知道)并忽略了网格渲染本身的问题(我使用了它)。正如eyllanesc's answer 中所指出的,这两种解决方案都存在一些(至少)我应该记录下来的弱点。
左视图(涉及到场景中的网格)不一定会填充viewport()。恕我直言,如果网格填充了场景使用的相关范围,这是可以接受的。 (这可能是为了形象化场景仅覆盖viewport() 的一部分。)但是,makeGrid() 的论点const QSize &size 是关于此意图的不幸选择。我通过将其替换为 const QRect &rect 来解决此设计问题。
右视图(重载paintEvent())没有考虑可能的场景滚动。我通过将左上角映射到场景坐标 (const QPointF offs = mapToScene(0, 0);) 来解决此问题,并将偏移量视为循环中的起始值。
更新示例代码testQGrapicsView-BgGrid.cc:
#include <QtWidgets>
class Canvas: public QGraphicsView {
private:
int _gridSize;
QColor _gridColor;
bool _gridVisible;
public:
explicit Canvas(QWidget *pQParent = nullptr):
QGraphicsView(pQParent),
_gridSize(20), _gridColor(0x0a8affu), _gridVisible(true)
{ }
bool gridVisible() const { return _gridVisible; }
void setGridVisible(bool gridVisible)
{
_gridVisible = gridVisible;
viewport()->update();
}
protected:
virtual void paintEvent(QPaintEvent *pQEvent) override
{
QPainter qPainter(viewport());
if (_gridVisible) {
const int wView = viewport()->width(), hView = viewport()->height();
const QPointF offs = mapToScene(0, 0);
qPainter.setPen(_gridColor);
for (int x = (int)offs.x() % _gridSize; x < wView; x += _gridSize) {
qPainter.drawLine(x, 0, x, hView - 1);
}
for (int y = (int)offs.y() % _gridSize; y < hView; y += _gridSize) {
qPainter.drawLine(0, y, wView - 1, y);
}
}
QGraphicsView::paintEvent(pQEvent);
}
};
void makeGrid(
QGraphicsItemGroup &qItemGrp, const QRect &rect,
int gridSize = 20, const QColor &gridColor = 0x0a8affu)
{
for (int x = rect.x(), xE = x + rect.width(); x < xE; x += gridSize) {
QGraphicsLineItem *pQItem
= new QGraphicsLineItem(x, rect.y(), x, rect.height() - 1);
pQItem->setPen(gridColor);
qItemGrp.addToGroup(pQItem);
}
for (int y = rect.y(), yE = y + rect.height(); y < yE; y += gridSize) {
QGraphicsLineItem *pQItem
= new QGraphicsLineItem(rect.x(), y, rect.width() - 1, y);
pQItem->setPen(gridColor);
qItemGrp.addToGroup(pQItem);
}
}
int main(int argc, char **argv)
{
QApplication app(argc, argv);
// setup GUI
QWidget qWnd;
QGridLayout qGrid;
QLabel qLblL(QString::fromUtf8("Grid as part of scene"));
qGrid.addWidget(&qLblL, 0, 0);
QCheckBox qTglGridL(QString::fromUtf8("Show Grid"));
qGrid.addWidget(&qTglGridL, 0, 1);
QGraphicsView qGraphView;
qGrid.addWidget(&qGraphView, 1, 0, 1, 2);
QLabel qLblR(QString::fromUtf8("Grid painted as background"));
qGrid.addWidget(&qLblR, 0, 2);
QCheckBox qTglGridR(QString::fromUtf8("Show Grid"));
qGrid.addWidget(&qTglGridR, 0, 3);
Canvas canvas;
qGrid.addWidget(&canvas, 1, 2, 1, 2);
qWnd.setLayout(&qGrid);
qWnd.show();
// init GUI
QGraphicsScene qGraphSceneL;
QGraphicsItemGroup qItemGrid;
makeGrid(qItemGrid, QRect(0, 0, 320, 240));
qGraphSceneL.addItem(&qItemGrid);
qGraphView.setScene(&qGraphSceneL);
qTglGridL.setCheckState(
qItemGrid.isVisible() ? Qt::Checked : Qt::Unchecked);
qTglGridR.setCheckState(
canvas.gridVisible() ? Qt::Checked : Qt::Unchecked);
// install signal handlers
QObject::connect(&qTglGridL, &QCheckBox::stateChanged,
[&qItemGrid](int state)
{
qItemGrid.setVisible(state != Qt::Unchecked);
});
QObject::connect(&qTglGridR, &QCheckBox::stateChanged,
[&canvas](int state)
{
canvas.setGridVisible(state != Qt::Unchecked);
});
// runtime loop
return app.exec();
}
以下快照显示了启动后和调整大小后的应用程序: