00:01
Good day, ladies and gentlemen.
00:04
Today we are doing problem number 9 .1, and it is to design a tkinter app, which is called move the ball.
00:18
This app should do the following things.
00:21
It should create a panel with a ball that a user may move.
00:26
We'll have four buttons right, left, right, up and down.
00:31
And the ball.
00:32
Moves in the direction directed or the direction point.
00:37
So furthermore, i should add that the ball should be designed to, ball should be designed to stay in screen or on the canvases.
00:57
Okay, so if it hits the boundary, you want it to come back in some fashion or another.
01:04
Okay, so again, this is something that it's quite an involved program.
01:11
So i've already written the program, and we're just going to jump to it, and i'll walk you through what's going on, and then we'll see it in action.
01:20
Okay, so here we go.
01:24
So here's the code.
01:27
Again, the first thing we have to do is we have to import to kinter, because, of course, the kinter is our, the kinter is the module we'll be using here to make the whole thing run.
01:45
It's going to create our gui.
01:48
And now what i've done is i create this class ball, okay? and as is normal with a class, the very first line here involves the initialization line.
02:02
And it is, of course, it includes self and the coordinates x equals 20 and y equals 20 so what i do is i initialize the ball at a certain position so what's going to happen is when i call you know when i call this um class or when i create an instance of this the initial value the initial position will be 20 um and then when you're doing this the first thing you want to do is create a window.
02:38
So to do that with ticinter, you say, window equals tk.
02:45
And that, like i says, create a window.
02:47
And then i give it a title called ballgame.
02:51
Now, the canvas method, what the canvas does is it creates a something to work on or a screen.
03:04
As you were, to actually place the ball.
03:10
So if we actually, i can actually do something like this.
03:14
I can do a file.
03:17
I'm going to just call it, save as.
03:22
Just call this as, yeah, we'll call this as all.
03:30
Ok.
03:32
And now what i'll do here is i'll actually, just copy this.
03:41
And so i just create, okay.
03:47
Now i call into kinter.
03:50
And then what i want to do is i just want to go, oops, i go window equals tk.
04:05
And then i'm going to do, i'm going to do canvas.
04:13
Equals to canvas window and width to 200 and height to equal to 200 and of course the background here will say is white what you have to do is whenever you define a a widget as it were and this canvas is a widget so i have to pack it so i have to go uh canvas pack, okay, and then because i want the, i want the main loop, oops.
05:07
Now when i run this guy here, what's going to happen is, is it just gives me the tequinter, you know, the tecinter window here.
05:22
So now i just have this tecinter window that's just a bland window, if you will, and it has nothing on it.
05:30
If i want to put something on it, say i want to put this ball on there.
05:35
So maybe i go ball equals to and this.
05:44
I've got, whoops, create.
05:49
And i'm going to create a oval here.
05:55
And we'll put it at, we'll put it at, say, 25, 25.
06:03
And maybe.
06:05
So this is the, this is the x and y coordinates of the, that's the left -hand side and then i give it the the left -hand side of it and then i give the x -y coordinates of the lower i guess that's the lower right -hand side of it so we'll make it maybe 35 and 35 and i'm going to give it fill equals to again i'm going to get it red.
06:43
Right.
06:45
Okay.
06:46
And so now when i do this, what it does is it should at least, if i've done this correctly.
06:55
Yeah.
06:56
Now i have the ball on the, now i have the ball on the, on the canvas.
07:05
Remember that the canvas itself is a widget sitting on top of the window.
07:13
Itself.
07:14
Okay.
07:15
So that's what's going on here.
07:17
That's what i'm doing up here.
07:19
And i'm doing this all within a class, of course, because i'm going to be moving this around and everything.
07:27
Now, so the top here, it's just putting the top lines here, just putting the ball in there.
07:36
Now, what i'm doing down here in the second part is i'm creating this new frame.
07:41
So if, you know, i'm creating another frame to put these buttons on it.
07:50
So if i go over here to my thing here, oops, sorry about that, i want to do this.
07:59
So what i can do here is i can create a new frame, so i can go frame equals to frame.
08:08
And now whenever you write, whenever you're designing a new widget, you need to put it on the first, i guess the first, the first option for the every widget is always the, its window that it's supposed to be on.
08:32
So that's the first thing you always give it.
08:36
And now what i'm going to do is i'm going to actually do a button here.
08:41
And i'm going to call, so it's going to be button, and i'm going to say, yeah, you have to define its master, i guess.
08:51
Frame, and the text i'm going to say is left, and let me see, and i'm not going to have it do anything, but then i'm going to do button.
09:12
Dot grid or maybe we'll do button pack here or grid yeah grid we'll say row equals to two column equals to one okay so notice here that i'm using a different i'm using a difference what's i called a different geometry or a geometry manager here.
09:46
So in the first one, the geometry manager i used was pack.
09:51
So that's one geometry manager.
09:55
In the second one here, i use this grid, which is a second geometry manager.
10:01
And if you want to use different geometry managers, you have to use them in different frames.
10:07
You can't use the same or different geometry managers in the same frame.
10:13
But now when i do this what i get is my little uh thing here or my little um my little app if you will um uh oh something didn't work uh oh uh i think i know what didn't work right i forgot to go uh frame dot pack sorry about that folks didn't mean to uh i have to pack it onto the i have to put it on there before i can get it to work.
10:51
So now if we do it right, let's hope, yeah...