Qt GUI 开发 - 使用 QGraphicsView 显示 2D 网格答案

【问题标题】：Qt GUI Development - Displaying a 2D grid using QGraphicsViewQt GUI 开发 - 使用 QGraphicsView 显示 2D 网格
【发布时间】：2012-01-06 22:50:00
【问题描述】：

我是 Qt 开发的新手，所以我一直在尝试研究我需要设计的用户界面的解决方案。我的项目是模拟在线游戏中的玩家在全球地图上移动。为了表示地图，我需要显示一个 2D 网格，网格中的每个空间都代表地图的一个区域。然后我需要显示游戏中每个玩家的位置。后端完全正常工作，地图实现为 2D 数组。我只是纠结于如何显示网格。

我所做的研究使我相信 QGraphicsView 是做到这一点的最佳方法，但我似乎找不到与我需要的相关的教程。如果有人对如何实现这一点有任何提示，将不胜感激。

谢谢，丹

【问题讨论】：

我个人从 SDK 附带的示例中学到了很多关于 Qt 图形的知识。 40000 chips 是实现自定义图形视图和图形项目以显示巨大场景的好例子。阅读源代码并不容易，但我没有找到任何关于该主题的像样的教程。顺便说一句，examples 的一些内容已完整记录在案，并且在开始时很有帮助。

标签： c++ qt user-interface qgraphicsview

【解决方案1】：

2D 网格只不过是一组水平和垂直线。假设您有一个 500x500 的地图，并且您想绘制一个网格，其中两个方向的线之间的距离为 50。下面的示例代码向您展示了如何实现它。

// create a scene and add it your view
QGraphicsScene* scene = new QGraphicsScene;
ui->view->setScene(scene);

// Add the vertical lines first, paint them red
for (int x=0; x<=500; x+=50)
    scene->addLine(x,0,x,500, QPen(Qt::red));

// Now add the horizontal lines, paint them green
for (int y=0; y<=500; y+=50)
    scene->addLine(0,y,500,y, QPen(Qt::green));

// Fit the view in the scene's bounding rect
ui->view->fitInView(scene->itemsVBoundingRect());

您应该查看QGraphicsView 和QGraphicsScene 文档以及相应的examples。您还可以观看 Qt 开发者时代的图形视图 training videos 或一些图形视图 related videos。

【讨论】：

【解决方案2】：

好吧，如果你有一个恒定的网格大小甚至是有限数量的网格大小，我喜欢做的是在 gimp 或任何其他程序中绘制一个网格块，然后将其设置为背景画笔（仅绘制底部和右侧块的一侧）qt 将重复图像并为您提供完整的网格。我认为这对性能也有好处。

这是我在我的一个程序中使用的网格图像，它是 10x10 像素。

然后调用QGraphicsScenesetBackgroundBrush 如下：

    scene->setBackgroundBrush(QBrush(QPixmap(":/grid/grid10.png")));

【讨论】：

【解决方案3】：

更原生的方式是这样的：

scene = self.getScene()                    # Your scene.

brush = QBrush()
brush.setColor(QColor('#999'))
brush.setStyle(Qt.CrossPattern)            # Grid pattern.
scene.setBackgroundBrush(brush)

borderColor = Qt.black
fillColor = QColor('#DDD')
rect = QRectF(0.0, 0.0, 1280, 720)         # Screen res or whatever.

scene.addRect(rect,borderColor,fillColor)  # Rectangle for color.
scene.addRect(rect,borderColor,brush)      # Rectangle for grid.

PyQt 对不起...

【讨论】：

我认为这个答案对于那些在 C++ 中寻找解决方案的人可能有一些价值，因为转换可能很容易。但一般来说，请只发布与问题中指定的语言相匹配的答案。谢谢！
@FabioTurati 我不同意。 Qt 在 C++ 和 Python 中广泛使用，因此要求人们在原始示例中发布代码会导致无法访问大部分专业知识。我只使用 Python，虽然我过去使用过 C++，所以我很高兴能用任何语言回答 Qt 问题，我想大多数人都会同意。

【解决方案4】：

假设一个场景被设置为图形视图，那么下面一行就会显示网格。

ui->graphicsView->scene()->setBackgroundBrush(Qt::CrossPattern);

还可以为 ex 传递几个其他值：Qt::Dense7Pattern

这些是enum BrushStyle 的成员，只需单击 Qt creator 中的任何已使用值，它将带您进入枚举声明，您可以在其中查看所有其他可能的值。

PS：可以这样设置场景：

ui->graphicsView->setScene(new QGraphicsScene());

【讨论】：