Chapter 3. Create a Chess
~~~~~~~~~~~~~~~~~~~~~~~
The process of creating a chess on board can be split into to steps: the 1st step is to create the image part of the chess; and the 2nd step is to create the logical part of the chess.
Step1: Drag the <chess.png> into you layout and C2 will automatically create the [chess] object for us. Change its size to be (64,64) after [chess] is created:
Now we've created the image part of our chess.
Step2: Change to <Event sheet 1> and add the following codes:
We add Event4 to create the chess on board. Please note the indent of Event4, this event is a child event of Event1. And please also note that we use <Board>-><Create chess> action to create chess the chess with both its image part and logical part. If you use <System>-><Create object> then it will create only the image part of chess. Push <F4> to check, and now you can see your chess is put on your board.
As we can see, the chess is put on logical position (x,y) = (5,4), and the logical z is set to 1 so that the chess is floating above one layer of our board. Now we've finished creating a chess. The next chapter is the most important part of this tutorial: moving our chess.
Chapter 4. Moving a Chess
~~~~~~~~~~~~~~~~~~~~~~~~
Since a chess is composed of 2 parts: logical part and image part, we have to move both the logical chess and image chess to complete a chess movement. This is a very important concept because most new user to <Board> will forget to move image chess and call it a bug. Please note that <Board> plugin only deals with those logical works for you.
Before we start, we have to make a debug console to see what happend in our board. Use <Text> plugin to create [txt_debug] object at top-left corner, enlarge it to cover all window area:
Change to <Event sheet 1>, add the following code:
The "Debug" group check where the logic chess is located. Event9 uses <Board>-><Pick chess at Logic X, Y> to check whether there is any specified chess over the board. If TRUE, we append "chess" to [txt_debug]; If FALSE, it falls to Event10 and appends "none ," to [txt_debug]. Push <F4> to run layout and check:
Now here comes the most important part: move the chess! Add a [Keyboard] object to your project so we can use WASD keys.
Go to <Event sheet 1> and add/change following codes:
Actions added in Event1 destroy the original sprites which are put outside of our layout. Event11~14 look like we are moving the chess, but later we will see these codes are not enough to move it correctly. Push <F4> to run layout:
Here the bug comes! Although we can move our chess in image, but we can see in the debug message that our logical chess isn't moving at all! What we have to do is to further update the logical position of our chess. Turn back to <Event sheet 1> and update the codes:
As you can see, we introduce several <Board>-><Move chess to xy> action before we move the image of chess. This action can move the logical chess to specified logical (x, y). Besides, we use Board.PXY2LX()/Board.PXY2LY() expressions to convert image position to logical position. What do these expression means? Let's push <ctrl + F4> and find some information in debug mode:
This picture is captured at layout starts. As we can see, the chess is located at physical position (420, 288). But we know that the logical position of this chess is (5, 4) which we set in Event4. So there must be some methods to transfer those two postions, and PXY2LX/PXY2LY do this job well! Just feed your physical position as the 2 parameters, and <Board> plugin will calculate its corresponding logical position for us.
Push <F4> to run layout, move your chess with WASD. Now our chess move successfully moves both image and logic parts of the chess.