After a lot of tinkering and pondering over the code, I managed to connect our gui to the core of the program. I even managed to throw in some sort of control using a few buttons and a slider (which determines the size of the board). Now the program works in two modes : One which lets you input an initial configuration and computes the next state on every right click. The user can click on any cell at any time to make it alive. The other mode, dubbed the ‘continous mode’, however lets you modify the board only at the start of the program. Once the user press the right mouse button, the program keeps on displaying subsequent states continuously – which is more fun to watch – and finally settles down in a stable state.
Piecing everything together
The buttons (widgets) and the slider was created using the wxpython library. For a tutorial, visit zetcode.
I’ve tried to put together the code as neatly as possible and i have made a lot of comments too. I would like to point out that my version of the program has a little problem with the mouse clicks. It was unnoticeable when i was using a mouse but when i used the touchpad of my laptop, i found that in some cases i had to click a cell twice to make it alive.
Use the launch.py script to run the program. And make sure you have the pygame and wxpython libraries installed.
Also, if you think that the programs moves all too quickly)or slowly) in the continous mode, change the framerate of the the display to your liking. To do this, open the display.py file and in line 49, change the value inside pygame.time.Clock().tick() to your desired framerate
I *might* convert the python script into an executable for windows and upload it. The conversion can be done using py2exe, but I again *might* have some enthusiasm left to add even more features to my humble program. If I do, then that’s another post 😉
Now that the ‘core’ of the program is up and running (see the previous post : game of life 101) it’s time to add a little glamour to our ‘life’!
So, here’s the recipe :
Dish name : Graphical interface for the game of life
Ingredients required :
1. Python interpreter and some knowledge in python (easily available at a programming site near you)
2. The pygame module for python. Download pygame here
3. A pygame introduction. I recommend inventing with python. Its a great book and serves as an excellent introduction to python AND pygame.
Find the book here. I dare say that ‘Invent with python’ is the only book you’ll ever need to start writing graphical applications in python in no time!
4. A wee bit of patience and a tiny pinch of interest
Now that we have all the ingredients ready, its time to cook some delicious stuff. First of all, let me show you how the ‘game’ will look like after our dish is ready (look at the picture, stupid! :p )
Eternal sunshine of the Spot-full mind
And let me remind you that this is not going to be the graphical implementation of GOL. Why? Because, in this post, I’d just like to see the graphical display up and running. That is, the user must be able to populate the cells with dots, but updating the cells will have to wait until another post. The display window I create now will be completely independent of the text only game of life I had created earlier. But I have made the code flexible enough to be easily modified to suit our purpose at a later time.
So what does the program do exactly? It allows the user to click on a cell and create a green dot right in the middle of the cell. Period.
So, here’s what I did:
1. Divided the screen into cells by drawing horizontal and vertical lines. This is done by first dividing the width (and height) of the window by the no of cells I want. I am assuming that the window will be a square and hence width=height. If the windows width is 400, I’ll divide the width by 5 to get the length of each cell. I draw a vertical line at every 80 pixels on one side and horizontal lines at every 80 pixels on the other side to get the ‘matrix’.
2. Finding the position of mouse in terms of row and column : I identify each cell with its row number and column number. For example, the cell on the top left corner would be the cell (0,0). To get the column on which the mouse pointer now reside, we first divide the X CO-ORDINATE of the mouse position by the length of each cell. Now since both the mouse position and length of cell are of integer type, dividing the x coordinate by the length of each cell gives an integer which says on which column the mouse pointer is.
For example, assume that the mouse pointer is at the position (120,300). The x coordinate is 120. Let the width of window be 400 and let there be 5 cells (as in the picture). So width of each cell is 80. Now to find the column on which the mouse resides, we divide 120 by 80. Since both are integers, we get 120/80 = 1. (If you do not understand this, go here). And that means our mouse is at column 1. Not that this is the SECOND column in the window since column numbering starts from 0. A similar procedure (using height instead of width and the y coordinate) is used to find out on which row the mouse pointer is at.
3. On every left mouse click, the row and column of the cell on which the mouse click occurred is added (appended) to a list called circle_list. If you are not familiar with lists in python, now might be a good time to do so!
4. A function called draw_circles() draws a green circle (or a dot) on the center of all the cells whose co-ordinates (row and column number) are in the circle_list.
If you need any reference/example regarding the program, feel free to view/try my code. Download it from here. I have thrown some comments here and there inside the file to help any readers who might find themselves completely lost 🙂
In future, we might want the window to pass the information regarding the cells to the ‘core’ of the program to compute the next stage and then display the updated information in the window. To do this, we will be passing on the circle_list to the other classes which will compute the next stage, and then pass back an UPDATED circle_list to the display program. All the display program is to do then is to draw little green circles on the cells in the circle_list (and also remove green circles from the cells that were previously in the list, but not anymore)
As for now, have fun conjuring green dots out of thin air. Until next time 😉
No, I’m not talking about the board game. This particular game of life, was thought up by a (respected) guy named Conway way back in the 70s. The rules are pretty simple, and a little time with our friend Google can fish out a lot of info on the subject. But for the uninitiated and the lazy, let me elaborate:
Look’s creepy. But trust me, the black dots are supposed to be alive!
Imagine space – not necessarily where the space shuttles go, but ordinary two dimensional, sheet-like space would do just fine. Now imagine a speck in that space. Imagine earth, or imagine little round stones. Now imagine it to be alive (easier if you imagine earth). Now forget your 3rd grade science textbook and imagine little planets AROUND the earth – and no sun. Done? Now imagine all the planets and the earth to cuddle together! Now the Earth is your ‘live’ cell (or planet) and the little planets around the earth are the ‘neighbors’ of the cell called Earth. Imagine that our Earth and little planets are confined to a 2-d space. That is, the earth and the planets are like the drawings on a piece of paper (I know that’s a little too much elaboration, but I couldn’t somehow help writing that). The ‘neighbours’ of the cell Earth can either be alive (as in Extra terrestrial life) or dead (as in a chunk of rock). Imagine the little planets around the earth to have other different planets near them as well. Now we have a pretty crowded (it depends) sheet of paper with many live and dead cells. Here are the rules:
Any live cell with fewer than two live neighbours dies, as if caused by under-population.
Any live cell with two or three live neighbours lives on to the next generation.
Any live cell with more than three live neighbours dies, as if by overcrowding.
Any dead cell with exactly three live neighbours becomes a live cell, as if by reproduction (imagine planets reproducing :p )
That’s it. The stage for the game of life is ready. What’s all this? It doesn’t sound very ‘interesting’?
A warning though. We are now walking along the shores of that vast sea called cellular automata. Now ‘cellular automata’ was one of those words I used to specifically avoid and classify as ‘complicated un-readable stuff’. And it is complicated. But I read about the game of life on a different context and it sounded simple enough, and thus forms the basis of my next little program!
Here’s an overview of what I HOPE to implement :
1. A grid. Lines running horizontal and vertical divides the grid into cells.
2. an Initial pattern, and a target cell. The goal of the player is to make the target cell alive and maybe keep it alive for 3 turns
3. In each turn, the user can click on a limited no of cells to turn them ‘live’
I guess that’s pretty much it. No complicated Artificial intelligence. No simulation of cool patterns. Just a bunch of boxes to click on and green dots to populate them. Let’s see how far it goes. I guess it shouldn’t be much of a problem, since python and pygame always comes to the rescue 😉
But before going all graphical, let me try to get it up and running in text mode!