<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[How to add transition to ListView : positionViewAtEnd()&#x2F;positionViewAtBeginning()]]></title><description><![CDATA[<p dir="auto">Hello,</p>
<p dir="auto">I need some times to set my <code>View</code> of my <code>ListView</code> on <code>lastItem</code> or <code>firstItem</code> (<a href="http://doc.qt.io/qt-5/qml-qtquick-listview.html#positionViewAtEnd-method" target="_blank" rel="noopener noreferrer nofollow ugc">positionViewAtEnd()/positionViewAtBeginning()</a>).</p>
<p dir="auto">However, it is a <strong>brutal jump</strong> and <strong>I would like to add a <code>Transition</code></strong>.</p>
<p dir="auto">I tried to add this :</p>
<pre><code>    Behavior on contentY {
        id: contentYAnimation
        PropertyAnimation {duration: 300 }
    }
</code></pre>
<p dir="auto">But it doesn't change anything.</p>
<p dir="auto">Any suggestion ?</p>
]]></description><link>https://forum.qt.io/topic/79720/how-to-add-transition-to-listview-positionviewatend-positionviewatbeginning</link><generator>RSS for Node</generator><lastBuildDate>Tue, 17 Mar 2026 00:49:38 GMT</lastBuildDate><atom:link href="https://forum.qt.io/topic/79720.rss" rel="self" type="application/rss+xml"/><pubDate>Mon, 29 May 2017 07:25:12 GMT</pubDate><ttl>60</ttl><item><title><![CDATA[Reply to How to add transition to ListView : positionViewAtEnd()&#x2F;positionViewAtBeginning() on Tue, 30 May 2017 11:22:34 GMT]]></title><description><![CDATA[<p dir="auto">The best solution I found:</p>
<p dir="auto"><a href="https://stackoverflow.com/questions/42527559/animate-positionviewatindex" target="_blank" rel="noopener noreferrer nofollow ugc">Source</a></p>
<pre><code>import QtQuick 2.7
import QtQuick.Controls 2.0

ApplicationWindow
{
    width: 1024
    height: 800
    visible: true
    property int lastAddedIndex: -1
    onLastAddedIndexChanged: gotoIndex(lastAddedIndex)

    function gotoIndex(idx) {
        anim.running = false;

        var pos = lv.contentX;
        var destPos;

        lv.positionViewAtIndex(idx, ListView.Contain);
        destPos = lv.contentX;

        anim.from = pos;
        anim.to = destPos;
        anim.running = true;
    }

    NumberAnimation { id: anim; target: lv; property: "contentX"; duration: 500 }

    Button {
        property int num: 10
        text: 'Add element: ' + num
        onClicked: {
            lastAddedIndex = Math.floor(Math.random(num) * lm.count)
            lm.insert(lastAddedIndex, { num : this.num })
            num++
        }
    }

    ListModel {
        id: lm
        ListElement { num: 0 }
        ListElement { num: 1 }
        ListElement { num: 2 }
        ListElement { num: 3 }
        ListElement { num: 4 }
        ListElement { num: 5 }
        ListElement { num: 6 }
        ListElement { num: 7 }
        ListElement { num: 8 }
        ListElement { num: 9 }
    }

    ListView {
        id: lv
        model: lm
        y: 150
        width: 800
        height: 100
        spacing: 2
        clip: true
        orientation: ListView.Horizontal
        delegate: Rectangle {
            width: 150
            height: 100
            border.color: 'black'
            color: lastAddedIndex === index ? 'purple' : 'white'
            Text {
                anchors.centerIn: parent
                text: index + ': ' + num
            }
        }

        add: Transition { NumberAnimation { property: 'width'; from: 0; to: 150; duration: 600 } }
    }
}
</code></pre>
]]></description><link>https://forum.qt.io/post/396246</link><guid isPermaLink="true">https://forum.qt.io/post/396246</guid><dc:creator><![CDATA[Fheanor]]></dc:creator><pubDate>Tue, 30 May 2017 11:22:34 GMT</pubDate></item><item><title><![CDATA[Reply to How to add transition to ListView : positionViewAtEnd()&#x2F;positionViewAtBeginning() on Tue, 30 May 2017 05:07:18 GMT]]></title><description><![CDATA[<p dir="auto"><a class="plugin-mentions-user plugin-mentions-a" href="/user/fheanor">@<bdi>Fheanor</bdi></a> Maybe you can try the same with <code>ListView</code>'s <code>currentIndex</code>.</p>
]]></description><link>https://forum.qt.io/post/396162</link><guid isPermaLink="true">https://forum.qt.io/post/396162</guid><dc:creator><![CDATA[p3c0]]></dc:creator><pubDate>Tue, 30 May 2017 05:07:18 GMT</pubDate></item></channel></rss>