Sunday, March 31, 2013

Lesson 5 - Going Mobile - Python on Android

Part one covers Python code modification.  Part two covers Android phone settings and configuration of Pygame Subset for Android.

Part 1

Technical points of part 1:
  • import android library and handle exceptions
  • map keyboard ESC key to Android back key (hard button) on phone
  • quit game if phone back key is pressed

Part 2

Technical points of part 2:
  • Set Android phone to debug mode
  • Configure game build with pgs4a
  • Build, package, install
  • Test game

Saturday, March 30, 2013

Lesson #4: Mouse and Touchscreen Control (taught by middle school student)

Middle school student, age 13, teaches you how to get mouse control working on the moving square.
  • Goes through event queue to check for the mouse button. event.type == MOUSEBUTTONDOWN:
  • Checks for point collision with a rectangle: collidepoint(mouse_pos)

Monday, March 18, 2013

Lesson #3 - The Moving Square

Lesson number three teaches movement in the Y axis.

The main concepts:
  • Add 1 to the y axis to move down;
  • Subtract 1 to the y axis to move up;
  • Bounds checking to detect when the square reaches the edge of the screen;
  • Conditional to change direction;
  • Clock to set the maximum Frames Per Second (FPS) that the game runs at

Lesson #2 - The Stationary Square

This lesson focuses on drawing a stationary red square.  

Main concepts:
  • Colors are set by a three number tuple (red, green, blue).  Each value ranges from 0 to 255
  • Each point on the phone screen has two numbers associated with it, the x and the y coordinate.  A single point is a pixel.  The phone screen is 480 pixels wide and 320 pixels high.
  • The rectangle is initially set by the upper left corner.  The example uses (0, 0).
  • The width and height of the rectangle are measured in pixels, 64 pixels wide and 64 pixels tall.

Bonus concepts:
  • Graphics such as a cartoon girl are loaded with image.load("filename");
  • The graphic is displayed on the phone screen with blit;
  • The position of the graphic on the screen is established with a rectangle.

Lesson #1 - The Blank Screen

This is the first lesson in the Python and Pygame series.   It teaches the blank screen.   It is the basic foundation of all games.  This requires Python, Pygame, and a text editor.

This lesson was designed for middle school students.

Main concepts:

  1. Load and initialize the Pygame library;
  2. Set the size of the main screen;
  3. Create an infinite loop that runs the game until the player quits the game;
  4. Process the event queue;
  5. Handle the QUIT event;
  6. Update the screen.


Saturday, March 16, 2013

Teen to Teen: 2d Scroller Mobile Game Tutorial - Pavement

My teenage son produced a video to teach other teenagers to program.  This tutorial focuses on a moving pavement scene that scrolls from the right side of the screen to the left.  The complete code to the video is shown below.

Other videos that I made cover topics such as character animation to go with the moving pavement.

Posts on installing Pygame:

Sunday, March 10, 2013

2D Tile Game Map - Building the JSON Map File

I created a video of a very simple 2D tilemap game running on the desktop and an Android phone.  The video focuses on creating a json map file.  The video will take you through step four of the process listed below:

  1. Assemble tilesets which are pictures of grass, trees, water, rocks, bushes, houses and other graphics in the game;
  2. Assemble other sprites for graphics such as the character running around the screen;
  3. Create map data file using the Tiled map editor;
  4. Export the file to JSON format;
  5. Create a map loader in python;
  6. Use pygame to display graphics and handle player interaction;
  7. Use Pygame Subset for Android to package the Python application in Android Package format
I didn't cover how to write the map loader in this video since that video may take a long time.  The loader itself is less than a 100 lines of code.  The data structures are a bit more complex since Python loads the json file into the Python program as a nested dictionary structure.

Update Dec 2013:  Check out the code for an improved json_loader on github.

Sample game running with 2d map showing collision tiles shaded red.  Code and graphic files available on github

2nd layer of collision tiles separated out of the 3 layer map by test scripts in the game example.  Sample map included in the github package, available at the link above. 
Update December 13, 2013
Wrote a new blog post on using json_loader with examples of different types of games.

Sunday, March 3, 2013

Pygame Animation Tutorial Video

Here's a short howto video that starts off with a completely blank screen and takes you to a working animation.

I suggest you watch the video is full screen mode to see the text properly.