Your SlideShare is downloading. ×
Petri Niemi Qt Advanced Part 1
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.

Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Petri Niemi Qt Advanced Part 1


Published on

Petri Niemi, Qt Advanced Part 1, 6.3.2010, Hagenberg

Petri Niemi, Qt Advanced Part 1, 6.3.2010, Hagenberg

Published in: Technology
  • Be the first to comment

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide


  • 1. Qt Advanced Part I 1
  • 2. Contents • Graphics View • Qt Property System • Animation Framework 2
  • 3. Qt Advanced Graphics View 3
  • 4. Graphics View In General • Provides a surface for managing and interacting with a large number of custom- made 2D graphical items • Event propagation architecture provided • Allows precise double-precision interaction capabilities for the items on the scene • Items can handle key, mouse press, move, release and double click events • Tracks mouse movement • Uses Binary Space Partitioning tree to provide very fast item discovery • Items may be QWidgets, although not very usual 4
  • 5. Coordinate Systems • Three coordinate systems, corresponding to the graphics view classes (parts of the th system): t ) • Graphics Item • Graphics Scene • Graphics View • Convenience functions for coordinate mappings are provided 5
  • 6. Graphics Item – QGraphicsItem • Graphical item on the screen • Several standard it S l t d d item classes exist: rectangle, ellipse, t t l i t t l lli text • Items live in their own local coordinate system. • Coordinates are usually centered around its center point (0, 0), and this is also the center for all transformations. • Item features • Mouse press, move, release, double click, mouse hover event, wheel event, context menu events • Keyboard input focus, key events • Drag and drop • Grouping • Collision detection • Set a shape for your items • Override collision detection function if needed 6
  • 7. Graphics Scene – QGraphicsScene • Container for item objects • P id a f t interface for managing a large number of it Provides fast i t f f i l b f items • Propagates events to each item • Manages item state ( g (selection, focus)) QGraphicsScene scene; QGraphicsItem *rect = scene addRect(QRectF(0 0 100 100)); scene.addRect(QRectF(0, 0, 100, scene.addItem(newGraphicsItem); QGraphicsItem *item = scene.itemAt(50, 50); // item == rect 7
  • 8. Graphics View - QGraphicsView • The view widget for displaying the contents of a QGraphicsScene • You can add a QGraphicsView directly from the UI Designer • Like an empty canvas for your Graphics Items • C Convenient and efficient use of t i t d ffi i t f transformations f ti • Uses QMatrix or QTransform • rotate() () • scale() • translate() • shear() 8
  • 9. Transformations • View can transform scene’s co ordinate system scene s co-ordinate • Easy to add transformations to graphic view items or to the whole view QTransform transform; transform.translate(50, 50); transform.rotate(45); transform.scale(0.5, 1.0); transform scale(0 5 1 0); view.setTransform(transform); // Also available: view.rotate(45); 9
  • 10. Adding QWidgets to Graphics View • QGraphicsWidget • Concrete base class of all widget items in the graphics scene • Layout management • Geometry management • Inherited by QGraphicsProxyWidget • Used for adding normal QWidgets to the scene QGraphicsScene scene; QLineEdit *edit = new QLineEdit; QGraphicsProxyWidget *proxy = scene.addWidget(edit); edit->isVisible(); // returns true QGraphicsView view(&scene);; 10
  • 11. Graphics View Classes 11
  • 12. Items are not Widgets • Th major diff The j difference b t between QG hi It QGraphicsItem and, say QLabel i th t th d QL b l is that the former is not a QWidget subclass • This has, among others, the following implications: • You can’t place QWidgets in a QGraphicsScene (without the proxy class described earlier) • You can’t place QGraphicsItems outside a QGraphicsScene • You can’t use Qlayout-derived layout managers with QGraphicsItems – QGraphicsLayout is the base class for layouts instead • QGraphicsScene/QGraphicsItem has its own internal event system that is slightly p p y g y different from the regular QEvent system • QGraphicsItems can, unlike QWidgets, be arbitrarily transformed • This allows the creation of items that support high q pp g quality zooming etc y g 12
  • 13. Existing Graphics Items • QGraphicsLineItem – A line segment • QAbstractGraphicsShapeItem – Common baseclass for “shape items”, ie. ellipses, polygons etc. • QGraphicsEllipseItem – An ellipse or ”pie segment” g • QGraphicsPolygonItem – A polygon • QGraphicsRectItem – A rectangle • QGraphicsPathItem – A QPainterPath • QGraphicsPixmapItem – A pixmap • QGraphicsTextItem – A rich text string (can be editable) • QGraphicsSimpleTextItem – A non-editable plain text string • QGraphicsSvgItem – An SVG element 13
  • 14. Event Handling • Event handling for QGraphicsItems is very similar to QWidget • Example handlers: • keyPressEvent(QKeyEvent*) • mouseMoveEvent(QGraphicsSceneMouseEvent*) (Q p ) • contextMenuEvent(QGraphicsSceneContextMenuEvent*) • dragEnterEvent(QGraphicsSceneDragDropEvent*) • focusInEvent(QFocusEvent*) f I E t(QF E t*) • hoverEnterEvent(QGraphicsSceneHoverEvent*) • And similar to QWidget::event(QEvent*) there is g ( ) QGraphicsItem::sceneEvent(QEvent*) that receives all events for an item 14
  • 15. Qt Advanced Qt Property System 15
  • 16. Qt Property System – 1/2 • Data members of QObject-derived classes can be exposed as properties • Properties are defined in class declarations using the Q PROPERTY macro Q_PROPERTY • Syntax: Q_PROPERTY( type name READ getFunction [WRITE setFunction ] [RESET resetFunction ] [DESIGNABLE bool ] [SCRIPTABLE bool ] [STORED bool ] ) • Examples: Q_PROPERTY( QString title READ title WRITE setTitle ) Q_PROPERTY( bool enabled READ isEnabled WRITE setEnabled ) • Properties can be accessed using the functions QObject::property() and QObject::setProperty() • No need to even know the exact type of the object you are manipulating! • If the property named in QObject::setProperty() does not exist, it will be dynamically added to the object at run-time run time • Many widget members are Qt properties • Used e.g. in the animation framework 16
  • 17. Qt Property System – 2/2 // MyObject.h class MyObject : public QObject { Q_OBJECT Q_PROPERTY(QString text READ text WRITE setText) public: // Constructor and destructor omitted for simplicity void setText(const QString& text) const { m_text = text; } QString text() const { return m_text; } p private: QString m_text; }; // Usage in SomeCode.cpp: MyObject* myObject = new MyObject(); QObject* object = myObject; myObject->setText(”Some text”); // Access either in the normal way... object->setProperty(”text”, ”Other text”); // ... or by using the property system 17
  • 18. Qt Advanced Animation Framework 18
  • 19. Introduction 1(2) • I Qt 4.6 a new Animation F In 46 A i ti Framework was introduced k i t d d • The idea is to provide an easy and scalable way of creating animated and smooth GUIs • Hides the complexity of handling timers • Provides a set of pre-defined easing curves, custom curves can be provided b the d id d by h developer as needed l d d • Works by modifying the properties of the QObjects being animated 19
  • 20. Introduction 2(2) • Easy to use together with the State Machine Framework to provide animated transitions b t t iti between states t t • State Machine Framework is introduced in the next session • Normally the animations have a finite duration • QTimeLine used as a timer behind the scenes • Can be made to loop and run backwards • If duration is set to -1, the animation will run until explicitly stopped 20
  • 21. Main Classes 21
  • 22. Example – Animating a Button • What do you think the example below does? Q QPushButton button("Animated Button"); ( ); QPropertyAnimation animation(&button, "geometry"); animation.setDuration(10000); animation.setStartValue(QRect(0, 0, 100, 30)); animation.setKeyValueAt(0.5, QRect(250, 250, 100, 30)); animation.setEndValue(QRect(0, 0, 100, 30)); animation.start(); 22
  • 23. QGraphicsObject • All normal QWidgets can easily be animated as they are, since they y y y derive from QObject • This is not the case with QGraphicsItems • Because QObject-functionality is not always needed; this way this common QObject functionality base class remains lighter weight • A new class was introduced to help with custom graphics classes: QGraphicsObject • Provides access to signals, slots and properties • Use it as your base class when needed 23
  • 24. Non-QObject Graphics Classes 1(2) • H How t use the existing non-QObject graphics classes with th to th i ti QObj t hi l ith the Animation FW? • QGraphicsPixmapItem, QGraphicsLineItem • QAbstractGraphicsShapeItem-derived classes • Derive from the wanted utility class, and • Add QObject as another base class when needed • In other words, do exactly like QGraphicsObject does it! Add when needed 24
  • 25. Non-QObject Graphics Classes 2(2) • Th custom subclass ( The t b l (MyPixmapItem) can now also expose it b i ) l its base class’s member variables as properties • A suitable setter function is needed in the base class • For example, base class provides a setter and a getter function and subclass uses these to declare a property: class MyPixmapItem : public QObject, public QGraphicsPixmapItem { Q_OBJECT // Refers to QGraphicsItem::pos() and setPos() Q_PROPERTY(QPointF pos READ pos WRITE setPos) ... 25
  • 26. Animation Groups 1(2) • Classes QSequentialAnimationGroup and QParalleAnimationGroup can be used to run multiple animations in sequence or in parallel • Their base class QAnimationGroup further derives from Q p QAbstractAnimation • An animation group can be used wherever a ”normal” animation could – e.g. a g p within a g p g group group • Enables building very complex animation sequences 26
  • 27. Animation Groups 2(2) QPropertyAnimation* animation1 = new QPropertyAnimation(...); QPropertyAnimation* animation2 = new QPropertyAnimation(...); QPropertyAnimation* animation3 = new QPropertyAnimation(...); QPropertyAnimation* animation4 = new QPropertyAnimation(...); QParallelAnimationGroup *parallel = new QParallelAnimationGroup(); parallel->addAnimation(animation2); parallel->addAnimation(animation3); QSequentialAnimationGroup* seq = new QSequentialAnimationGroup(); seq->addAnimation(animation1); dd i i ( i i 1) seq->addAnimation(parallel); seq->addAnimation(animation4); seq->start(); 27
  • 28. Easing Curves • Th Animation FW provides multiple pre-made easing curves f your The A i ti id lti l d i for convenience • Represented by the class QEasingCurve • Custom curves can implemented by the developer; see the class documentation for details • Typically used to control e.g. how the animation starts and/or finishes yp y g • QEasingCurve::OutBounce • QEasingCurve::InOutQuad •… QPropertyAnimation animation(&button, "geometry"); animation.setEasingCurve(QEasingCurve::OutBounce); g g • Take a look at the Easing Curves example in the Qt Demo tool 28
  • 29. Summary • Graphics View is the framework used for nice graphics and animations in Qt • Think of it as a canvas that contains graphical items • Items can move around freely • Enables creation of attractive GUIs • Qt extends basic C++ functionality with its property system • An extremely versatile mechanism for exposing object’s internals y p g j • Breaks a basic OO-principle: information encapsulation • Works via the meta-object system • U d e.g. b th A i ti F Used by the Animation Framework k • The new Animation Framework makes implementing complex animations even easier than before • No need to worry about timers • Nice extra features provided, e.g. easing curves 29