Rexrainbow Board series tutorial #1 Board basic

  • 25 favourites


Attached Files

The following files have been attached to this tutorial:



9,090 visits, 20,928 views



This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Chapter 1. About Board


Rexrainbow's <Board> series plugins are perfect solutions for your grid-style games, like: monopoly, SLG, roguelike games and etc. In this tutorial we will teach you how to design a Poptile game with <Board> series plugins.

Firstly, we need to know what is <Board> plugin for and what can it do for our game. Let's take below picture as an example:

Mr. Fu and Ms. Egg are playing "blind" chess which means their eyes are all blindfolded by clothes. So they have to memorize everything on an imaginary board in their mind. The imaginary board is composed of two parts: 1st one is a arithmetic representation, which typically can be expressed by an array. The 2nd part is a geometry representation, which defines the shape of each cell and the connectivity between two cells.

In the following chapters, we will use Rexrainbow's <Board> and <Square Tx> plugin to build the imaginary board for Mr. Fu and Ms. Egg.

Chapter 2. Create a Board


Please install all Rexrainbow plugins before you move on . Now open a new project. Insert a <Board> and a <Square Tx> plugins in your project.


Choose the [Board] object and look at its parameters. In this example, we want a 10 x 7 sized board. Namely it's size in logic should be a 10 x 7 array. So let's fill the parameters as below:

This defines the geometric size of our board. Next we are going to set the parameters of [SqareTx]. We want each cell to be 64px x 64px, so set the width/height to both 64. Besides, we don't want our board to be created at layout origin position, so we give a offset (100, 32) to our board. Set the parameters of [SquareTx] like below:

Next let's add the tile image for our board. Just drag <tile.png> to your layout and C2 will create a [tile] sprite for you. Change the size of [tile] to be (64,64).

Now here comes the most important part of this chapter: we are going to create the visual part for our board corresponding to our arithmetic and geometric settings. Go to <Event sheet 1> and add below codes:

Event1 binds [Board] to [SquareTx], this tolds board that our board is a square board (other possible choices are HEX and Isometric). Event2 & 3 makes an embedded loop structure. In this loop we use <Board>-><Create tile> action to create board tiles. Push <F4> to run layout and you'll see you board is created.


  • Order by
Want to leave a comment? Login or Register an account!
  • I am not seeing the "stand on tile" parameter when I create the board. Where can I find this?