[Marble-devel] Review Request 124550: QML delegate for displaying search results on top of the map

[Dennis Nienhüser]

-----------------------------------------------------------
This is an automatically generated e-mail. To reply, visit:
https://git.reviewboard.kde.org/r/124550/
-----------------------------------------------------------

Review request for Marble.


Repository: marble


Description
-------

Currently we have no (good, easy) way to place a QML item on top of the map and have it stick to a certain geo position. The approach in this patch is taken from the marble-touch app: Any QML code can be assigned to the new placemarkDelegate property of the Search. Similar to a delegate of e.g. a ListView, for any item in the model a QML object is then instantiated from that QML delegate component prototype. Context properties (e.g. index, name, longitude, latitude) are queried from the model and assigned to each instantiated item, and the C++ part takes care of setting the screen position and the visibility of each QML placemark instance.

The QML part e.g. looks like this

    SearchBackend {
        ...
        placemarkDelegate: Image {
            transformOrigin: Item.Bottom
            source: "qrc:/ic_place_black_18dp.png"

            MouseArea {
                anchors.fill: parent
                onClicked: console.log("Clicked on result (" + index + ") " + name + " at (" + longitude.toFixed(6) + ", " + latitude.toFixed(6) + ")")
            }
        }
    }
    
and the maintenance (creation, position+visibility updates, deletion) of the items happens behind the scenes in C++. The result you get is something like this: http://nienhueser.de/marble/android-placemark-delegate.png
![Search result placemark delegates](http://nienhueser.de/marble/android-placemark-delegate.png)

As the delegate code is in QML and context properties are directly available, any sort of interaction can be done very easily. It's not perfect though: Since all rendering is done outside of Marble's rendering, the QML delegates are always rendered on top of every other map items, including float items. For Marble Maps this should be OK though.

You can see a similar thing when starting bin/marble-touch from latest master. The search activity there uses the same approach to display search results and start routing from them (routing is not yet ported in there). The weather activity is quite interesting as well: It uses QML delegates to replace the C++ rendering of a whole plugin layer (weather items) with custom QML delegates.

I don't intend to push the code as-is, rather see it as a base for discussion and possibly further work on top of it.


Diffs
-----

  data/android/drawable-xxxhdpi/ic_place_black_18dp.png PRE-CREATION 
  src/apps/marble-maps/MarbleMaps.qrc d027af9 
  src/apps/marble-maps/Search.qml 896f266 
  src/lib/marble/declarative/SearchBackend.h b041de3 
  src/lib/marble/declarative/SearchBackend.cpp 5c80cc3 

Diff: https://git.reviewboard.kde.org/r/124550/diff/


Testing
-------

Tested on the Nexus 4 and Desktop


Thanks,

Dennis Nienhüser

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://mail.kde.org/pipermail/marble-devel/attachments/20150731/e637861f/attachment.html>