Dots mania (Game tutorial)

Dots is another famous game we will create. The rules are simple, you need to circle the opponent’s dots. I played dots quite often in high school, mainly on religion :P. I have a big sentiment for this game so when I learned to program, I really wanted to do this game. After some unsuccessful attempts, I surrendered a little, but returned to the project and finished it. The tutorial is designed to present the idea of a lap of dots which is the main element of the game.

• Full project: Dots_Game_Project

I also made a downloadable game, where you can play with a friend over a LAN, if someone can divert ports either via the Internet, or in front of a monitor with a friend, or with a computer(created computer AI is on easy level). Game presented below is not an advertisement of me. Game below show how you can use code, this tutorial have to show only game engine, hearth of the game. If you have any question, like “why my panel glows and panel in your game not” or “how did you do ….” just ask i will answer you. When i prepare tutorial, i always want to create oportunity for you to test skills, give you challenge. Try to create your own game based on this code and you will see your skills will increase your skills. :

Download DotsMania_1.5

The form that will be demonstrated in this tutorial is quite simple:

Element type Element name Properties Form Form1 Name: Form1 Text: Dots mania Size: 840; 663 Panel Main_board Name: Main_board Size: 800; 600 Location: 12;12 BackColor: White Anchor: Top, Bottom, Left, Right

In this tutorial, the game starts when form load, we will not build unnecessary buttons and embellishments that will only obscure and blur the main engine of the game. Our game will look like the gif below:

Anyone who understands what the method of circling the dots do, will be able to add additional elements he wants to. We create Form Load:

After launching the program our eyes should show a ready-to-dots page, you can be tempted to change it to look more like a page from a notebook. An important element that we should pay attention to is putting our panels outside the area of the sheet. Because during the program operation the elements will be processed in a logical way, this process will require checking the above, below, left and right side of the dot. Add additional panels which the user will not have access at the beginning will be more convenient than the given an restriction.
If we would color these areas, they will look like in the picture:

These areas will be treated as empty areas and their blocking will ensure that they stay that way.

Now it’s time to unlock:

Add code below:

We can now put dots. One color, because the player does not change status to false, but will do it in another loop. Because the rules of the game require that. When a player encircle an opponent, he may place an extra dot.

As for the easy things, it’s just over. Now you have to embrace what I mean by explaining how some things work. The hardest part of the game is to find out if the dots are encircled. When the dot is one, the situation is obvious. Check out all sides of dot if is surrounded by dots of the opponent. Unfortunately, this is one of the many situations we have to consider. I will try to explain what and how, if someone does not understand, then he can write me an email or leave a comment.

Unlock code:

The code for this element together with the first function looks like this:

The methods contained in the above function return the list of elements adjacent to the dots.

In the photos we see colored adjoining elements. The next step is to create aparticular list of elements. I call this list “freedomPoints”. Any collision of an element or group during a lap check with this list will mean that the dots are not encircled.

This function returns a list that contains checked elements from all sides:

As you can see in the picture, the elements border with dots are not added to the list because they are stored in another list(BorderList). How does this function work when we have more items? Well as in the image below:

Violet and blue elements are the result of the “freedomPoints” function, and the red is the effect of the “Borders”. Look at the elements in the middle, surrounded by green dots, they have no color, they are very important because they will be our way to freedom from the encircle. We will now begin with a very important chapter in which we will group our dots. An important element here will be played by the player, we must know which player has just placed a dot. Such knowledge gives us a variable “Player”. At the moment when a green dot is placed, we do not consider green dots, we consider red dots. Since all the dots of the red player are grouped together we check each groupis is breaking to our “FreedomList”, if not any break, it means that it is encircled. Pre-grouping is pretty easy. We create groups of adjoining elements,we add them to the list, and then the lists that contain the same elements join together:

(Wygenerowana lista paneli – Generated panel list)

Let’s see what the method code looks like:

The simplest example is an example with four dots:

For a moment in such lists we do not have to worry about repetitive elements. Such segregation, as we add colors, looks like this:

(Grupa-Group)

As we can see, Group B does not count empty fields for its group temporarily, so we do not know whether our group B is definitely encircled or not. The final stage is to add empty or boundary fields to our groups and remove from the list those groups that join our list of freedom.

This function will allow us to eliminate open groups and keep groups closed, or empty groups if all groups are open.

(Grupa jest okrążona – Group is encircled)

 When we know which group is encircled, it should be rounded and eliminated from play so that the opponent can no longer use them. This last thing we can easily get by adding encircled items to “Player1CheckedList” or “Player2CheckedList” then for one player the dots will be eliminated and for the other are useless since they are encircled (empty fields). Based on these lists, we can also tell you which player won, if we talk about winning in the context of the area occupied. Let’s move on to the line drawing element, seeing the image above, it’s easy to guess how we do it. We will check each rounded element or if it is next to the opponent’s dot and create a list of those dots. Then, from the list, we will remove repetitive elements so that they are single, we will look at the elements that border them, and we will create a Tuple list that will store the line coordinates.

This modified LapTest will verify what you need, add it to your code. Now we will add the last element of “DrawLines” that will circle our points. It looks like this:

This loop could requires some work yet but its assumptions are probably clear