Snakes Pygame: Difference between revisions

From OpenHatch wiki
Content added Content deleted
imported>Jesstess
(Created page with "right|300px == Project == Implement parts of a Snakes clone using the Pygame graphical game development library. == Goals == * practice using the Pygame ...")
 
 
(19 intermediate revisions by 2 users not shown)
Line 1: Line 1:
[[File:grid.png|right|300px]]
[[File:snakes.png|right|300px]]


== Project ==
== Project ==
Line 7: Line 7:
== Goals ==
== Goals ==


* practice using the Pygame library
* learn about using graphics and sounds to create interactive games using the Pygame library
* practice using an event loop to make action happen
* practice reading and understanding someone else's code


== Project setup ==
== Project setup ==
Line 14: Line 14:
=== 1. Install the project dependencies ===
=== 1. Install the project dependencies ===


Installing Pygame from http://www.pygame.org/download.shtml
Install Pygame. On Linux, you can use your package manager to install the <code>python-pygame</code> package. On Windows and OSX, you can download the appropriate binary from http://www.pygame.org/download.shtml.


=== 2. Download and un-archive the Snakes project skeleton code ===
=== 2. Download and un-archive the Snakes project skeleton code ===
Line 24: Line 24:
=== 3. Test your setup ===
=== 3. Test your setup ===


Run the <code>snakes.py</code> script in your <code>Snakes</code> directory. A window with a Snakes game should pop up.
Run the <code>snakes.py</code> script in your <code>Snakes</code> directory. A window with a Snakes game should pop up, including square bits of food, the snake you can control, and the enemy snake. Try using the Up and Down keys to move your snake.


== Project steps ==
== Project steps ==


=== 1. Familiarize yourself with <code>snakes.py</code> ===
=== 1. Familiarize yourself with codebase ===


* What is in <code>snakes.py</code>? What parts of the game is pygame responsible for?
=== 2. Give snakes the ability to move in all directions ===
* What is in <code>objects/snake.py</code>? What actions can a snake take?
* What is in <code>objects/food.py</code>? What determines where food shows up on the screen?


Run the game again. When the good snake runs into the bad snake, you die. Where is the code that checks for collisions between snakes? When a snake eats a piece of food, its tail grows. Where is the code that grows the snake?
=== 3. Set a key repeat speed ===


=== 4. Handle quit and restart key presses ===
=== 2. Give snakes the ability to move in all directions ===

<ol>
<li>
Run <code>python basic_plot.py</code>. This will pop up a window with a dot plot of some data.
</li>
<li>
Open <code>basic_plot.py</code>. Read through the code in this file. The meat of the file is in one line:

<pre>pyplot.plot([0, 2, 4, 8, 16, 32], "o")</pre>

In this example, the first argument to <code>pyplot.plot</code> is the list of y values, and the second argument describes how to plot the data. If two lists had been supplied, <code>pyplot.plot</code> would consider the first list to be the x values and the second list to be the y values.
</li>
<li>Change the plot to display lines between the data points by changing

<pre>pyplot.plot([0, 2, 4, 8, 16, 32], "o")</pre>

to

<pre>pyplot.plot([0, 2, 4, 8, 16, 32], "o-")</pre>
</li>
<li>
Add x-values to the data by changing

<pre>pyplot.plot([0, 2, 4, 8, 16, 32], "o-")</pre>

to

<pre>x_values = [0, 4, 7, 20, 22, 25]
y_values = [0, 2, 4, 8, 16, 32]
pyplot.plot(x_values, y_values, "o-")</pre>

Note how matplotlib automatically resizes the graph to fit all of the points in the figure for you.
</li>
<li>
Read about how to generate random integers on http://docs.python.org/library/random.html#random.randint.

Then, instead of hard-coding y values in <code>basic_plot.py</code>, generate a list of random y values and plot them.

An example plot using random y values might look like this:
<br />
[[File:Basic_plot.png|300px]]
</li>
</ol>

<b>Read these short documents</b>:
* Pyplot tutorial (just this one section; stop before the next section "Controlling line properties"): http://matplotlib.sourceforge.net/users/pyplot_tutorial.html#pyplot-tutorial
* List of line options, including line style and marker shapes and colors: http://matplotlib.sourceforge.net/api/pyplot_api.html#matplotlib.pyplot.plot


So far, the snake can only move up or down. Fix this by completing the "Handle the remaining movement keys" TODO in the <code>move</code> method of the <code>Snake</code> class. Test your changes by re-running the game and moving your snake left and right.
<b>Check your understanding</b>:
* What does matplotlib pick as the x values if you don't supply them yourself?
* What options would you pass to <code>pyplot.plot</code> to generate a plot with red triangles and dotted lines?


=== 3. Give the game a better background ===


The game has a pretty boring solid color background. Spice it up by adding a background image. We've provided a sample background image called <code>leaves.jpg</code> in the Snakes directory, but create and add your own if you want!
=== 2. Plotting the world population over time ===


