Разработка графического интерфейса Qt - отображение 2D-сетки с использованием QGraphicsView

Я новичок в разработке Qt, поэтому я пытаюсь исследовать решение для пользовательского интерфейса, который мне нужно разработать. Мой проект - имитировать игроков в онлайн-игре, перемещающейся по глобальной карте. Чтобы представить карту, мне нужно отобразить 2D-сетку, причем каждое пространство в сетке представляет собой область карты. Затем мне нужно отобразить местоположение каждого игрока в игре. Внутренний интерфейс полностью работает, а карта реализована как 2D-массив. Я просто зациклился на том, как отображать сетку.

Исследование, которое я сделал, привело меня к тому, что 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 bounding rect
ui->view->fitInView(scene->itemsVBoundingRect());

Вы должны проверить QGraphicsView и QGraphicsScene, а также соответствующий examples. Также вы можете посмотреть графический вид учебные видеоролики или некоторый графический вид связанный видео из дней разработки Qt.

Ответ 2

Хорошо, если у вас есть постоянный размер сетки или даже ограниченное количество размеров сетки, что мне нравится делать, это нарисовать блок сетки в gimp или любой другой программе, а затем установить ее как фоновую кисть (рисовать только нижнюю и правую сторона блока) qt повторит изображение и даст вам полную сетку. Я думаю, что это хорошо для производительности тоже.

Это изображение сетки, которое я использовал в одной из моих программ, это 10x10 пикселей.

grid 10px

Затем вызовите QGraphicsScene setBackgroundBrush в качестве следующего:

    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...