# Rexrainbow Board series tutorial #1 Board basic

3
• 21 favourites

### Attached Files

The following files have been attached to this tutorial:

.png

.png

.capx

### Stats

7,489 visits, 18,021 views

• German

### Tools

~~~~~~~~~~~~~~~~~~~~~~

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.