Strange reaction of an Animation

[tomy]

Hi all,

Please run this code on your system. I don't know why when I use this ParallelAnimation the ball doesn't reflect when it hits the walls!

main.qml:

import QtQuick 2.9
import QtQuick.Window 2.2

Window {
    visible: true
    width: 720
    height: 620

    Rectangle {
        id: table
        anchors.fill: parent
        color: "gray"

        Rectangle {
            id: ball
            property double xincrement: Math.random() + 0.5 
            property double yincrement: Math.random() + 0.5
            width: 15
            height: width
            radius: width / 2
            color: "white"
            x: 300; y: 300
        }

        Racket {
            id: myRacket
            x: table.width - 50
            y: table.height/3
            color: "blue"
        }

        ParallelAnimation {
            id: anim
            NumberAnimation {
                target: ball
                properties: "x"
                to: timer.xMove
            }
            NumberAnimation {
                target: ball
                properties: "y"
                to: timer.yMove
            }
        }

        Timer {
            id: timer
            interval: 20; repeat: true; running: true
            property double xMove: ball.x 
            property double yMove: ball.y 

            onTriggered: {
                if(ball.x + ball.width >= table.width || ball.x <= 0)
                    ball.xincrement *= -1

                xMove += ball.xincrement * 2.0
                yMove += ball.yincrement * 2.0
                anim.restart()

                if(ball.y <= 0 || ball.y + ball.height >= table.height)
                    ball.yincrement *= -1
            }
        }
    }
}

Racket.qml:

import QtQuick 2.9

Rectangle {
    id: root
    width: 15; height: 65

    MouseArea {
        anchors.fill: root
        anchors.margins: -root.height
        drag.target: root
        drag.axis: Drag.YAxis
        drag.minimumY: 0
        drag.maximumY: 600
    }
}