CODEWITHSUNDEEP
javascriptanimationqmlinfinite-scrollqtquick2
user3417815
user3417815

Reputation: 635

QtQuick2 - QML - create infinite moving line animation

Does anyone know how to implement linear animation, for example like in progress bars, where few of lines moving infinite in the bar from left to right or any other way? I'm going to use only QtQuick2 primitives and without any additional C++ components, glad to see any answers that can fit this requirements. Also, I know how to set infinite loop for animation, but actual question is to how moves row of rectangles/lines from letf to right in infinity loop, I just can't imagine approach for that.

Upvotes: 2

Views: 858

Answers (1)

folibis
folibis

Reputation: 12864

Something like that?

Rectangle {
    width: 400
    height: 30
    anchors.centerIn: parent
    border.color: "grey"
    border.width: 1
    clip: true

    Rectangle {
        id: runner
        property double percent: 0.2
        width: parent.width * percent
        height: parent.height
        color: "orange"
        NumberAnimation on x { from: runner.width * (-1); to: 400; duration: 2000; loops: Animation.Infinite }
    }
}

Upvotes: 4

Related Questions