Sviluppo della GUI Qt - Visualizzazione di una griglia 2D con QGraphicsView

Question

Sono nuovo nello sviluppo di Qt, quindi sto cercando di ricercare una soluzione per un'interfaccia utente che devo progettare. Il mio progetto è di simulare i giocatori in un gioco online muovendosi attorno a una mappa globale. Per rappresentare la mappa ho bisogno di visualizzare una griglia 2D, con ogni spazio nella griglia che rappresenta una regione di una mappa. Devo quindi mostrare la posizione di ciascun giocatore nel gioco. Il back-end è tutto funzionante, con la mappa implementata come array 2D. Sono solo bloccato su come visualizzare la griglia.

La ricerca che ho svolto mi ha portato a credere che un QGraphicsView sia il modo migliore per farlo, ma non riesco a trovare un tutorial pertinente a ciò di cui ho bisogno. Se qualcuno ha qualche consiglio su come implementarlo, sarebbe molto apprezzato.

Grazie, Dan

Answer 1

Una Griglia 2D non è altro che un insieme di linee orizzontali e verticali. Supponiamo di avere una mappa 500x500 e di disegnare una griglia in cui la distanza tra le linee in entrambe le direzioni sia 50. Il codice di esempio che segue mostra come è possibile raggiungerlo.

// 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()); 

è necessario controllare la QGraphicsView e la documentazione QGraphicsScene così come il corrispondente examples. Inoltre puoi guardare la vista grafica training videos o qualche visualizzazione grafica related videos dai giorni degli sviluppatori Qt.

Answer 2

Bene se si dispone di una dimensione di griglia costante o di un numero limitato di dimensioni di griglia, ciò che mi piace fare è disegnare un blocco di griglia in gimp o qualsiasi altro programma e quindi impostarlo come pennello di sfondo (disegnare solo il fondo e lato destro del blocco) qt ripeterà l'immagine e ti darà una griglia completa. Penso che sia buono anche per le prestazioni.

Questa è l'immagine della griglia che ho usato in uno dei miei programmi è 10x10 pixel.

Quindi chiamare QGraphicsScene setBackgroundBrush come follwing:

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

Answer 3

Il modo più nativo è questo:

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. 

Sorry di PyQt ...