How to use Scatter to move the paddle in the official Kivy Pong tutorial?
After completing the Pong Game Tutorial from Kivy's official site, I continued with their Crash Course . There, in the very first video , I saw this magic thing they call Scatter , which pretty much lets you get out of - to make the UI move with the mouse.
I thought this should provide a smoother way to control paddles in the Pong game. The original way was to put the moving logic in a method on_touch_move()
of the PongGame object (the PongGame class inherits from Widget), and it was simple:
if touch.x < self.width / 3: # if you clicked in 1/3 of the window to the left
player1.center_y = touch.y # level the first paddle center vertically with the mouse click position
This will trigger the jarring if you have to move the mouse cursor above or below the paddle. I thought Scatter would work better. Alas, so far I have not been able to get it to work.
What I started with was to comment out the method on_touch_move()
and then add the Scatter object as a child of the PongGame class in the file pong.kv
and create the existing PongPaddle children from the Scatter . Like this:
<PongGame>:
Scatter:
do_scale: False
do_rotation: False
do_translation_x: False
PongPaddle:
id: player_left
x: root.x
center_y: root.center_y
PongPaddle:
id: player_right
x: root.width - self.width
center_y: root.center_y
Since I was using a single Scatter object and both paddles should move independently, I assumed this would probably cause a problem (clicking one would make both move at the same time), but the thought would still be a good start.
Bad luck! This does not cause the paddle to move with the mouse cursor. They still bounce off the ball (although they move down in the widget tree and I haven't changed the Python code other than the method comment on_touch_move()
in the PongGame class - I think the references to ObjectProperty instances to connect the paddle in the file pong.kv
still work), but they will not move.
All executable code (my scattered version)
All executable code (my version without scatter)
Any ideas how to get it to work?
source to share
So the problem is that the paddle is moving to a new location and the method is responsible for that on_touch_move
. In your executable code without scattering, I changed lines 84-88 to:
def on_touch_move(self, touch):
if touch.x < self.width / 3:
self.player1.center_y += touch.dy
if touch.x > self.width - self.width / 3:
self.player2.center_y += touch.dy
Basically, touch contains delta values for y
(how much the y value has changed), so you can just move the paddle as much as you moved the mouse, rather than moving the center of the paddle on the mouse y
. This makes the game very smooth and enjoyable. I really wonder why they didn't do it like this in the first place.
There is one problem: the paddles can now exit the game screen. This can be easily remedied by checking if the center of the paddle is on the screen (use height PongGame
). I'll leave this as an exercise, but feel free to ask if you're stuck.
So, since you're curious, there is a way to do this with Scatter. So, first of all, Scatter is a widget that is dragged and resized and rotated, it is not a layout (it might be, but we only need paddles to move, not the whole screen). Thus, it Paddle
inherits from Scatter. Delete the on_touch
one we used to move the paddle.
You will now notice that there is a visual error when you do this. To some extent, the scattering is strange. Remove pos: self.pos
from Paddle
in .kv file. This post sums it up well:
... the specific behavior makes the scattering unique, and there are some advantages / limitations you should consider:
- Children are positioned relative to 0, 0. The position of the scatter does not affect the position of the children.
So the position of the canvas in Paddle is relative to the Paddle (scatter), not the screen.
Now take a moment to rate the game you received. The oars can be moved anywhere, and can also be rotated, etc. You can do this with your mouse, right-clicking to set the imaginary "touch" indicated by a red dot, and then make mobile gestures to resize and rotate. Have fun, you deserve it. We will fix these "mistakes" after your break.
Ok, so there are some Scatter features that you really don't need. Disable scaling, rotation and dragging by x in the .py PongPaddle
class file :
do_rotation = do_scale = do_translation_x = Property(False)
Not sure if I got it all, Scatter does a lot of things, some of which you don't need or need. Compared to the previous version, Scatter pong requires more precision. You will still need a code to check if the paddles are out of bounds. Overall, I liked the previous solution better.
Here you will find the complete code with Scatter.
source to share