You are going to screenshot all of your work into a Powerpoint file.

To download the PowerPoint by clicking on the image below

To save your powerpoint go to:

File explorer

-> Year 9 Common Area :S

-> You can save here

-> Computer Science

-> Term 3

-> Lesson 4

Save the Powerpoint file: as your name

---

Complete Task 1 in your Powerpoint

---

Images in pygame:

When we want to use an image in our computer game these are known as sprites.

Right click on the image below and save it in your Computer Science folder.

Save it as bird1.png

it must be in the same folder where your code is saved!

---

The process of painting the screen with image(s) is called bit blitting, or just 'blit' for short.

Activity 1

1. Add the code below under
   #our variables go here#

image_bird = pygame.image.load("bird1.png")

bird_position = [100, 100]

2. Then add these lines under # your code starts here# to display (blit) the image on the screen:

Make sure these lines are double-indented, otherwise they won't work.

screen.fill(black)

bird = screen.blit(image_bird, bird_position)

Your screen should look like this

---

---

Task 1

1. Right click on the image below and and save them in your Computer Science folder.

---




---

2. Now using the same method we did for our bird1.pngadd the images onto your pygame screen at different co-ordinates so it looks something like the image below

---

---

When you are finished screenshot your working code into your Learning Journal

When we look at our images we can see that our luigi sprite is way too big for the screen. So we need to resize him.

To do that we have to add some code to transform his size.

Activity 2

1. Add the following code into our variables area.

image_luigi = pygame.image.load("luigi.png")

image_luigi_sizeXY = [150, 100]

image_luigi = pygame.transform.scale(image_luigi, image_luigi_sizeXY)

luigi_position = [300, 100]

The red code is what you are adding if you completed the last task if not you should add it all.

2. If you already added luigi in your previous task then also check your code for your luigi sprite in the

   ## your code starts here# it should look like this.

luigi = screen.blit(image_luigi, luigi_position)

---

---

Task 2

1. Using the same method we did for our luigi.png, change the size of your other images on your pygame screen, so they all look the same size, like in the image below.

---

---

When you are finished screenshot your working code into your Learning Journal

We now have some static images. To make it a little more interactive, let's make one of our sprites(luigi) follow the mouse.

Activity 3

Add these two line underneath the line:

luigi = screen.blit(image_luigi, luigi_position):

Don't forget to double-indent!

---

mouse_position = pygame.mouse.get_pos()
luigi_position = mouse_position[0], mouse_position[1]

---

Your luigi should now follow the mouse cursor

---

Tidying it up

You may notice that our mouse is not centred on luigi. We are going to make some improvements

First let's try and centre the mouse on our image

As we now know the size of our image we can adjust our mouse position so that it is halfway across the height and width of our image.

Activity 4

Lets make two new variables for these two new positions

new_X_position = mouse_position[0] - (image_luigi_sizeXY[0] / 2)
new_Y_position = mouse_position[1] - (image_luigi_sizeXY[1] / 2)

Now lets use those to create a new luigi position with the mouse.

luigi_position = new_X_position, new_Y_position

This should centre our mouse on our luigi sprite

Finally we want to hide our mouse cursor, we do so by adding the following line of code

pygame.mouse.set_visible(False)

---

When you are finished screenshot your working code into your Learning Journal

Putting it all together

Lets see if we can take what we have learned and use it to create a target sprite that moves around the screen with the mouse.

Task 3

Complete the following:

1. Start a new file with a blank template
2. Save it as target.py
3. Right click on the image below and save it in your Computer Science folder.

4. Save it as crosshair.png
5. Change its size to 50 x 50
6. Make it follow the mouse at the centre of the mouse
7. Hide the mouse cursor

---

When you are finished screenshot your working code into your Learning Journal

---

Summing it all up

Lets look at the learning outcomes and decide which one best describes our current level of understanding :

Tick the one you feel is closest to your level