Developing and Benchmarking Qt applications on Hawkboard with Xgxperf


Published on

Presentation for HawkTalk Webinar, July 2010. Focuses on optimised Qt development using Xgxperf, and discusses available classes in Qt for application/UI development.

Published in: Technology
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Developing and Benchmarking Qt applications on Hawkboard with Xgxperf

  1. 1. Developing Qt applications on HawkBoard Prabindh Sundareson [email_address] July 2010
  2. 2. Agenda <ul><li>Qt Introduction </li></ul><ul><ul><li>Quick history, Licensing model </li></ul></ul><ul><li>Fundamental concepts </li></ul><ul><ul><li>Typical application software stack </li></ul></ul><ul><ul><li>Qt application classes </li></ul></ul><ul><ul><li>Qt Graphics View framework </li></ul></ul><ul><ul><li>Signal/Slot mechanism </li></ul></ul><ul><ul><li>Configuring and Building Qt </li></ul></ul><ul><li>Tools </li></ul><ul><ul><li>Qt Creator </li></ul></ul><ul><li>Introduction to XgxPerf – TI Graphics Toolkit </li></ul><ul><li>Developing a Qt application in 2 minutes with XgxPerf (Demo) </li></ul><ul><li>Qt Development – Tips for performance </li></ul><ul><li>Qt vs Android vs Silverlight vs Flash </li></ul><ul><li>Conclusion & QnA </li></ul>
  3. 3. Qt History <ul><li>Started as an offering from Trolltech </li></ul><ul><li>Trolltech is now part of Nokia </li></ul><ul><li>Qt framework is available in source form, with multiple support options </li></ul><ul><li>Works on Linux framebuffer, WinCE, X, Windows, even on Android </li></ul><ul><li>Continuously evolving, now at 4.7.x (Beta) </li></ul>
  4. 4. Qt Licensing Model Commercial LGPL v. 2.1 GPL v. 3 License Cost License fee charged No cost No cost Must provide source code for changes to Qt No, modifications can be closed Source code must be provided Source code must be provided Can create proprietary application Yes—no obligation to disclose source code Yes, if dynamically linked to Qt library No, application is subject to the GPL Support Yes, with valid maintenance agreement Not included, available separately Not included, available separately Charge for Runtimes Yes—in some instances* No, distribution is royalty free No, distribution is royalty free
  5. 5. The Qt Framework FB Cairo Qt API (Linux / WinCE) DirectFB Surface Managers X Window System/Mgrs Application Framework HW Device Tslib, Mouse GWES Input Device Manager Qt/e Qt/X XgxPerf GDI DDr a w Win32/ Windowing System
  6. 6. Typical Application Components Feedback to User (GUI) Application Event Handler(s) Application Event Loop Environment Input Events Output Changes Sensor User Input Events Mouse/ts Ex. Increase speed by calling driver interface ioctl Qt
  7. 7. Qt - HawkBoard <ul><li>Qt relies on Linux frame buffer driver provided by HawkBoard linux package </li></ul><ul><li>The frame buffer interface controls what resolutions are supported by Qt </li></ul><ul><li>Maximum resolution supported on HawkBoard </li></ul><ul><ul><li>640 x 480, 16 bpp </li></ul></ul><ul><li>Qt/embedded always outputs to full screen </li></ul><ul><ul><li>QWS is a simple window system for Qt/e </li></ul></ul><ul><ul><li>Qt also works with X on Linux </li></ul></ul><ul><li>Touch screen, and Mouse/Keyboard supported </li></ul>
  8. 8. Qt Application Classes
  9. 9. Steps for Creating Qt based UI <ul><ul><li>Build Qt for target, using provided Qt cross compile options </li></ul></ul><ul><ul><li>Design the UI in Qt Designer </li></ul></ul><ul><ul><li>Add necessary event handlers in CPP file </li></ul></ul><ul><ul><li>Add necessary application level code </li></ul></ul><ul><ul><ul><li>Ex, Timers, Network stacks, Motor control, … </li></ul></ul></ul><ul><ul><li>Create .PRO project file </li></ul></ul><ul><ul><li>Build, install to target </li></ul></ul><ul><ul><li>Debug directly on target for peripheral accesses </li></ul></ul>
  10. 10. Qt – App Development with GraphicsView <ul><ul><li>#include “automation.h” </li></ul></ul><ul><ul><li>void AutomationApp::Init() </li></ul></ul><ul><ul><li>{ … </li></ul></ul><ul><ul><li>/* Create a new sample widget that shows a text within a information box – see automation library in xgxperf */ </li></ul></ul><ul><ul><li> pValveText1 = new InfoBoxClass(0,QRectF(260,290,20,20),&quot;1.1&quot;); </li></ul></ul><ul><ul><li>/* Add the item to the Graphics scene and make it visible on screen – Note that the GraphicsView was already created for us by the framework in xgxperf */ </li></ul></ul><ul><ul><li> m_scene->addItem(pValveText1); </li></ul></ul><ul><ul><li>/* Add the item to a current list, for book-keeping during exit */ </li></ul></ul><ul><ul><li> workItemList << pValveText1; </li></ul></ul><ul><ul><li>… </li></ul></ul><ul><ul><li>} </li></ul></ul>
  11. 11. Basics of Qt - Widgets
  12. 12. Basics of Qt - Widgets <ul><li>Qt UI framework is based on widgets </li></ul><ul><li>Widgets respond to UI events (key presses/mouse movements), and update their screen area </li></ul><ul><li>Each widget has a parent, that affects its behaviour, and is embedded into it </li></ul><ul><li>Can create “complex” shapes using masks </li></ul><ul><ul><li>See Automation Classes in Xgxperf </li></ul></ul><ul><li>Most Qt classes are derived from QWidget </li></ul><ul><ul><li>Ex, QGLWidget, QPushbutton … </li></ul></ul><ul><ul><li>QPushButton * myButton = new QPushButton(…); </li></ul></ul><ul><ul><li>myButton->doSomethingAPI(); </li></ul></ul><ul><li>Refer to online documentation at </li></ul><ul><ul><li> </li></ul></ul><ul><ul><li>Tip – Documentation is arranged using class names. </li></ul></ul>
  13. 13. QGraphicsView <ul><li>Provides a “Canvas” for adding items (QGraphicsItems) </li></ul><ul><li>The QGraphicsView class provides a widget for displaying the contents of a QGraphicsScene </li></ul><ul><li>By default, QGraphicsView provides a regular QWidget for the viewport widget. </li></ul><ul><ul><li>Can replace default by calling setViewport() with another widget type </li></ul></ul><ul><li>Provides a way to build an UI in an “actual” drawing canvas </li></ul><ul><ul><li>Ex, concept of “z-depth” of a QGraphicsItem </li></ul></ul>
  14. 14. Qt - Signals/ Slots <ul><li>Signal / Slot mechanism provides a functionality similar to setting up “function pointers” </li></ul><ul><ul><li>Provides better type checking, amongst others </li></ul></ul><ul><li>Example Use-case: Perform blocking/ time consuming activities in separate thread </li></ul><ul><ul><li>Use paintEvent() to trigger/consume the result of actions happening in parallel (ex. Upload next video frame) </li></ul></ul><ul><li>How to communicate events ? </li></ul><ul><ul><li>Use SIGNAL/SLOT to communicate event completions </li></ul></ul><ul><li>Usage example for Signal/Slots: </li></ul><ul><ul><li>“ browserlib” app in xgxperf </li></ul></ul><ul><ul><ul><li>Found in /Xgxperf/browserlib/ browserlib.cpp </li></ul></ul></ul>
  15. 15. Using SIGNAL/SLOT <ul><li>Class myClass: public QThread </li></ul><ul><li>{ </li></ul><ul><li>Q_OBJECT /* Needed for signal/slot mechanism to work at runtime */ </li></ul><ul><li>Public: … </li></ul><ul><li>signals: </li></ul><ul><li> void function1(const QImage &image, double scaleFactor); </li></ul><ul><li>}; </li></ul><ul><li>In thread code, </li></ul><ul><li>emit function1(image, scaleFactor); </li></ul>In Main application, define the actual function:: void myWidget::mainWidgetFunction(const QImage &image, double scaleFactor){} … And connect the signal and slot: connect(&thread, SIGNAL(mainWidgetFunction(const QImage &, double)), this, SLOT(function1(const QImage &, double)));
  16. 16. QPainter <ul><li>Low level painting API, for overriding default painting behaviour of widgets </li></ul><ul><ul><li>Handles Text and other Drawing primitives (very flexible API) </li></ul></ul><ul><ul><li>Can perform operations that the Widget/other Class APIs do not expose (ex, create a circular window) </li></ul></ul><ul><li>Usage modes </li></ul><ul><ul><li>Subclass QWidget, and handle Paint event </li></ul></ul><ul><ul><ul><li>void paintEvent(QPaintEvent *event) </li></ul></ul></ul><ul><ul><ul><li>QPainter can be accessed only within a paint event </li></ul></ul></ul><ul><li>Usage example: </li></ul><ul><ul><li>“ automation” app in xgxperf </li></ul></ul>
  17. 17. Qt – Classes for UI development <ul><li>Canvas </li></ul><ul><ul><li>QGraphicsView, QGraphicsScene </li></ul></ul><ul><li>Text </li></ul><ul><ul><li>QStaticText, QString, QGraphicsTextItem </li></ul></ul><ul><li>Icons </li></ul><ul><ul><li>QSvgWidget, QGraphicsSvgItem, QLabel </li></ul></ul><ul><li>Animations </li></ul><ul><ul><li>QPropertyAnimation </li></ul></ul><ul><li>3D </li></ul><ul><ul><li>QGLWidget (not on Hawkbrd) </li></ul></ul><ul><li>Bitmap loading </li></ul><ul><ul><li>QPainter </li></ul></ul><ul><ul><li>QPixmap, QImage </li></ul></ul>
  18. 18. Setting up and building Qt <ul><li>Documented in detail for non-OpenEmbedded users at, </li></ul><ul><ul><ul><li> </li></ul></ul></ul><ul><li>Angstrom (OpenEmbedded based) distribution has Qt package for Hawkboard </li></ul><ul><ul><li>A configurable pre-built filesystem with Qt integrated, and kernel image for Hawkboard can be downloaded from </li></ul></ul><ul><ul><ul><ul><li> </li></ul></ul></ul></ul><ul><ul><ul><ul><ul><li>Select “hawkboard” machine type from pull-down menu </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><ul><li>Select “Qt” – embedded or X11 based on desktop environment in addition application selection option </li></ul></ul></ul></ul></ul>
  19. 19. Debugging and Profiling Qt Applications <ul><li>Use Qt Creator, an integrated designer/debugger </li></ul><ul><ul><li>Latest version is 1.3 </li></ul></ul><ul><ul><li> </li></ul></ul><ul><li>Needs GDB on Linux, and CDB for PC </li></ul><ul><li>But usually much easier to just do </li></ul><ul><ul><li>qDebug() << “printed from here”; </li></ul></ul><ul><ul><ul><li>To get output on terminal and trace code flow </li></ul></ul></ul><ul><li>Angstrom package provides oprofile to profile application code </li></ul><ul><li>Use Xgxperf to benchmark at specific fps </li></ul>
  20. 20. Qt Creator <ul><li>Used to create a new form design </li></ul><ul><ul><li>Output saved as a .UI file (text format) </li></ul></ul><ul><ul><li>This can be imported into the Qt application via Qt classes </li></ul></ul>
  21. 21. Creating a Widget (old screenshot)
  22. 22. Using .UI files <ul><li>Qt Creator generates -> .UI file </li></ul><ul><li>Steps to create application from .UI file: </li></ul><ul><ul><li>Add .ui file to project using .PRO entry </li></ul></ul><ul><ul><li>Subclass Ui:: in application </li></ul></ul><ul><ul><ul><li>Ex, see “vslib” application in Xgxperf </li></ul></ul></ul><ul><ul><ul><ul><li>/xgxperf/vslib/vslib.cpp </li></ul></ul></ul></ul><ul><ul><ul><li>class VSApp : public ApplicationBase, private Ui::MainWindow </li></ul></ul></ul><ul><ul><li>Use “setupUi” call directly – </li></ul></ul><ul><ul><ul><ul><li>setupUi(this); </li></ul></ul></ul></ul>
  23. 23. Integrating .UI files TEMPLATE = lib SOURCES = vslib.cpp export.cpp HEADERS = ../applicationmanager/common/applicationbase.h vslib.h FORMS = mainwindow.ui RESOURCES = resource.qrc VSApp::VSApp(QWidget* parent, QRectF inSceneRect, QGraphicsScene *scene, void* data): ApplicationBase(parent, inSceneRect,scene,data) { //Store the test data locally m_widgetTestInStruct = (TestTargetParamsStruct*)data; currTimerCount = 0; setupUi( this); } c lass VSApp : public ApplicationBase, private Ui::MainWindow Location - Xgxperf/vslib .pro .cpp .h
  24. 24. XgxPerf <ul><li>Xgxperf is a collection of ready made examples, and classes for different end use-cases </li></ul><ul><ul><li>Industrial automation, Medical, Automotive displays, 3D, Sewing Machine, Surveillance,.. </li></ul></ul><ul><li>Uses QGraphicsView </li></ul><ul><li>Configurable input parameters for UI components </li></ul><ul><li>Provides profile output for </li></ul><ul><ul><li>UI startup time and CPU load </li></ul></ul><ul><li>Additionally, includes “livemem”, an off-screen display plugin for Qt/e (writes Qt’s display rendering outputs to image file) </li></ul><ul><ul><li>Useful for analysing widget rendering performance independent of display driver performance </li></ul></ul><ul><ul><li>And for remote debugging/ archival </li></ul></ul><ul><li>Additionally, includes “sgxperf”, a 3D benchmarking tool, for SGX based devices like the AM35x/37x families </li></ul><ul><li>XgxPerf TI application note – </li></ul><ul><ul><li>Will be available in TI website in September 2010 – TI Application Note # SPRABF4 </li></ul></ul><ul><ul><li>Draft version available at < this link > now </li></ul></ul><ul><li>External Wiki page on Xgxperf </li></ul><ul><ul><li> </li></ul></ul>
  25. 25. XgxPerf Usage <ul><li>SVN access: </li></ul><ul><ul><li>svn checkout http:// </li></ul></ul><ul><ul><ul><li>Username = anonymous, password= (blank) </li></ul></ul></ul><ul><li>(or) Download and extract source tarball </li></ul><ul><ul><li>Non-OpenEmbedded users </li></ul></ul><ul><ul><ul><li> (check SVN for latest) </li></ul></ul></ul><ul><ul><ul><li>Update path of framework (ex. QTDIR =) in Rules.make </li></ul></ul></ul><ul><ul><ul><li>Build - “make && make install” </li></ul></ul></ul><ul><ul><li>Open Embedded-users </li></ul></ul><ul><ul><ul><li>For Angstrom setup, use the recipes for Angstrom at </li></ul></ul></ul><ul><ul><ul><li> </li></ul></ul></ul><ul><ul><ul><li>Build any image that provides Qt - X11 or Qt – Embedded package </li></ul></ul></ul><ul><ul><ul><li>Choose the appropriate Xgxperf recipe: </li></ul></ul></ul><ul><ul><ul><li>ti-xgxperf-qt-x11 for X11 build, or ti-xgxperf-qt-embedded. X11 build is shown below. </li></ul></ul></ul><ul><ul><ul><li>Q^oe] sh bitbake ti-xgxperf-qt-x11 </li></ul></ul></ul><ul><ul><ul><li>Q^oe] ls -l build/tmp-angstrom_2008_1/deploy/glibc/ipk/armv7a/ti-xgxperf-qt-x11_1.0.0.0-r0+svnr54.5_armv7a.ipk </li></ul></ul></ul><ul><ul><ul><li>-rw-r--r-- 1 prabindh prabindh 4873428 2010-07-19 20:18 build/tmp-angstrom_2008_1/deploy/glibc/ipk/armv7a/ti-xgxperf-qt-x11_1.0.0.0-r0+svnr54.5_armv7a.ipk </li></ul></ul></ul><ul><li>XgxPerf is now ready to use on local HW EVM </li></ul><ul><ul><ul><ul><li>./xgxperf_app [–qws] <cookie> <fps> … </li></ul></ul></ul></ul>
  26. 26. Pre-configured applications Test 0 - Industrial Automation blocks (Turbines, Boilers, Pipes, Text Info classes) Test 1 – Text + Pictures (PNG/VG/Colors) Test 2 – Involves GLWidget, needs powervr (not on HawkBoard) Test 3 – Webkit Browser Test 4 – Automotive Tacho Test 5 – Medical ECG Monitor Test 6 – Video Surveillance camera feed Monitor Test 7 – Sewing Machine UI
  27. 27. XgxPerf Inputs <ul><li>Configurable GUI creation input parameters: </li></ul><ul><ul><ul><li>Number/type of elements </li></ul></ul></ul><ul><ul><ul><li>Size of elements </li></ul></ul></ul><ul><ul><ul><li>Target FPS </li></ul></ul></ul><ul><ul><ul><li>Text </li></ul></ul></ul><ul><ul><ul><li>Pictures (PNG, SVG, Colour fills) </li></ul></ul></ul><ul><ul><ul><li>Effects and animations </li></ul></ul></ul><ul><ul><ul><li>3D GL parameters </li></ul></ul></ul><ul><ul><li>Creates HTML/XML outputs with profile info </li></ul></ul>
  28. 28. 2 minute Qt Application Development <ul><li>[live demo] </li></ul><ul><ul><li>Create new Xgxperf subproject from template </li></ul></ul><ul><ul><li>Add items </li></ul></ul><ul><ul><li>Build project </li></ul></ul><ul><ul><li>Use xgxperf_app to invoke </li></ul></ul><ul><ul><li>“ ./xgxperf_app –qws <args>” </li></ul></ul>
  29. 29. Qt Development Tips <ul><li>Do’s </li></ul><ul><ul><li>Use QStaticText for mostly static text items (50% performance impact compared to QText !!) </li></ul></ul><ul><ul><ul><li>needs Qt 4.7 </li></ul></ul></ul><ul><ul><li>Analyse widget “rendering” performance separately from “screen blitting” performance using “livemem” plugin </li></ul></ul><ul><ul><li>Pre-render large VG/ other bitmaps when animating, use optimised class QSvgNativeItem till issue is resolved (reduces CPU load by ~30%) </li></ul></ul><ul><ul><li>Ensure CPU load for UI operations is < 25-40 % </li></ul></ul><ul><li>Don’t’s </li></ul><ul><ul><li>Do not keep changing large background images </li></ul></ul><ul><ul><li>Do not update all items. Update only when needed and in specific locations </li></ul></ul><ul><ul><li>Avoid Animation in QGraphicsView especially for large images, use optimised classes </li></ul></ul>
  30. 30. Qt vs Android vs Silverlight
  31. 31. Next Steps <ul><li>Download Qt (Nokia), Xgxperf (TI) toolkits </li></ul><ul><li>Configure, build, extend applications using Xgxperf on HawkBoard </li></ul><ul><ul><li>Use xgxperf as starting point </li></ul></ul><ul><li>Integrate drivers/ real-time apps to Qt </li></ul>
  32. 32. Links <ul><li>Qt download </li></ul><ul><ul><li>ftp:// /qt/source/ </li></ul></ul><ul><li>Qt configure and build </li></ul><ul><ul><li>http:// </li></ul></ul><ul><li>TI XgxPerf at Gforge (OE recipes, tar.gz code, documentation, latest updates via SVN) </li></ul><ul><ul><li>https:// / </li></ul></ul><ul><li>Qt Animation with Graphics View on 4.7 </li></ul><ul><ul><li> </li></ul></ul><ul><li>TI Graphics Blog and updates </li></ul><ul><ul><li>http:// </li></ul></ul><ul><li>TI OMAP3 Graphics SDK (CortexA8/3D engine) </li></ul><ul><ul><li> </li></ul></ul><ul><li>Hawkboard web - http:// </li></ul><ul><li>Hawkboard discussions - http:// </li></ul><ul><li>TI opensource projects - http:// / </li></ul><ul><li>Beagleboard (CortexA8) - http:// </li></ul>
  33. 33. Q&A
  34. 34. THANK YOU