Using Multi-Touch and Gestures with Qt

Using Multi-Touch and Gestures with Qt 10/09/09 Jens Bache-Wiig

Introduction Jens Bache-Wiig •  Worked on Qt since 2005 •  Platform Team •  Interim Widget Pimp 2

Agenda •  Introduction Concepts API Examples Q&A 3

Agenda Introduction •  Concepts API Examples Q&A 4

Concepts What do we mean when we say multi-touch? 5

Concepts A widget reacts to multiple touch-points For example, to zoom/scale content... Lorem ipsum dolor sit Lorem ipsum dolor eamt. Dolore magna aliquam erat volupat. Ut sit eamt. Dolore enim ad minimum magna aliquam veniami quis. Duis sutem vel eum irure dolor in erat volupat...cvc rerit laputum 6

Concepts Multiple widgets react to multiple touch-points For example, moving several sliders at once... 7

Concepts Real life is multi-touch Do you open a bottle with one finger? Applications could do it too... 1 2 8

hBp://www.youtube.com

Concepts What do we mean when we say gestures? 12

Concepts A way to make common multi-touch use-cases easy to use in your application • Standard, platform-specific touch-based gestures • Extensible API for custom gestures 13

Concepts What are standard gestures? •  Built-in multi-touch gestures that work in standard Qt widgets 14

Concepts Pan gesture •  Scrolls content •  Works in all scrollable Qt widgets Lorem ipsum dolor sit Ut enim ad minimum eamt. Dolore magna veniami quis. Duis sutem aliquam erat volupat. vel eum irure dolor in Ut enim ad minimum rerit laputum veniami quis. Duis sutem vel eum irure dolor in rerit laputum 15

Concepts Pinch gesture Zoom and/or rotate content 16

Agenda Introduction Concepts •  API Examples Q&A 17

API Multi-touch •  New event types •  TouchBegin •  TouchUpdate •  TouchEnd •  New QTouchEvent class •  QWidget and QGraphicsItem API 18

API QEvent::TouchBegin •  First in sequence •  Must be accepted to receive following events 19

API QEvent::TouchUpdate •  Normal event indicating activity •  Expect more events to follow 20

API QEvent::TouchEnd •  Final event in sequence •  No more events without a new TouchBegin 21

API TouchBegin propagation •  When ignored, propagate to widget under first touchpoint •  Widgets never receive multiple TouchBegin •  New touch-points on children are combined with first touch-point 1 1 2 One event, one point, to grey widget One event, two points, to grey widget 22

API TouchUpdate, TouchEnd do not propagate 23

API QTouchEvent •  Event class for QWidget and QGraphicsItem •  Contains list of active touch points •  Device type – TouchScreen or TouchPad 24

API QTouchEvent::TouchPoint •  Information about one touch-point •  Integer identifier •  Primary touch-point flag •  State - Pressed, Moved, Stationary, or Released •  Current, previous, starting positions •  Local, scene, screen, normalized translations •  Area, pressure (if supported by device) 25

API Touch events are not sent by default •  Must be enabled first •  When enabled, TouchBegin event will be accepted unless explicitly ignored 26

API Qt::WA_AcceptsTouchEvents •  Set on QWidget to receive touch events •  To handle events, reimplement QWidget::event() •  Default implementation emulates mouse events for first non-primary touch-point •  Set on viewport() of QAbstractScrollArea based widgets •  To handle events, reimplement QAbstractScrollArea::viewportEvent() 27

API QGraphicsItem::setAcceptsTouchEvents(bool) •  Set to true on item to receive touch events •  To handle, reimplement QGraphicsItem::sceneEvent() •  No default implementation 28

API Gestures •  QGesture and QGestureRecognizer classes •  Widgets subscribe to gestures •  Using standard gestures •  Implementing custom gestures 29

API QGesture •  Base class for more complex gestures •  Basic properties and convenience functions •  Delivered to QWidget or QGraphicsObject •  State (Started, Updated, Finished, Canceled) QGestureEvent •  Contains a list of QGestures •  Normal event propagation rules apply 30

API QGestureRecognizer •  “Just” an event filter + state machine •  Registered in QApplication •  Announces when a gesture is triggered 31

API How do I use a gesture? •  Use grabGesture() to request it •  Handle the QGestureEvent and get: QPanGesture -  Offset property QPinchGesture -  Center-point, rotation, scale properties 32

