Animate ListView positionViewAtIndex

[_Stefan]

Hello all,

I want to create a ListView with some items. I have no problems there.
Just now, when an item is added, that does not fit in the list anymore, I would like the list to add the item and then scroll up.

I now implemented this with positionViewAtIndex, which works. But this is an immediate action. I want the list to visually scroll up, or maybe even better, animate the adding of the item (which is animated on height, so goes from 0 height, to 70) and scroll up at the same time, or something.

Anyway, something more fancy than I have now =)
I cannot find anything on the internet how to do this.

Maybe someone has done this before, or can point me in the right direction?

[leonty]

I'm advised with this from the qt support (though I don't get some details in this implementation):

import QtQuick 1.0

Rectangle {
id: window
width: 360
height: 640

function gotoIndex(idx) {
var pos = view.contentY;
var destPos;
view.positionViewAtIndex(idx, ListView.Beginning);
destPos = view.contentY;
anim.from = pos;
anim.to = destPos;
anim.running = true;
}

GridView{
id: view
anchors.fill: parent
model: 200
delegate: Text { text: index }
}

MouseArea {
anchors.fill: parent
onClicked: gotoIndex(30)
}

NumberAnimation { id: anim; target: view; property: "contentY"; duration: 500 }
}

[guatedude2]

I'm advised with this from the qt support (though I don't get some details in this implementation):

import QtQuick 1.0

Rectangle {
id: window
width: 360
height: 640

function gotoIndex(idx) {
var pos = view.contentY;
var destPos;
view.positionViewAtIndex(idx, ListView.Beginning);
destPos = view.contentY;
anim.from = pos;
anim.to = destPos;
anim.running = true;
}

GridView{
id: view
anchors.fill: parent
model: 200
delegate: Text { text: index }
}

MouseArea {
anchors.fill: parent
onClicked: gotoIndex(30)
}

NumberAnimation { id: anim; target: view; property: "contentY"; duration: 500 }
}

Worked like a charm!
Thanks

[damianatorrpm]

In case anyone comes across the same issue:
do NOT do

function gotoIndex(idx) {
var pos = view.contentY;
var destPos;
view.positionViewAtIndex(idx, ListView.Beginning);
destPos = view.contentY;
anim.from = pos;
anim.to = destPos;
anim.running = true;
}

instead use:

function gotoIndex(idx) {
anim.running = false
var pos = view.contentY;
var destPos;
view.positionViewAtIndex(idx, ListView.Beginning);
destPos = view.contentY;
anim.from = pos;
anim.to = destPos;
anim.running = true;
}

If you wonder why, well I copied the original and implemented onWheel scrolling, when scrolling released the event again, the view go stuck since the animation was not finished, with adding on top the anim.running=false, you cancel the old animation and continue with the new one actually