[QML] What can i use to allow adding images on clic ?



  • Hi,

    I'm developping a software where the user has a map in front of him (which is an image), and he can click it and it automatically add "markers" on the map where it has been clicked. Each click on the map generate a new marker, and the user can eventually drag them or delete them.
    The "markers" are simple images too.

    I'd like to have access to the coordinates of each marker, in order to allow the user to modify them.

    What kind of object can i use to do so ( preferably in QML ) ?
    For the moment i'm using Qt.createComponent("marker.qml"); which allow to create, drag and delete items, but it doesn't do the trick since i'm unable to access the coordinates of each marker one by one.


  • Moderators

    Hi @Kaxu and Welcome
    I find following two ways to do it:

    • Maintain a list to store the create objects
        property var listObj: []
        ...
        var comp  = Qt.createComponent("Marker.qml")
        var obj = comp.createObject(rect,{"x": mouseX, "y": mouseY, "objectName": "marker"}) //rect = parent
        listObj.push(obj)
    
    
    Then you can just iterate the list and access the Items as well as its properties.
    
    for(var item in listObj)
        console.log(listObj[item].x, listObj[item].y)
    
    • Iterate the children of parent of Marker.qml object.
       var comp  = Qt.createComponent("Marker.qml")
       var obj = comp.createObject(rect,{"x": mouseX, "y": mouseY, "objectName": "marker"})
       
       ...
       
       for(var item in rect.children) {
            if(rect.children[item].objectName==="marker")
                 console.log(rect.children[item].x, rect.children[item].y)
       }
    

    Hope I understood you correctly :)



  • I fact, i have to take the coordinates from a database, so i have them in the C++ part.
    What i'd like to know is if there is an object i can use where i could do something like this :

    void getCoordinates() {
    // Connecting to DB
    // Getting every x and y from each row
    
      for (row=0;row<db.rowCount();row++) {
             createMarker(x,y);
      }
    }
    

    How can i do such a thing? Which QItem should i use ?


  • Moderators

    This post is deleted!


  • @p3c0 this is not c++ code... And i can't access the database in Javascript.


  • Moderators

    @Kaxu From C++ side you can use QQmlComponent. After creation cast it to QQuickItem and then set x and y coordinates using setProperty. Follow the example on that link. Then after creating

    QObject *myObject = component.create();
    QQuickItem *item = qobject_cast<QQuickItem*>(myObject);
    item.setProperty("x",x); //x and y which you already have.
    item.setProperty("y",y);
    

Log in to reply
 

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