API Implementing custom gestures •  Create a state machine: - subclass QGestureRecognizer - implement filterEvent(), createGesture(), reset() •  Create a gesture object: - subclass QGesture (optional) - fill QGesture with properties 33

API Gestures can be simple : Four finger tap class FourFingerTapGesture : public QGestureRecognizer { virtual Result filterEvent(QGesture *, QObject *, QEvent *event) { if (event->type() == QEvent::TouchUpdate) if (static_cast<QTouchEvent *>(event)->touchPoints.size() == 4) return GestureFinished; return Ignore; } }; 34

API Gestures can be complex •  Event filter could implement a state machine •  Continuous gesture going through Qt::GestureStated to Qt::GestureUpdated to Qt::GestureFinished states. •  Gesture may need to hijack events, store them, and replay them later 35

API Special considerations when implementing and/ or using gestures 36

API Single gesture on parent widget with children •  Should the parent's gesture filter events for children? GestureContext •  widget-only gesture •  widget-with-children gesture 37

API Multiple gestures on a single widget •  All gestures filter incoming events in undefined order •  Ignored gestures will be propagated •  You can partially ignore a gesture: bool gestureEvent(QGestureEvent *event) { event->ignore(Qt::PanGesture); event->accept(Qt::PinchGesture); return true; } 38

API Gesture has priority over normal event handling •  Gesture may need several events before starting •  Normal event handling interferes with gesture •  Events should be delayed 39

Agenda Introduction Concepts API •  Examples Q&A 40

API ITAI: PictureBlue by Ariel Molina h$p://vimeo.com/4990545 41

Examples Using QTouchEvent... MyWidget::MyWidget(QWidget *parent) { setAttribute(Qt::WA_AcceptsTouchEvents); } 42

Examples Using QTouchEvent... bool MyWidget::event(QEvent *e) { switch (e->type()) { case QEvent::TouchBegin: case QEvent::TouchUpdate: case QEvent::TouchEnd: { // creative stuff here } } 43

Examples Using QTouchEvent... QTouchEvent *te = static_cast<QTouchEvent *>(e); QList<QTouchEvent::TouchPoint> points = te->touchPoints(); if (touchPoints.count() == 2) { // Do something interesting here } 44

Examples Using QTouchEvent... // determine scale factor QTouchEvent::TouchPoint p0 = touchPoints.first(); QTouchEvent::TouchPoint p1 = touchPoints.last(); QLineF line1(p0.startPos(), p1.startPos()); QLineF line2(p0.pos(), p1.pos()); qreal scaleFactor = line2.length() / line1.length(); setContentScale(scaleFactor); 45

Examples Using QTouchEvent... // determine angle between previous and current pos QTouchEvent::TouchPoint p0 = touchPoints.first(); QTouchEvent::TouchPoint p1 = touchPoints.last(); QLineF line1(p0.lastPos(), p1.lastPos()); QLineF line2(p0.pos(), p1.pos()); qreal angle = line2.angleTo(line1); rotateContentBy(angle); 46

And now some gestures...

Examples Custom gesture – four finger tap class FourFingerTapGesture : public QGestureRecognizer { virtual QGesture createGesture(QObject *) { return new QGesture(“FourFingerTap”); } } virtual Result filterEvent(QGesture *state, QObject *, QEvent *event) { if (event->type() == QEvent::TouchUpdate) if (static_cast<QTouchEvent *>(event)->touchPoints.size() == 4) { state->setProperty(“foo”, QLatin1String(“bar”)); return GestureFinished; } return Ignore; } }; 48

Examples Custom gesture – four finger tap class Label : public QLabel { virtual void gestureEvent(QGestureEvent *event) { if (QGesture *g = event->gesture(“FourFingerTap”)) { setText(g->property(“foo”)); event->accept(g); } ... QLabel *label = new Qlabel; label->setPixmap(QPixmap(“qt-logo.png”)); label->grabGesture(“FourFingerTap”); 49

Agenda Introduction Concepts API Examples •  Q&A 50

Thanks! Any Questions? 51

http://mms-core.weebly.com	176
http://www.slideshare.net	93
http://sd3svr1.yto.fjh.fujitsu.com	24
http://www.develer.com	19
http://www.plurk.com	7

Using Multi-Touch and Gestures with Qt

by Qt Project

Accessibility

Categories

Upload Details

Usage Rights

5 Embeds 319

Statistics

Using Multi-Touch and Gestures with Qt Presentation Transcript