Use [http://www.pygame.org/docs/ref/image.html#pygame.image.load pygame.image.load] to load the background. You'll need to re-display the background on every tick of the game, just like we currently do with the solid color using <code>game_surface.fill(BACKGROUND_COLOR)</code>.
<ol>
<li>
Run <code>python world_population.py</code>. This will pop up a window with a dot plot of the world population over the last 10,000 years.
</li>
<li>
Open <code>world_population.py</code>. Read through the code in this file.


Test your changes by re-running the game and observing that your custom background is used.
In this example, we read our data from a file. Open the data file <code>world_population.txt</code> and examine the format of the file.
</li>
<li>
Find the documentation on http://matplotlib.sourceforge.net/api/pyplot_api.html#matplotlib.pyplot.plot for customizing the linewidth of plots. Then change the world population plot to use a magenta, down-triangle marker and a linewidth of 2.
</li>
</ol>


=== 4. Set a key repeat speed ===
<b>World population resources</b>:
<ul>
<li>
File input and output: http://docs.python.org/tutorial/inputoutput.html#reading-and-writing-files.
</li>
<li>
Splitting sprints into parts based on a delimiter: http://www.hacksparrow.com/python-split-string-method-and-examples.html
</li>
</ul>


So far, you have to press an arrow key for each movement of the snake. Wouldn't it be convenient to be able to just hold down an arrow key to keep moving our snake?
<b>Check your understanding</b>:
* In <code>world_population.py</code>, what does <code>file("world_population.txt", "r").readlines()</code> return?
* In <code>world_population.py</code>, what does <code>point.split()</code> return?


Fix this by completing the "Set the key repeat speed" TODO in the <code>initialize_screen</code> function in <code>snake.py</code>. See http://www.pygame.org/docs/ref/key.html#pygame.key.set_repeat for details on the Pygame function that controls this behavior.


Test your changes by re-running the game and holding down the arrow key while moving your snake around.
=== 3. Plotting life expectancy over time ===


=== 5. Make the food look more interesting ===
In a new file, write code to plot the data in <code>life_expectancies_usa.txt</code>. The format in this file is <year>,<male life expectancy>,<female life expectancy>.


Snake food is just a solid-colored square. Spice it up by using an image instead. We've provided a sample food image called <code>cherry.png</code> in the Snakes directory, but create and add your own if you want!
You can call <code>pyplot.plot</code> multiple times to draw multiple lines on the same figure. For example:


Currently, in the <code>Food</code> class <code>self.surface</code> is filled with a random color. Use [http://www.pygame.org/docs/ref/image.html#pygame.image.load pygame.image.load] to load and use the food image instead.
<pre>pyplot.plot(my_data_1, "mo-", label="my data 1")
pyplot.plot(my_data_2, "bo-", label="my data 2")</pre>


Test your changes by re-running the game and observing that your custom food image is used.
will plot <code>my_data_1</code> in magenta and <code>my_data_2</code> in blue on the same figure.


=== 6. Handle quit and restart key presses ===
Supply labels for your plots, like above. Then use <code>pyplot.legend</code> to give your graph a legend. Just plain <code>pyplot.legend()</code> will work, but providing more options may give a better effect.


I want to keep playing! So far, there's no way to quit (besides closing the window) or restart the game.
Your graph should look something like this:


Fix this by completing the "3 key presses" TODO in the <code>restart</code> function in <code>snakes.py</code>.
[[File:Life_expectancies.png|300px]]


Test your changes by re-running the game, running into the bad snake to end the game, and making sure you can restart.
To save your graph to a file instead of or in addition to displaying it, call <code>pyplot.savefig</code>.


<b>Life expectancy resources</b>:
<ul>
<li>
File input and output: http://docs.python.org/tutorial/inputoutput.html#reading-and-writing-files.
</li>
<li>
Splitting sprints into parts based on a delimiter: http://www.hacksparrow.com/python-split-string-method-and-examples.html
</li>
<li>
Examples of legends: http://matplotlib.sourceforge.net/examples/pylab_examples/legend_auto.html
</li>
<li>
Ways to configure your legend: http://matplotlib.sourceforge.net/api/legend_api.html
</li>
<li>
Saving your graph to a file: http://matplotlib.sourceforge.net/api/pyplot_api.html#matplotlib.pyplot.savefig
</li>
</ul>


==Bonus exercises==
==Bonus exercises==


=== 1. Letter frequency analysis of the US Constitution ===
=== 1. Play a sound when you eat food ===


We've included <code>ding.ogg</code> as a sample sound, but find and add your own if you want!
# Run <code>python constitution.py</code>. It will generate a bar chart showing the frequency of each letter in the alphabet in the US Constitution.
# Open and read through <code>constitution.py</code>. The code for gathering and displaying the frequencies is a bit more complicated than the previous scripts in this projects, but try to trace the general strategy for plotting the data. Be sure to read the comments!
# Try to answer the following questions:
## On line 11, what is <code>string.ascii_lowercase</code>?
## On line 18, what is the purpose of <code>char = char.lower()</code>?
## What are the contents of <code>labels</code> after the <code>for</code> loop on line 30 completes?
## On line 41, what are the two arguments passed to <code>pyplot.xticks</code>
## On line 44, we use <code>pyplot.bar</code> instead of our usual <code>pyplot.plot</code>. What are the 3 arguments passed to <code>pyplot.bar</code>?
# We've included a mystery text file <code>mystery.txt</code>: an excerpt from an actual novel. Alter <code>constitution.py</code> to process the data in <code>mystery.txt</code> instead of <code>constitution.txt</code>, and re-run the script. What do you notice that is odd about this file? You can read more about this odd novel [http://en.wikipedia.org/wiki/Gadsby_(novel) here].


Test your changes by re-running the game with the sound on and observing that a noise is played when the snake eats pieces of food.


=== 2. Tour the matplotlib gallery ===
=== 2. Give yourself multiple lives ===


Typically in games you have multiple lives available. Give your snake 3 lives to start with, lose a life each time you run into yourself or the bad snake, and display how many lives remain in the upper left corner.
You can truly make any kind of graph with matplotlib. You can even create animated graphs. Check out some of the amazing possibilities, including their source code, at the matplotlib gallery: http://matplotlib.sourceforge.net/gallery.html.


You may find it convenient to create a new file with a new class called <code>Lives</code> that keeps track of this game state and the work of updating the display.
[[File:matplotlib_gallery.png|750px]]




===Congratulations!===
===Congratulations!===


You've read, modified, and created scripts that plot and analyze data using matplotlib. Keep practicing!
You've read, modified, and improved a game using Pygame that uses images and sound and game concepts like an event loop and managing keypresses. Keep practicing!


[[File:Fireworks.png|150px]]
[[File:Fireworks.png|150px]]

Latest revision as of 22:01, 1 July 2015

Project

Implement parts of a Snakes clone using the Pygame graphical game development library.

Goals

  • learn about using graphics and sounds to create interactive games using the Pygame library
  • practice reading and understanding someone else's code

Project setup

1. Install the project dependencies

Install Pygame. On Linux, you can use your package manager to install the python-pygame package. On Windows and OSX, you can download the appropriate binary from http://www.pygame.org/download.shtml.

2. Download and un-archive the Snakes project skeleton code

Un-archiving will produce a Snakes folder containing several Python files.

3. Test your setup

Run the snakes.py script in your Snakes directory. A window with a Snakes game should pop up, including square bits of food, the snake you can control, and the enemy snake. Try using the Up and Down keys to move your snake.

Project steps

1. Familiarize yourself with codebase

  • What is in snakes.py? What parts of the game is pygame responsible for?
  • What is in objects/snake.py? What actions can a snake take?
  • What is in objects/food.py? What determines where food shows up on the screen?

Run the game again. When the good snake runs into the bad snake, you die. Where is the code that checks for collisions between snakes? When a snake eats a piece of food, its tail grows. Where is the code that grows the snake?

2. Give snakes the ability to move in all directions

So far, the snake can only move up or down. Fix this by completing the "Handle the remaining movement keys" TODO in the move method of the Snake class. Test your changes by re-running the game and moving your snake left and right.

3. Give the game a better background

The game has a pretty boring solid color background. Spice it up by adding a background image. We've provided a sample background image called leaves.jpg in the Snakes directory, but create and add your own if you want!

Use pygame.image.load to load the background. You'll need to re-display the background on every tick of the game, just like we currently do with the solid color using game_surface.fill(BACKGROUND_COLOR).

Test your changes by re-running the game and observing that your custom background is used.

4. Set a key repeat speed

So far, you have to press an arrow key for each movement of the snake. Wouldn't it be convenient to be able to just hold down an arrow key to keep moving our snake?

Fix this by completing the "Set the key repeat speed" TODO in the initialize_screen function in snake.py. See http://www.pygame.org/docs/ref/key.html#pygame.key.set_repeat for details on the Pygame function that controls this behavior.

Test your changes by re-running the game and holding down the arrow key while moving your snake around.

5. Make the food look more interesting

Snake food is just a solid-colored square. Spice it up by using an image instead. We've provided a sample food image called cherry.png in the Snakes directory, but create and add your own if you want!

Currently, in the Food class self.surface is filled with a random color. Use pygame.image.load to load and use the food image instead.

Test your changes by re-running the game and observing that your custom food image is used.

6. Handle quit and restart key presses

I want to keep playing! So far, there's no way to quit (besides closing the window) or restart the game.

Fix this by completing the "3 key presses" TODO in the restart function in snakes.py.

Test your changes by re-running the game, running into the bad snake to end the game, and making sure you can restart.


Bonus exercises

1. Play a sound when you eat food

We've included ding.ogg as a sample sound, but find and add your own if you want!

Test your changes by re-running the game with the sound on and observing that a noise is played when the snake eats pieces of food.

2. Give yourself multiple lives

Typically in games you have multiple lives available. Give your snake 3 lives to start with, lose a life each time you run into yourself or the bad snake, and display how many lives remain in the upper left corner.

You may find it convenient to create a new file with a new class called Lives that keeps track of this game state and the work of updating the display.


Congratulations!

You've read, modified, and improved a game using Pygame that uses images and sound and game concepts like an event loop and managing keypresses. Keep practicing!