Run Qt 5 raster window example on the Lego Mindstorms EV3

In this article, we'll see how to run the Qt raster window example on the EV3 screen.

QPA stands for Qt Platform Abstraction. It has been added to Qt 4.8 as an alternative to QWS and allows to design graphic applications for embedded devices. In Qt 5, QPA has totally replaced QWS.

If you're curious about QPA, take a look at these links:

http://qt-project.org/wiki/Qt-Platform-Abstraction

http://qt-project.org/videos/watch/qpa-the-qt-platform-abstraction

http://qforever.wordpress.com/2012/04/10/qt-platform-abstraction-starter-guide/

To make Qt display text and other things on your device, you must have a fitting platform plugin. Since there is no such plugin for the EV3, we'll have to craft it.

Quotes from QPA main page:

There is currently little documentation for QPA. The best approach for developing a new platform plugin is to look at the other plugins [qt.gitorious.net] and see how they implement the APIs in question.

There are no source or binary compatibility guarantees for the QPA classes, meaning that a platform plugin is only guaranteed to work with the Qt version it was developed against. API changes will however only be made in minor releases. (5.1, 5.2, and so on.)

EV3 display mechanism:

When something appears on the screen of your EV3, data has been written to the /dev/fb0 framebuffer. You can do a simple test by entering this command on your EV3:

cat /dev/urandom > /dev/fb0

Which should give something like this:

/dev/urandom is a random number generator, that's why it displays noise.


EV3's framebuffer is not standard because one pixel on the screen corresponds to 3 bits in the buffer. However the qlinuxfb plugin provided by Qt is a good start to make our plugin.

How to build EV3 platform plugin:

• First you must have compiled Qt for your beloved brick. See this article for some explanations. Be careful, you must configure without the "-no-gui" option which was present in the first version of the article.
  
• Download source code using git:

  git clone https://github.com/broija/ev3linuxfb

• Copy ev3linuxfb directory to your qt source package directory. For example:

  cp -r ev3linuxfb qt-everywhere-opensource-src-5.1.1/qtbase/src/plugins/platforms/

• Go to this directory and build the plugin using the qmake created from the Qt compilation dedicated to the EV3 in order to generate the Makefile. For example:

  cd qt-everywhere-opensource-src-5.1.1/qtbase/src/plugins/platforms/
  qmake.ev3
  make

Build the raster window example project:

• Go to the raster window example directory in Qt source package:

  cd qt-everywhere-opensource-src-5.1.1/qtbase/examples/gui/rasterwindow

• Edit rasterwindow.cpp with your favorite text editor. We want to change setGeometry parameters in RasterWindow's constructor in order to fit the EV3 screen:

  //    setGeometry(100, 100, 300, 200);
  setGeometry(0, 0, 178, 128);

  RasterWindow inherits QWindow. We've just created a 178x128 window (which is the brick's screen size) with an offset at 0,0.
• Once again, generate the Makefile and build:

  qmake.ev3
  make

Final preparations:

• Copy the freshly built 'libev3linuxfb.so' plugin to your EV3 SD card, in /media/card/lib/platforms. The file is located in this directory: qt-everywhere-opensource-src-5.1.1/qtbase/plugins/platforms/
• Copy all the fonts to your EV3 SD card, in /media/card/lib/fonts. They are located in the Qt installation directory: Qt5.1.1/lib/fonts
• Set the environment for QPA (Qt Platform Abstraction) by entering these commands on your EV3:

  export QT_QPA_FONTDIR=/media/card/lib/fonts
  export QT_QPA_PLATFORM_PLUGIN_PATH=/media/card/lib/platforms

• Finally, copy the rasterwindow executable to your EV3. For example in /media/card/rasterwindow/

The fun part:

Run the application and tell Qt that you want it to use the ev3linuxfb platform plugin to display things on screen:

/media/card/rasterwindow/rasterwindow -platform ev3linuxfb

Thanks to Xander from the Mindboards forum who gave me the idea to do this.