[Solved] QML and Drag and Drop

xsacha

Yeah, if you re-parent the icons, any action on the gridView won't affect them any more (even destroying the grid view!).
So what you need to do is:

Re-parent back to gridView
beginResetModel()/endResetModel() or other actions
Re-parent back to loc/screen

You can think of this as two states. Its parent should be 'loc' (or screen) when it is in a moving state because you want animations. Its parent should be the gridView when it is in a modification state (reseting model/destroying gridView or whatever else you need to do).

Deqing

Cool! I solved it by simply moving "parent: loc" into the state "active".

Thanks a lot!

kyleplattner

Just a followup question: How can I persist the drag and dropped location so that when the user navigates away from the page and returns the arrangement that the user chose is still present.

Deqing

I guess you need to store the locations in the model.

kyleplattner

I do need to keep the locations of the dragged items. What would be the best way to accomplish this?

Deqing

I'm using C++ data model and store items in a list.

When drag-and-drop finishes, I will not only move items in the GridView, but also move them inside the list in C++ code at the same time.

sfjam

this can work in one screen,but when i scroll the screen,this does not work,how to change it

xsacha

Hi sfjam. Can you elaborate on your issue?

Are you scrolling to a second GridView or scrolling within the GridView?

My solution for scrolling within a GridView is on the previous page (fourth comment from bottom).

If you want multiple GridViews, the code gets more complex. Post back if this is what you desire (multi-grid draggable icon layout).

fonzi337

Wow, thanks xsacha for putting this together! It's amazing how little code is involved to get such nice complex-looking behavior. :)

I suggest a small tweak to the code: it looks like if an item at a lower index is in the active state and is moved towards an item of a higher index in the model, the active item is drawn behind the item with the higher model index. Setting the z value of the active item in the state PropertyChanges definition should do the trick:

@PropertyChanges { target: item; x: loc.mouseX - width/2; y: loc.mouseY - height/2; scale: 0.5; z: 500 }@

xsacha

Thanks, I'll add that :)

meolic

If I change line 23 in Main.qml to have "onPressed" instead of "onPressAndHold", the application is not working properly (problem with index). Where is the problem and how to solve it?

EDIT: Adding hoverEnabled: true solved this issue. But I'm not sure whether hoverEnabled has important impact on efficiency?

meolic

[quote author="Deqing" date="1293608551"]Cool! I solved it by simply moving "parent: loc" into the state "active".
[/quote]

I am trying the same. But items are not correctly drawn (wrong x,y) if I remove "parent: loc" from Image {id: item ... }.

Can you give us your solution, please.