Snake Game on the FRDM-KL25Z with Nokia 5110 Display

So I have a graphics driver for a Nokia display (see “Zero Cost 84×48 Graphical LCD for the Freedom Board“), I have a joystick shield (see “JoyStick Shield with the FRDM Board“) and I do have a Freescale Freedom board: why not creating a simple game for it? Snake!

Snake Game with FRDM-KL25Z Board

Snake Game with FRDM-KL25Z Board

My first mobile phone was a Nokia with a 84×48 black/white display, and I loved it for many reasons, including having the ‘Snake’ game (see http://en.wikipedia.org/wiki/Snake_%28video_game%29). An ARM Cortex M0+ is way overpowered for that simple game, still it is fun to make and game it :-).

The game is very simple: A snake is running around, and I can control it with the cursor/joystick with up, down, left and right. The snake has to ‘eat’ the ‘food’, and the snake gets longer the more food is eaten. But the snake shall *not* touch the outside border.

💡 Usually there is another rule that the snake shall not touch itself. But I was too lazy to make it.

Snake with Food

Snake with Food

For the project I ordered a black joystick shield for $11.27, as the soldering quality of the previous ‘white’ one was very bad. The Nokia 5110 LCD I ordered from DX.com for $3.87 so it would directly match with the joystick shield. So makes $30 in total including the FRDM-KL25Z board.

Startup Screen for Snake Game

Startup Screen for Snake Game

Ready to Play Snake Game

Ready to Play Snake Game

The video shows the game in action:

The Snake game runs as a FreeRTOS task. The drawing and graphics including fonts are implemented with Processor Expert components:

Graphical Display Driver

Graphical Display Driver

Font and Font Driver

Font and Font Driver

Summary

So I have another nice usage for my boards and the joystick shields :-). I need to admit that I’m not very good at the game. My daughter reached level 4 in the first attempt, while my max level is 2, maybe it is just the age ;-). But I’m too honest *not* to build in a cheat mode, or should I? Maybe 😉

As always, the sources are available on GitHub.

Happy Snaking 🙂

Advertisements

