63 PropertyAction { target: ball; property: "direction"; value: "left" } |
62 PropertyAction { target: ball; property: "direction"; value: "left" } |
64 NumberAnimation { to: 20; duration: 2000 } |
63 NumberAnimation { to: 20; duration: 2000 } |
65 PropertyAction { target: ball; property: "direction"; value: "right" } |
64 PropertyAction { target: ball; property: "direction"; value: "right" } |
66 } |
65 } |
67 |
66 |
68 // Make y follow the target y coordinate, with a velocity of 200 |
67 // Make y move with a velocity of 200 |
69 SpringFollow on y { to: ball.targetY; velocity: 200 } |
68 Behavior on y { SpringAnimation{ velocity: 200; } |
|
69 } |
|
70 |
|
71 Component.onCompleted: y = page.height-10; // start the ball motion |
70 |
72 |
71 // Detect the ball hitting the top or bottom of the view and bounce it |
73 // Detect the ball hitting the top or bottom of the view and bounce it |
72 onYChanged: { |
74 onYChanged: { |
73 if (y <= 0) { |
75 if (y <= 0) { |
74 targetY = page.height - 20; |
76 y = page.height - 20; |
75 } else if (y >= page.height - 20) { |
77 } else if (y >= page.height - 20) { |
76 targetY = 0; |
78 y = 0; |
77 } |
79 } |
78 } |
80 } |
79 } |
81 } |
80 |
82 |
81 // Place bats to the left and right of the view, following the y |
83 // Place bats to the left and right of the view, following the y |
82 // coordinates of the ball. |
84 // coordinates of the ball. |
83 Rectangle { |
85 Rectangle { |
84 id: leftBat |
86 id: leftBat |
85 color: "Lime" |
87 color: "Lime" |
86 x: 2; width: 20; height: 90 |
88 x: 2; width: 20; height: 90 |
87 SpringFollow on y { |
89 y: ball.direction == 'left' ? ball.y - 45 : page.height/2 -45; |
88 to: ball.y - 45; velocity: 300 |
90 Behavior on y { SpringAnimation{ spring: 1; damping: .1; } } |
89 enabled: ball.direction == 'left' |
|
90 } |
|
91 } |
91 } |
92 Rectangle { |
92 Rectangle { |
93 id: rightBat |
93 id: rightBat |
94 color: "Lime" |
94 color: "Lime" |
95 x: page.width - 22; width: 20; height: 90 |
95 x: page.width - 22; width: 20; height: 90 |
96 SpringFollow on y { |
96 y: ball.direction == 'right' ? ball.y - 45 : page.height/2 -45; |
97 to: ball.y-45; velocity: 300 |
97 Behavior on y { SpringAnimation{ spring: 1; damping: .1; } } |
98 enabled: ball.direction == 'right' |
|
99 } |
|
100 } |
98 } |
101 |
99 |
102 // The rest, to make it look realistic, if neither ever scores... |
100 // The rest, to make it look realistic, if neither ever scores... |
103 Rectangle { color: "Lime"; x: page.width/2-80; y: 0; width: 40; height: 60 } |
101 Rectangle { color: "Lime"; x: page.width/2-80; y: 0; width: 40; height: 60 } |
104 Rectangle { color: "Black"; x: page.width/2-70; y: 10; width: 20; height: 40 } |
102 Rectangle { color: "Black"; x: page.width/2-70; y: 10; width: 20; height: 40 } |