Tutorial Downloads

File Size


Know another language? Translate this tutorial!


796 visitors
2,385 page views

Rexrainbow Board series tutorial #4 Click remove, and make it a game

Favourite 10 favourites
Tutorial written by jomoOriginally published on 3rd, March 2016 - 1 revision

Chapter 1. Click Remove
Finally we are coming to the final part of this series! To assembly everything and make it a Poptile game, we still need a critical function: click remove. This function is the most difficult one through out whole the game (so I put it in the last tutorial). Traditionally to perform a click remove in match-3 game, you'll need to implement flood fill algorithm which will let you feel dizzy and fall to asleep quickly. But thanks for Rexrainbow's <Board> series plugins again, we can do this more intuitivly and easily by <SLG Movement> plugin.
<SLG Movement> plugin is design for SLG games. The greatest part is that you can use it to detect moveable area and implement path finding function for your SLG games. So you may think: "Why are we going to use it here for click remove function? We are not making a SLG!". OK, let's take a look at below picture:

On the left-side we have a 7x7 match-3 game. And on the right-side we have a analogy SLG terrian map. I just transfer green chess to grass, yellow chess to dessert, blue chess to sea, and red chess to wall. Now if player click one of the green chess and we have to find connected green chess to remove (marded in dashline), it will be similar to put a SLG character on corresponding tile and find its moveable area (marked in dash line). So we turned this click remove problem to be a moveable area problem, and <SLG Movement> plugin is the perfect solution for this case. Now let's start to edit our C2 project.

Change to <Layout 1> and add <SLG Movement> and <Touch> plugin.

Chage to <Event sheet 1> and add the following codes:
Open full size image

Firstly, we add a new global text variable symbol_to_remove. This varaible to buffer the symbol name of clicked chess to assist <SLG Movement>'s operation.

Next, Event26 triggers "touch_remove" function and jump to Event22. You can see that we send the UID of clicked chess to function, and pick the chess back when entering the function. This guarentee all the actions in this function applies to only the touched chess. The most important action in Event#22 is <SLG>-><Get moveable area>. Once you can understand this aciton, you'll be level-up in C2 coding. Now we introduce each of the parameters in this action:
Chess parameter assigns the character object to move. Moving points represent for the mobility of the character. It could be set to any non-zero points in our case. Moving cost is a function which defines the mobility cost of each terrian, and Filter is a function which defined the operations to take when <SLG Movement> find one moveable tile. We will add these two function in Event#23 & 25. Group is a specified group name of <InstGroup> to store the chess which are filtered out by Filter function.

While the action is over, all the chess on moveable tiles will be stored in "touch_remove" group in <InstGroup>. But it doesn't contains the the original clicked chess. So we add the original chess and pick all chess out, then flash them and destroy.

Event#23 defines the cost fuction and we name it "cost_func". This function will be called iteratively by <SLG Movement> plugin. When it is called, we pick the chess above current tile. If this chess has the same symbol to our target symbol, then we set its moving cost to 0 point. Otherwise the cost will be infinity and make this tile a immovable blocker.

Event#25 defines the fillter function and we name it "filter_func". This function will be called everytime <SLG Movement> finds a moveable tile. When this happens we pick the chess above current tile, and store the chess to "touch_remove" group.

OK, now disable Event#3 temporarily and push <F4> to run layout. Now we have click remove function in our game.

Share and Copy this Tutorial

You are free to copy, distribute, transmit and adapt this work with correct attribution. Click for more info.


AbelaNET 13.6k rep

Thanks for sharing

Friday, March 25, 2016 at 9:23:40 PM
redfoc 3,672 rep

awesome tutorial. thank you so much, very useful

Monday, November 21, 2016 at 11:43:47 AM

Leave a comment

Everyone is welcome to leave their thoughts! Register a new account or login.