[Qt-qml] QML Component Snapshot / Cover-Flow (PathView) implementation suggestions

[michael.brasser at nokia.com]

Hi,

Have you verified that the slowdown is primarily from painting (and not, for example, from instantiating new delegates as the path moves)? Were you hoping to generate the images on the fly, every time, or were you planning to e.g. take a snapshot once and then save to disk?

There's no built-in QML-based way to take snapshots -- you'd need a custom C++ component to do something like this (it does seem to be a frequent request; has anyone else made a component for this already?).

Regards,
Michael

On 18/11/2010, at 12:39 AM, ext jevon.beckles at orange-ftgroup.com<mailto:jevon.beckles at orange-ftgroup.com> wrote:

Hello,

I’m trying to make a Cover Flow using a PathView. Ideally, the delegate is a heavy/complex user-defined component (intended for user interaction) but this affects the scrolling performance (scrolling is not directly done by user interaction with PathView). Only the current-index delegate is available for user interaction at any given time.

 As a work around, I’ve replaced the delegate with a Loader to load the heavy component only when I’m not scrolling (see code snippet below). I want to take a snapshot of my complex component and save it as an image (or Pixmap or other light resource) to use for my light component. Is there an easy way to do this? If not, is there an easy way or another way to improve the performance of the PathView scrolling?



PathView{

    property variant dataModel: myModel

    property bool readyToScroll: false



    id: coverFlow

    width: 360

    height: 540



    pathItemCount: 3

    preferredHighlightBegin: 0.5

    preferredHighlightEnd: 0.5

    interactive: false



    path: Path {

        id: myPath

        // path definition

    }



    model: dataModel



    delegate: Loader{

        id: delLoader

        width: coverFlow.width

        height: coverFlow.height



        sourceComponent: (readyToScroll) ? lightComponent : heavyComponent

    }



    Component{

        id: heavyComponent

        Rectangle {

            // heavy component definition

        }

    }

    Component{

        id: lightComponent

        Image{

            source: // snapshot image of heavy component

        }

    }

}


Regards,
Jevon

<ATT00001..txt>

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.qt.nokia.com/pipermail/qt-qml/attachments/20101118/7177cf24/attachment.html