1 00:00:00,270 --> 00:00:04,830 So now that we've created the screen we're ready to go ahead and create and move a 2 00:00:04,830 --> 00:00:06,180 puddle. So 3 00:00:06,180 --> 00:00:09,180 the paddle that we're going to create is going to be on the right side. 4 00:00:09,480 --> 00:00:11,250 It's going to have a width of 20, 5 00:00:11,310 --> 00:00:16,309 a height of 100 and be positioned at 350 pixels on the X-axis and then 0 on 6 00:00:19,380 --> 00:00:23,280 the Y-axis. So this is the sort of positioning we're looking for. 7 00:00:24,000 --> 00:00:25,080 And additionally, 8 00:00:25,110 --> 00:00:29,520 we should be able to hit the up and down keys on a keyboard to move the paddle. 9 00:00:30,030 --> 00:00:34,080 Each key press should move the paddle up or down by 20 pixels. 10 00:00:34,740 --> 00:00:38,850 Have a think about how you might create the code for this and pause the video 11 00:00:38,940 --> 00:00:40,290 and complete the challenge. 12 00:00:44,190 --> 00:00:48,540 All right. So to create this paddle, it's going to be created as a turtle. 13 00:00:48,780 --> 00:00:53,780 So let's go ahead and create our paddle from the turtle class and I'm going to 14 00:00:54,600 --> 00:00:57,690 set the paddles shape to a square. 15 00:00:59,580 --> 00:01:04,530 In order to stretch it so that it's 20 by 100 pixels, 16 00:01:04,920 --> 00:01:09,920 remember that all turtles start off as 20 by 20 17 00:01:10,320 --> 00:01:12,540 so that means in the width 18 00:01:12,570 --> 00:01:17,570 we have to stretch it by five, and in the length, we leave it as it is in order to 19 00:01:18,450 --> 00:01:21,120 make it 100 by 20. 20 00:01:21,870 --> 00:01:24,840 So let's go ahead and hid up paddle.shapesize 21 00:01:25,290 --> 00:01:30,030 which is what we've been using so far. And then in terms of the stretch width, 22 00:01:30,090 --> 00:01:35,040 we're going to make that five. And then the stretch length is going to be one. 23 00:01:35,730 --> 00:01:40,320 Now we have to make sure that our paddle has a color of white 24 00:01:40,380 --> 00:01:45,380 so that it's actually visible when we run our code. And you can see there it is, 25 00:01:46,950 --> 00:01:49,650 there's our paddle. And as always, 26 00:01:49,740 --> 00:01:53,370 it gets initialized in the center at the coordinate (0, 0). 27 00:01:53,910 --> 00:01:57,030 So in order to move it to the position we want to, 28 00:01:57,300 --> 00:02:00,330 we have to get it to go ahead and pen up, 29 00:02:00,750 --> 00:02:05,750 and then we can tell it to go to the position that is 350 by 0, 30 00:02:07,530 --> 00:02:12,450 so 350 on the X-axis and 0 on the Y-axis, like that. 31 00:02:13,350 --> 00:02:16,320 Now, the next thing we need to do is figure out how to get it 32 00:02:16,320 --> 00:02:17,640 to move up and down. 33 00:02:18,150 --> 00:02:23,150 So, of course, we need some sort of way of getting our screen to listen for 34 00:02:23,970 --> 00:02:27,150 keystrokes. We're gonna call screen.listen 35 00:02:27,270 --> 00:02:31,290 and then we're going to call onkey in order to listen for the "Up" key. 36 00:02:31,830 --> 00:02:36,480 And then when that happens, we're going to get the paddle to go up. Now, 37 00:02:36,510 --> 00:02:40,770 remember as always, when you were using a function as a parameter, 38 00:02:41,100 --> 00:02:45,960 you don't want to add the parentheses. If you do, it won't work. 39 00:02:46,500 --> 00:02:49,380 Now let's create our go_up function. 40 00:02:50,010 --> 00:02:55,010 And this function is going to take our paddle and move it so that it goes to a 41 00:02:59,470 --> 00:03:04,150 new position. The new exposition is X not going to change. 42 00:03:04,210 --> 00:03:07,120 The only one that's going to change is the Y position. 43 00:03:07,750 --> 00:03:11,710 So the Y position is going to be the paddles current ycor, 44 00:03:12,280 --> 00:03:15,250 but it's going to go up, so it's going to need to 45 00:03:15,280 --> 00:03:18,190 plus let's say by 20. 46 00:03:18,940 --> 00:03:23,940 Now we can tell the paddle to go to its current paddle.xcor. 47 00:03:24,970 --> 00:03:29,290 So we're not changing that. And then to go to the new Y position. 48 00:03:29,980 --> 00:03:34,980 Now, this go_up function is going to be called whenever the Up key is detected. 49 00:03:35,740 --> 00:03:40,450 And if we copy this and we make a similar version of this function, 50 00:03:40,660 --> 00:03:45,550 which is called go_down and we can subtract 20 instead. 51 00:03:46,120 --> 00:03:50,320 So now we can copy this line and make it call 52 00:03:50,350 --> 00:03:54,160 go_down when the down arrow key is detected. 53 00:03:54,820 --> 00:03:59,020 So now we've created our paddle and when I hit up, it goes up, when I hit down 54 00:03:59,050 --> 00:04:03,070 it goes down. And this completes the first part of the challenge. 55 00:04:03,430 --> 00:04:06,430 But here's a question. When I hit run, 56 00:04:06,520 --> 00:04:09,850 you can see that the paddle first gets created in the center, 57 00:04:10,240 --> 00:04:13,720 and then it moves to the location where it needs to go to, 58 00:04:14,200 --> 00:04:18,399 which is 350 on the X-axis, 0 on the Y-axis. 59 00:04:18,940 --> 00:04:22,330 How can we get rid of this animation so that we don't have to look at the 60 00:04:22,330 --> 00:04:24,430 paddle move to the position? 61 00:04:24,850 --> 00:04:28,510 Have a think about what you've learned in previous lessons and see if you can 62 00:04:28,510 --> 00:04:32,950 solve this problem. All right. 63 00:04:32,980 --> 00:04:37,980 So you might remember from previous lessons that there is a tracer method on the 64 00:04:38,560 --> 00:04:41,380 screen which controls the animation. 65 00:04:41,920 --> 00:04:46,540 And in order to turn off the animation, we can put a zero in that method. 66 00:04:47,080 --> 00:04:49,450 But when we run our code, as it is right now, 67 00:04:49,480 --> 00:04:52,060 you'll see that there's no animation. 68 00:04:52,090 --> 00:04:54,880 There's not even a paddle of showing up anymore. 69 00:04:55,630 --> 00:04:58,180 Remember that when you turn off the animation, 70 00:04:58,390 --> 00:05:03,390 you have to manually update the screen and refresh it every single time. To do 71 00:05:04,120 --> 00:05:06,490 that, we'll need some sort of a while loop. 72 00:05:07,000 --> 00:05:10,750 And the while loop is going to check for some sort of variable. 73 00:05:11,140 --> 00:05:15,250 So let's create a variable called game_is_on and set it to true 74 00:05:15,820 --> 00:05:17,890 and while the game is on, 75 00:05:18,160 --> 00:05:22,660 then we're going to call screen.update. Now, 76 00:05:22,690 --> 00:05:25,690 if I run the code again, you'll see that my paddle 77 00:05:25,720 --> 00:05:30,700 now goes directly from the center to the position because the first thing 78 00:05:30,700 --> 00:05:33,100 that happens is the animation gets turned off, 79 00:05:33,460 --> 00:05:36,130 the paddle then gets created in the background 80 00:05:36,400 --> 00:05:41,080 and then finally it gets to this point where we actually update the screen and 81 00:05:41,080 --> 00:05:44,200 show everything that's happened in the background so far. 82 00:05:44,890 --> 00:05:49,120 Did you manage to complete this challenge and create the paddle and get it to 83 00:05:49,120 --> 00:05:51,760 move up and down using the keystrokes? 84 00:05:52,270 --> 00:05:57,070 If not be sure to review some of these methods in the turtle documentation and 85 00:05:57,080 --> 00:06:01,160 have a play around with the code until you're fully happy with what's going on 86 00:06:01,160 --> 00:06:03,130 so far. Now, 87 00:06:03,160 --> 00:06:07,840 if you had created the paddle in a separate file as a separate class, 88 00:06:08,170 --> 00:06:10,210 don't worry. We're going to do that next. 89 00:06:10,390 --> 00:06:14,590 We're going to refactor this code so that it's fully compliant with Object 90 00:06:14,590 --> 00:06:16,990 Oriented Programming. But if you've already done it, 91 00:06:16,990 --> 00:06:18,340 then you're just one step ahead. 92 00:06:18,700 --> 00:06:20,980 And that is where we're heading to in the next lesson.