Class for storing the widgets, handling event propagation(input from keyboard and touches) and managing item states. It represents a scene with items in it. QGraphicsScene also manages the state of item like selection, focus and acts as a container to different items placed on the scene.<\/p>\n
A QGraphicsScene object is flexible enough to include any number of QGraphicsItem objects and still maintain the efficiency in retrieving them. The basic idea here is to manage the events of each item you create and redraw them as needed. This way, you can make your own custom widgets with more visually appealing features.<\/p>\n
- \n
- QGraphicsView<\/strong><\/li>\n<\/ul>\n
Displays the widgets of a scene, it basically visualizes content of a scene. The view widget is a scroll area, and provides scroll bars for navigating through large scenes. The view receives input events from keys and touches, and translates these to scene events (converting the coordinates used to scene coordinates where appropriate), before sending the events to the visualized scene.<\/p>\n
Graphics View provides an item-based approach to model-view programming, much like classes QTableView, QTreeView and QListView. Several views can observe a single scene, and the scene contains items of varying geometric shapes.<\/p>\n
- \n
- QGraphicsItem<\/strong><\/li>\n<\/ul>\n
A basic class for the graphical items on the scene. It can also represent a group of items. Graphics View provides several standard items for typical shapes, such as rectangles (QGraphicsRectItem), ellipses (QGraphicsEllipseItem) and text items (QGraphicsTextItem), but the most powerful QGraphicsItem features are available when one writes a custom item. QGraphicsItem is responsible for keyboard input, focus, drag and drop.<\/p>\n
Items live in a local coordinate system, and like QGraphicsView, it also provides many functions for mapping coordinates between the item and the scene, and from item to item. Also, like QGraphicsView, it can transform its coordinate system using a matrix: QGraphicsItem::transform(). This is useful for rotating and scaling individual items.<\/p>\n
Sample Application:<\/strong><\/p>\n
Let us see how to draw a simple image using QT Graphics View Framework using simple images with a small example.<\/p>\n
The below example uses: QgraphicsItem for drawing the custom item, QGraphicsScene for managing the custom items and QGaphicsView for displaying the contents of the QGraphicsScene.
\nm_graphicsview<\/strong> visualizes the contents of the m_graphicsscene<\/strong> in a scrollable viewport.<\/p>\nThe scene in the view is set by using setScene() by passing the address of m_graphicsscene object.
\nOnce the scene and the view are created, the items can be added to the scene by calling addItem().<\/p>\nThe custom image is subclassed from QGraphicsItem and the image is drawn in the paint event of\u00a0\u00a0 SpinnerGraphics.<\/p>\n
\/\/ Class SpinnerGraphics is the custom item to be displayed on the screen<\/p>\n
class SpinnerGraphics:public QObject,public QGraphicsItem<\/strong>
\n{<\/strong>
\nQ_OBJECT<\/p>\npublic:
\n…..<\/p>\nprotected:
\nvoid paint(QPainter *painter, const QStyleOptionGraphicsItem *option, QWidget *widget);
\nQRectF boundingRect() const;<\/p>\n};<\/strong><\/p>\n
\/\/ Class SpinnerControl is the class containing the graphics scene and the graphics view<\/strong>
\nclass SpinnerControl: public QFrame<\/strong>
\n{<\/strong>
\nQ_OBJECT<\/p>\nQGraphicsScene\u00a0 *m_graphicsscene;
\nQGraphicsView\u00a0\u00a0 *m_graphicsview;<\/p>\nQBrush\u00a0 *m_brush;
\npublic:
\n…
\nSpinnerGraphics\u00a0*m_spinnerGraphics;<\/p>\n};<\/strong><\/p>\n
SpinnerControl::SpinnerControl(QWidget *parent) :<\/strong>
\nQFrame(parent)<\/strong>
\n{<\/strong>
\nm_graphicsscene = new QGraphicsScene();
\nm_graphicsview\u00a0 = new QgraphicsView(this);
\n\/\/ Set the current scene pointing to the created scene
\nm_graphicsview->setScene(m_graphicsscene);<\/p>\n\/\/ set the area of the scene visualized by this view
\nm_graphicsscene->setSceneRect(0,0,311,261);<\/p>\nm_spinnerGraphics = new SpinnerGraphics();
\nm_graphicsscene->addItem(m_spinnerGraphics);<\/p>\nm_brush\u00a0 = new QBrush();
\nm_brush->setStyle(Qt::SolidPattern);
\nm_brush->setColor(QColor(15,15,15));
\nm_graphicsscene->setBackgroundBrush(*m_brush);<\/p>\n\/\/the custom spinner
\nm_spinnerGraphics=new SpinnerGraphics();
\n\/\/add the custom item in the scene
\nm_graphicsscene->addItem(m_spinnerGraphics);
\n…
\n}<\/strong><\/p>\nvoid SpinnerGraphics::paint(QPainter *painter, const QStyleOptionGraphicsItem *option, QWidget *widget)<\/strong>
\n{<\/strong>
\n\/\/images for custom spinners
\nQImage Compass(“:\/images\/course-bg.png”);
\nQImage grayArrow(“:\/images\/gray_arrow.png”);
\nQImage redArrow(“:\/images\/red_arrow.png”);
\npainter->drawImage(…);
\n…
\n}<\/strong><\/p>\nQRectF SpinnerGraphics::boundingRect() const<\/strong>
\n{<\/strong>
\nreturn QRectF(0,0,310,310);
\n}<\/strong><\/p>\nBy implementing mousePressEvent, mouseReleaseEvent and mouseMoveEvent we can even implement a way to change the position of the spinner (As shown in Fig).<\/p>\n
![\"Qt-Graphics-View-Framework\"](\"https:\/\/www.e-consystems.com\/blog\/linux-android\/wp-content\/uploads\/2015\/01\/Qt-Graphics-View-Framework-300x116.jpg\")
<\/a><\/p>\nReferences<\/h2>\n
1. http:\/\/doc.qt.io\/qt-4.8\/graphicsview.html<\/a><\/p>\n
- QGraphicsItem<\/strong><\/li>\n<\/ul>\n
![\"Qt-Graphics-View-Framework\"](\"https:\/\/www.e-consystems.com\/blog\/linux-android\/wp-content\/uploads\/2015\/01\/Qt-Graphics-View-Framework.jpg\")
<\/a><\/p>\n