Introduction

Pyxel is a retro game engine for Python. I used to play a lot because I could easily make games, but I haven't touched it so much recently, so I completely lost my memory. I will play with it for the first time in a long time and try to recover my memory.

In addition, please see the following link for detailed and correct knowledge and installation method. https://github.com/kitao/pyxel/blob/master/README.ja.md

1 Minimal code

First of all, the minimum required code is roughly as follows.

#First import pyxel
import pyxel

#Create a class that represents the entire game and define the content of the game in it
class App:
    def __init__(self):
        #Screen size(Width w,Height h)To specify
        pyxel.init(100, 100)

        #Create variables for the time being
        #There is no particular meaning now
        self.x = 0

        #Register the update function and drawing function to be executed when updating the frame
        #Image of two functions being executed consecutively every hour
        pyxel.run(self.update, self.draw)

    def update(self):
        #X increases by 1 for each frame
        #There is no particular meaning now
        self.x += 1

    def draw(self):
        #Specify the color to clear the screen(0〜15)
        #Screen color 0 for each frame(=black)Cleared with
        #There is no particular meaning now
        pyxel.cls(0)

#Instantiate a class and start the game
App()

All code descriptions are as described in the comments. As you can see, the execution result now only displays a black screen.

2 Display a picture

Well, the screen came out, but the picture is displayed from here, it moves, and if you can not operate it, it will not be a game. Let's start by displaying the picture. The display of the picture is described in the drawing function draw. Let's make a simple rectangle.

    def draw(self):
        pyxel.cls(0)

        #Draw a rectangle, the argument is(Coordinates of the upper left point x, y,Width w,Height h,color)
        pyxel.rect(10, 10, 10, 10, 9)

(The comment I wrote before is omitted) Draw a rectangle by specifying the coordinates of the upper left point of the rectangle and the width, height, and color. The coordinates are (0, 0) at the top left of the screen, x increases as you move to the right, and y increases as you move down. In this example, the screen size is 100x100, so The upper left is (0,0) and the upper right is (100,0) Lower left is (0,100) Lower right is (100,100) It means that. Execution result. I was able to draw a rectangle with a width of 10, a height of 10, and a color of 9 (= orange) 10 on the right and 10 on the bottom.

3 Move the picture

Next, let's move this rectangle. The basic idea is to change the variable for each frame and apply that variable to the parameters in the drawing function. I haven't used it before, but in the update function update, there is a variable x that increments by 1 for each frame. Let's use this for a rectangle parameter.

    def draw(self):
        pyxel.cls(0)

        #Draw a rectangle, the argument is(Coordinates of the upper left point x, y,Width w,Height h,color)
        #Set variable x to width
        pyxel.rect(10, 10, self.x, 10, 9)

Perhaps the width of the rectangle will increase little by little. Execution result. I was able to increase the width of the rectangle by one.

4 Operate

Just moving the picture is just an animation. Let's make sure that the player's operation is reflected on the screen. First of all, from the keyboard operation. The btn function determines if the specified key is held down. The key type is specified by a constant such as KEY_ ○○. In the update function update, the variable x was incremented by 1. Let's change this by operating the keys.

    def update(self):
        #X increases while holding down the right key
        if(pyxel.btn(pyxel.KEY_RIGHT)):
            self.x += 1
        #If not pressed, it will be 1
        else:
            self.x = 1

Now, if the right side of the keyboard is not pressed, the width of the rectangle will be 1 The width now increases by 1 while the right is pressed. Next, reflect the mouse operation.

    def draw(self):
        pyxel.cls(0)

        pyxel.rect(10, 10, self.x, 10, 9)

        #Get the coordinates of the mouse cursor
        mx = pyxel.mouse_x
        my = pyxel.mouse_y

        #Create a new rectangle
        #Match the upper left coordinates with the coordinates of the mouse cursor
        pyxel.rect(mx, my, 5, 5, 6)

Get the coordinates of the mouse cursor with mouse_x and mouse_y. Then, apply the coordinates to the coordinates of the upper left point of the newly created rectangle. You can now draw a rectangle in the same place as the mouse cursor. When you move the mouse, a light blue rectangle is created. If you operate it with a keyboard, you can make an invader game or Pac-Man, and if you operate it with a mouse, you can make a breakout game.

5 Conclusion

The entire code. It's easy.

import pyxel

class App:
    def __init__(self):
        pyxel.init(100, 100)

        self.x = 0
        
        pyxel.run(self.update, self.draw)

    def update(self):
        if(pyxel.btn(pyxel.KEY_RIGHT)):
            self.x += 1
        else:
            self.x = 1

    def draw(self):
        pyxel.cls(0)

        pyxel.rect(10, 10, self.x, 10, 9)

        mx = pyxel.mouse_x
        my = pyxel.mouse_y

        pyxel.rect(mx, my, 5, 5, 6)

App()

I wrote down the basics in the basics for my rehabilitation that I lost my memory for the time being. I haven't written this time, but the main feature of Pyxel is that it comes with an editor for applying pixel art. If you master this and flesh out the simple code I wrote this time, you will be able to create a game of its own. Not only is it fun to make games, but it's also very meaningful because you can learn important concepts for programming such as collision detection, gravity, and state variables. I would like to continue studying little by little so that I can make something that looks like a game.

(Added on 2020/12/19) There was an indication about the code. See comments.