28 thoughts on “Snake Game on the FRDM-KL25Z with Nokia 5110 Display

  1. Good job Erich.

    And, yeah… put in a back door cheat option. Tell your daughter if she finds it you’ll buy her ice cream.

    Like

  2. Nice!! You gotta love those. I ordered the joystick shield, and meanwhile been playing with some cheap Nokia LCDs, one onochrome and one Color, Posted on my blog. I just have to make my LCD breakout compatilbe with the shield, then try some games. Thank you for sharing.

    Like

  3. Erich

    I used GDisp1 in conjunction with PDC8544 component. I am getting errors GDisp1.c:136: undefined reference to `GDisp1_GetWidth’ .All references to header files were generated by processor expert. Just wonder whether there is an issue with the codewarrior version. I am using codewarrior 10.4? Can you please advise how rectify this error?

    Like

  4. Thank you Erich

    That sorted my error.

    I compiled successfully program. Display works in the text mode. But it stays blank in the graphic mode. I used couple of methods for drawing different figures. I set the color parameter to 7 (black) as I am using nokia 5510 monochrome display. For example

    GDisp1_DrawBox(10,10,30,15,5,7); /*Draw box*/

    Any idea why this method doesn’t work?
    Thank you

    Kamil

    Like

  5. Hello Erich!
    I can write words on the screen using the PDC8544 component, but having problems to print a monochromatic bitmap on the 5110 LCD. I’m using the GDisp1_DrawMonoBitmap method, but i don´t know how to load the *.bmp image on the code. How can I do that?

    Like

      • I have the bitmap hex values. But would you explain me how to insert the image pointer. The method ask me for an image pointer…

        Like

      • Hi Dave,
        here is an example of such a bitmap:

        #define ImageWait_IMAGE_WIDTH 0x38U /* Image width in pixels */
        #define ImageWait_IMAGE_HEIGHT 0x18U /* Image height in pixels */
        #define ImageWait_IMAGE_SIZE 0xA8U /* Image size in bytes */
        #define ImageWait_IMAGE_FILE_NAME "waitImage_small.bmp" /* Image file name */

        extern const byte ImageWait_Pixmap[0xA8]; /* Image pixel bitmap */

        PIMAGE ImageWait_GetImage(void);

        static TIMAGE Image;
        static const char_t FileName[] = "waitImage_small.bmp";
        const byte ImageWait_Pixmap[0xA8] = {
        0x00U,0x03U,0xE2U,0x00U,0x00U,0x00U,0x00U,0x7FU,0xE2U,0x12U,0x00U,0x00U,0x00U,0x00U,0x80U,0x12U,0x12U,0x38U,0x70U,0xE1U,0xC0U,
        0x80U,0x12U,0x12U,0x44U,0x89U,0x12U,0x20U,0xFFU,0xF3U,0xE2U,0x44U,0x09U,0x02U,0x20U,0x80U,0x12U,0x02U,0x7CU,0x78U,0xE3U,0xE0U,
        0x80U,0x12U,0x02U,0x40U,0x88U,0x12U,0x00U,0x80U,0x12U,0x02U,0x44U,0x99U,0x12U,0x20U,0x7FU,0xE2U,0x02U,0x38U,0x68U,0xE1U,0xC0U,
        0x34U,0x80U,0x00U,0x00U,0x00U,0x00U,0x00U,0x0FU,0x00U,0x00U,0x00U,0x00U,0x00U,0x00U,0x0FU,0x00U,0x00U,0x00U,0x00U,0x00U,0x00U,
        0x0FU,0x00U,0x00U,0x00U,0x00U,0x00U,0x00U,0x30U,0x80U,0x00U,0x00U,0x00U,0x00U,0x00U,0x30U,0x80U,0x00U,0x00U,0x00U,0x00U,0x00U,
        0x40U,0x60U,0x00U,0x00U,0x48U,0x00U,0x00U,0xC4U,0x70U,0x00U,0x00U,0x08U,0x00U,0x00U,0x8FU,0x10U,0x88U,0x9CU,0x5CU,0x00U,0x00U,
        0x8FU,0x10U,0x88U,0xA2U,0x48U,0x00U,0x00U,0xBFU,0x90U,0x55U,0x02U,0x48U,0x00U,0x00U,0xFFU,0xF0U,0x55U,0x1EU,0x48U,0x00U,0x00U,
        0xFFU,0xF0U,0x55U,0x22U,0x48U,0x00U,0x00U,0x7FU,0xE0U,0x22U,0x26U,0x48U,0x00U,0x00U,0x00U,0x00U,0x22U,0x1AU,0x4CU,0x24U,0x80U};

        /*
        ** ===================================================================
        ** Method : ImageWait_GetImage (component BWimage)
        ** Description :
        ** Get image information.
        ** Parameters : None
        ** Returns :
        ** --- - Pointer to structure TIMAGE
        ** ===================================================================
        */
        PIMAGE ImageWait_GetImage(void)
        {
        Image.width = 0x38U;
        Image.height = 0x18U;
        Image.size = 0xA8U;
        Image.name = FileName;
        Image.pixmap = ImageWait_Pixmap;
        return &Image;
        }

        Like

  6. Hello Erich!
    I´m trying to print a monochromatic bitmap on the 5110 screen, but I don’t know how to use the DrawMonoBitmap method. It ask me for an image pointer, but i have no idea how to set it up.
    How do I do that?

    Like

  7. Pingback: 3D Printed Gameboy and Remote Controller with tinyK20 Board | MCU on Eclipse

  8. Pingback: Arduino Joystick shield, Nokia 5110 display and BlueTooth – gr33nonline

  9. Pingback: INTRO Robot Remote – First Production PCB | MCU on Eclipse

What do you think?

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s