QML Performance on Colibri Board and Windows CE (~600MHz,No GPU)



  • Hi,

    i recently started a proof of concept for using QML as development environment for UIs for embedded systems. The target system is an embedded system (Colibri Board) running Windows CE 6.0. It has 600 MHz (single core), but no graphic acceleration at all.

    I started by converting PSD Files into QML files (using the export script in Photoshop (see [url]http://labs.qt.nokia.com/2010/10/19/exporting-qml-from-photoshop-and-gimp/[/url])), which worked amazingly well! So I ported a couple of screens and added some simple screen changes and animations.

    However, I performed a couple of tests on the target system and it seems that animations are really really slow. Therefor I stripped the whole app down to just some basic elements and found the problem to be the amount of layers used on the gui.

    All animations seem to struggle, as soon as there are three or more layers underneath them.
    I performed a test including only one single layer as background and the animation runs smoothly on top of it.
    Also a background with an image (e.g. a png) works well.

    Two layers: the animation starts to struggle.
    Three layers: the animation has a lot of interruption and is not drawn smoothly at all.

    I removed all graphics (pngs etc.) and used just plain rectangles (without any gradients etc. but instead different colors).
    There is also no transparency or opacity set.
    The problem seems to be caused by the amount of layers, i.e. if an animation runs ontop of two or more layers.

    I tried different types of animations, but they all have the same performance issues.

    Example:
    [Layer5: my animation]
    [Layer4: Button]
    [Layer3: TestBackground]
    [Layer2: BACKGROUND FORM (e.g. dialog background)]
    [Layer1: BACKGROUND APPLICATION]

    The gui design is very specific and i won't be able to strip it down to less then three layers, because the designer wants some gui elements being animated on top of other gui elements. For example popups should slide in from left to right, or while popups are visible, the background, i.e. the previous active dialog, is supposed to be darken.

    What seems to be the problem with the layers?
    Is there a problem, because several layers have to be redrawn, while the animation runs?
    Is there a way to improve performance in such cases?

    I attached an example code below.

    Thanks for your help, any advice highly appreciated!
    Tobias


    EXAMPLE CODE USED:
    @import Qt 4.7

    Rectangle {
    id: screen_Pause
    width: 800
    height: 480

    rotation: 90
    
    Rectangle {
        color: "#FF0000"
        x: 160
        y: -144
        width: 490
        height: 828
        opacity: 1
    }
    
    
    Rectangle {
        color: "#000000"
        x: 155
        y: -162
        width: 490
        height: 828
        opacity: 1
    }
    
    
    Rectangle {
        id: popup
    
        border.color: "#363636";
        border.width: 1;
    
        color: "#cccccc";
    
        x: 178
        y: 11
        width: 444
        height: 516
        opacity: 1
    }
    
    
    Text {
        text: "Test pausiert"
        font.pixelSize: 32
        font.family: "Axel-Bold"
        font.bold: true
        color: "#ffffff"
        x: 288
        y: 47
        opacity: 1
    }
    
    
    Button2 {
        x: 211
        y: 124
        width: 380
        height: 60
        text: "test abbrechen"
        fontColor: "white"
        fontSize: 24
        fontFamily: "Axel"
        frontColor: "#363636";
    
        opacity: 1
    }
    
    
    
    Button2 {
        x: 211
        y: 194
        width: 380
        height: 60
        text: "Uebungen"
        fontColor: "white"
        fontSize: 24
        fontFamily: "Axel"
        frontColor: "#363636";
    
        opacity: 1
    }
    
    
    Button2 {
        x: 211
        y: 264
        width: 380
        height: 60
        text: "sperren"
        fontColor: "white"
        fontSize: 24
        fontFamily: "Axel"
        frontColor: "#363636";
    
        opacity: 1
    }
    
    
    Button2 {
        x: 211
        y: 334
        width: 380
        height: 60
        text: "Beenden und Ausloggen"
        fontColor: "white"
        fontSize: 24
        fontFamily: "Axel"
        frontColor: "#363636";
    
        opacity: 1
    
        onClicked: {
            screen_Pause.destroy();
        }
    }
    
    
    Button2 {
        x: 211
        y: 444
        width: 380
        height: 60
        text: "Beenden und Ausloggen"
        fontColor: "white"
        fontSize: 24
        fontFamily: "Axel"
        frontColor: "#363636";
    
        opacity: 1
    }
    

    }
    @

    BUTTON2 CLASS USED in EXAMPLE:
    @import QtQuick 1.0

    Rectangle {
    id: container

    property variant text
    property variant fontColor
    property variant fontSize
    property variant fontFamily
    property color  frontColor
    
    signal clicked
    
    height: text.height + 10; width: text.width + 20
    border.width: 1
    radius: 4
    
    color: frontColor;
    
    MouseArea {
        id: mouseArea
        anchors.fill: parent
        onClicked: container.clicked()
    }
    
    
    Text {
        id: text
    
        anchors.centerIn: parent
    
        font.pointSize: parent.fontSize
        font.family: parent.fontFamily
        color: parent.fontColor
    
        text: parent.text
    }
    

    }@



  • Hi,

    If you haven't seen it already, there are some performance suggestions available at http://doc.qt.nokia.com/4.7-snapshot/qdeclarativeperformance.html, though I'm not sure if any of them will apply in your case. For embedded X11, a common problem is the graphicssystem being used: raster is much more performant than native. But I don't think that is the case for WinCE (where raster is used by default, as far as I know).

    I'm not familiar with the Colibri Board; could you provide more information on the specs?

    Regards,
    Michael



  • Hi there,

    it is a Colibri Orchid Board made by Toradex. The processor is a Col PXA310 V1.30.
    The Spec can be found here "http://www.toradex.com/En/Products/Colibri_Modules/Colibri_PXA310":http://www.toradex.com/En/Products/Colibri_Modules/Colibri_PXA310

    How can I check, which graphics system is being used? Could it be a configuration error?

    I attached some files, which were missing in my original post. As there is the main.cpp file and the main.qml file, which dynamicly loads the qml file, which i am having problems with.

    regards
    tobias


    EXAMPLE CODE USED:
    main.cpp:
    @
    #include <QtGui/QApplication>
    #include <QDeclarativeEngine>
    #include <QDeclarativeComponent>
    #include <QDeclarativeView>

    int main(int argc, char *argv[])
    {
    QApplication app(argc, argv);

    QDeclarativeView viewer;
    viewer.setSource(QUrl::fromLocalFile&#40;"qml/Main.qml"&#41;&#41;;
    
    viewer.setAttribute(Qt::WA_OpaquePaintEvent);
    viewer.setAttribute(Qt::WA_NoSystemBackground);
    viewer.viewport()->setAttribute(Qt::WA_OpaquePaintEvent);
    viewer.viewport()->setAttribute(Qt::WA_NoSystemBackground);
    
    viewer.setFrameShape(QFrame::NoFrame);
    viewer.setWindowFlags(Qt::FramelessWindowHint);
    viewer.showFullScreen();
    
    return app.exec&#40;&#41;;
    

    }
    @

    main.qml:
    @import QtQuick 1.0

    Rectangle {
    width: 800
    height: 480
    color: "green"

    signal sendValueToCPP(int n);
    
    MouseArea {
        anchors.fill: parent;
    
        onReleased: {
            console.log("mouse.button: " + mouse.button)
    
            flyingRect.x = mouse.x;
            flyingRect.y = mouse.y;
    
            anotherFlyingRect.x = mouse.x-40;
            anotherFlyingRect.y = mouse.y-40;
        }
    }
    
    Button2 {
        x: 20; y: 140;
        width: 300; height: 20;
        text: "Pause (screen)"
        fontColor: "white"
        fontSize: 10
        fontFamily: "Axel"
        frontColor: "gray"
    
        onClicked: {
            var test = loadScreen("MyTestForm.qml");
        }
    }
    
    Item {
        id: currentScreen
    
        anchors.fill: parent
    }
    
    Rectangle {
        id: flyingRect
    
        width: 20
        height: 20
    
        border.color: "black"
        border.width: 2
        radius: 5
        color: "yellow"
    
        Behavior on x { SmoothedAnimation { velocity: 200; } }
        Behavior on y { SmoothedAnimation { velocity: 200; } }
    }
    
    Rectangle {
        id: anotherFlyingRect
    
        width: 30
        height: 30
    
        border.color: "black"
        border.width: 2
        radius: 5
        color: "blue"
    
        Behavior on x { NumberAnimation { duration: 1000; easing.type: Easing.OutBounce } }
        Behavior on y { NumberAnimation { duration: 1000; easing.type: Easing.OutBounce } }
    }
    
    function loadScreen(strQMLFile) {
        var component = Qt.createComponent(strQMLFile);
        console.debug("component: " + component);
    
        if (component.status == Component.Ready) {
            var myNewComponent = component.createObject(currentScreen);
        }
    
        switch(component.status) {
            case Component.Null:
                console.debug("component.status: " + component.status + " = Null");
            break;
            case Component.Ready:
                console.debug("component.status: " + component.status + " = Ready");
                return component;
            break;
            case Component.Loading:
                console.debug("component.status: " + component.status + " = Loading");
            break;
            default:
            case Component.Error:
                console.debug("component.status: " + component.status + " = ERROR");
                console.debug("error message: " + component.errorString());
            break;
        }
    }
    

    }
    @

    MyTestForm.qml is the qml file listed in my original post.



  • Toradex Colibri boards based on Marvell PXA3xx cpus DO have graphics acceleration (just 2D acceleration, not 3D).
    Have you tried increasing the videoram reserved to the GCU ?
    Maybe part of the problem is there is not enough videoram to keep all the layer buffers inside it.

    "http://wiki.toradex.com/index.php/GCU_(Colibri)":http://wiki.toradex.com/index.php/GCU_(Colibri)

    N.B. The correct link above is "http://wiki.toradex.com/index.php/GCU_(Colibri)" when clicking above it seems the ")" is removed from the URL

    "http://wiki.toradex.com/index.php/VideoRAM":http://wiki.toradex.com/index.php/VideoRAM

    "http://wiki.toradex.com/index.php/BitBlt":http://wiki.toradex.com/index.php/BitBlt

    As i said above, my guess is that increasing videoram will improve things but I don't expect it to solve all the performance problems.



  • Hi,

    thanks for the hint! Indeed seems I oversaw the fact the fact that there is a 2D acceleration. I doubled the videoram from 10 MB to 20MB as you mentioned, but there is no performance improvement at all. I can't imaging that 20MB videoram are not enough for drawing some rects and texts onto the screen.

    How does Qt use the 2D acceleration? Do I have to compile Qt with OpenVG or OpenES/EGL support?

    Besides, is there a way to see, which graphicssystem is being used while a Qt app runs?
    Is it possible to see, whether the 2D acceleration is used or not?

    regards
    tobi



  • On the PXA3xx colibris the 2D acceleration is not faster than cpu-only graphics, but it can run in parallel with it (i.e. while the GCU blits a rectangle the cpu can go on doing other stuff) so the overall performance is a little better when running simultaneous graphics and cpu intensive stuff.

    I don't know if switching to OpenES/EGL you will see an inprovement (and you will need a Windows CE system build with OpenGL/EGL libraries) because I usually compile Qt for CE leaving the default graphicsystem setting (raster) for better compatibility across different devices (the baseline hardware for my application was a PXA270 without 2D acceleration and using a custom Windows CE build to minimize ram and flash memory usage to have more free memory and storage available for the application).

    Anyway, if you compiled Qt libs with all the supported graphicssystems you can try switching between them as described in the following link:
    http://doc.qt.nokia.com/latest/qapplication.html#setGraphicsSystem



  • Hey, so what is the outcome of this discussion? Any solution has been invented? I have very much the same performance issue on OMAP TI8148 board without hardware acceleration. The performance is unacceptably poor, especially when it comes to animations and transitions of the fullscreen views. For smaller animations, it works just fine. Another problem is that the application hogs a big amount of CPU and memory when doing even simple transitions (around 50% CPU and 30% MEM). I noticed that the situation is the same for QML demos that come with QtSDK. A simple clock application is eating 15% of CPU. Any ideas on how to improve the performance? I am using Qt Embedded System on the board now.

    Thanks,
    Phil



  • I also would appreciate any conclusory feedback on this topic: What was the outcome? Did compiling Qt with different graphics systems result in any new insights?

    Thanking you



  • Seems to be dead.. ;) :/



  • Not dead, I'm here! :-D
    From my little experience, different platforms suffers different drawbacks. And all the Qt performance tricks are applicable with QML (Qt::WA_OpaquePaintEvent flag for example).
    What I found to be performance killer on all platforms are graphical effects and transparencies. It makes sense as there are some computations and commpositions to display each object and low perf platform cannot cope with this.

    In conclusion, Qt and even more QML as any other high level tools, hides loads of operation done in the background and sometime some small modifications in what you ask (QML animations for example) can lead to huge impacts in performances and depends on the capacities of the platform, this is very difficult to analyse...

    NM


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.