Qt5 QML: swap two Items in ListView - qt

Question

i'm using model view in qml.
ListView{
id: targetParameter
width: parent.width
height: parent.height
anchors.top: parent.top
anchors.left: parent.left
anchors.leftMargin: 20
spacing: 10
orientation: ListView.Horizontal
interactive: false
model: proxyModelCharacterization
delegate: ParameterChangeTarget {
paramWidht: {
if(name === "NAME"){
targetParameter.width * 0.11
}else{
targetParameter.width * 0.42
}
}
paramHeight: targetParameter.height * 0.95
}
}
with this list view, I have three elements (for example Rectangle).
rect1, rect2, rect3.
i want to swap rect2 and rect3, but i can't change the order in which they are instantiated on my controller.
how can i swap two element on list view?
every kind of help or suggestion are greatly appreciated.

Answer 1

You can use the .move() method to move an element in a ListModel.
In the following example, the elements are added in the ListModel once, in the Component.onCompleted signal. You can then move them up or down (in the model and hence, the view) by clicking on the corresponding buttons. The buttons use the move() method of ListModel.
Example:
ListModel {
id: listModel
}
ListView {
id: listView
anchors.fill: parent
spacing: 10
model: listModel
delegate: Rectangle {
height: btnMoveUp.height
width: listView.width
color: "red"
Button {
id: btnMoveUp
anchors.left: parent.left
text: "Move Up"
enabled: index !== 0
onClicked: listModel.move(index, index-1,1)
}
Button {
id: btnMoveDown
anchors.left: btnMoveUp.right
text: "Move Down"
enabled: index !== listModel.count - 1
onClicked: listModel.move(index, index+1,1)
}
Text {
anchors {
left: btnMoveDown.right
right: parent.right
verticalCenter: parent.verticalCenter
}
text: model.name
}
}
}
Component.onCompleted: {
listModel.append({name: "Item 1"});
listModel.append({name: "Item 2"});
listModel.append({name: "Item 3"});
listModel.append({name: "Item 4"});
listModel.append({name: "Item 5"});
}