-
Notifications
You must be signed in to change notification settings - Fork 0
/
423330890.html
99 lines (86 loc) · 22.6 KB
/
423330890.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
<!DOCTYPE html>
<html>
<head>
<title>Di Luo : Di Luo's CS231 Project 2: Conway's Game of Life</title>
<link rel="stylesheet" href="styles/site.css" type="text/css" />
<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body class="theme-default aui-theme-default">
<div id="page">
<div id="main" class="aui-page-panel">
<div id="main-header">
<div id="breadcrumb-section">
<ol id="breadcrumbs">
<li class="first">
<span><a href="index.html">Di Luo</a></span>
</li>
<li>
<span><a href="413631037.html">Di Luo’s Home</a></span>
</li>
<li>
<span><a href="474513827.html">Di Luo's CS231</a></span>
</li>
</ol>
</div>
<h1 id="title-heading" class="pagetitle">
<span id="title-text">
Di Luo : Di Luo's CS231 Project 2: Conway's Game of Life
</span>
</h1>
</div>
<div id="content" class="view">
<div class="page-metadata">
Created by <span class='author'> Di Luo</span>, last modified on Feb 26, 2019
</div>
<div id="main-content" class="wiki-content group">
<p><strong style="text-decoration: underline;">Description</strong></p><p>In Project 2 <span style="color: rgb(34,51,68);">we explore the simulation of entities on a 2D grid, in which t<span style="color: rgb(34,51,68);">he entities interact with each other in order to determine how they change over time, and the concept behind it – cellular automata. We focus on implementing Conway's Game of Life, in which <span style="color: rgb(34,34,34);">its evolution is determined by its initial state, requiring no further input. To complete the simulation I created three classes, which are <span style="color: rgb(34,51,68);">Cell, Landscape and LifeSimulation. By running these classes with Java Swing graphical user interface package, which enables me to display the landscape, I successfully created a window that displays Conway's Game of Life.</span></span></span></span></p><p><strong style="text-decoration: underline;"><br/></strong></p><p><strong style="text-decoration: underline;"><strong style="text-decoration: underline;">Solution</strong></strong></p><p>To begin with, I created Cell class, which creates Cell objects representing one location on a regular grid. The class uses boolean variables to represent the state of the Cell, true meaning it is alive and false meaning it is dead. Different functions such as getAlive, which returns whether the Cell is alive, and setAlive, which sets the Cell's alive state, are created to check or change the state of each Cell. A toString method is created, which replaces the original one and return "0" if the Cell is alive and return " " if the Cell is dead. A main method is created to test the functions.</p><p> </p><p>Then Landscape class is created, which holds a 2D grid of Cell object reference. Two fields, rows and cols, are created to hold the number of rows and columns. The constructor create a 2D grid and each of the entries stores a Cell object, as shown in the snippet below:</p><p><span class="confluence-embedded-file-wrapper confluence-embedded-manual-size"><img class="confluence-embedded-image" draggable="false" width="300" src="attachments/423330890/423232451.png" data-image-src="attachments/423330890/423232451.png" data-unresolved-comment-count="0" data-linked-resource-id="423232451" data-linked-resource-version="1" data-linked-resource-type="attachment" data-linked-resource-default-alias="Screen Shot 2019-02-25 at 2.35.41 AM.png" data-base-url="https://wiki.colby.edu" data-linked-resource-content-type="image/png" data-linked-resource-container-id="423330890" data-linked-resource-container-version="6"></span>.</p><p>Other reset and get functions are created to give access to the data of the fields and especially the grid. A toString method is created to print out the grid as a <span style="color: rgb(34,51,68);">text-based string </span>in Terminal. The function getNeighbors is created, which returns a list of references to the neighbors of the Cell at location (row, col). A snippet of getNeighbors is shown below:</p><p><span class="confluence-embedded-file-wrapper confluence-embedded-manual-size"><img class="confluence-embedded-image" draggable="false" width="300" src="attachments/423330890/423232452.png" data-image-src="attachments/423330890/423232452.png" data-unresolved-comment-count="0" data-linked-resource-id="423232452" data-linked-resource-version="1" data-linked-resource-type="attachment" data-linked-resource-default-alias="Screen Shot 2019-02-25 at 2.41.29 AM.png" data-base-url="https://wiki.colby.edu" data-linked-resource-content-type="image/png" data-linked-resource-container-id="423330890" data-linked-resource-container-version="6"></span>.</p><p>Another main function is created in Landscape class for testing.</p><p> </p><p>In the next step, in order to visualize the landscape, the LandscapeDisplay class file is added and two draw method are created in Cell class and Landscape class respectively, which can draw the cells in different ways depending on whether the cell is alive or not. A snippet of draw method in Cell class is below. Alive cells are represented by a filled square and dead ones are represented by a empty square.</p><p><span class="confluence-embedded-file-wrapper confluence-embedded-manual-size"><img class="confluence-embedded-image" draggable="false" width="300" src="attachments/423330890/423232453.png" data-image-src="attachments/423330890/423232453.png" data-unresolved-comment-count="0" data-linked-resource-id="423232453" data-linked-resource-version="1" data-linked-resource-type="attachment" data-linked-resource-default-alias="Screen Shot 2019-02-25 at 2.47.05 AM.png" data-base-url="https://wiki.colby.edu" data-linked-resource-content-type="image/png" data-linked-resource-container-id="423330890" data-linked-resource-container-version="6"></span>.</p><p>Then by running the main function in LandscapeDisplay class, the 2D grid is successfully shown on the screen as below:</p><p> </p><p><span class="confluence-embedded-file-wrapper confluence-embedded-manual-size"><img class="confluence-embedded-image" draggable="false" width="300" src="attachments/423330890/423232455.png" data-image-src="attachments/423330890/423232455.png" data-unresolved-comment-count="0" data-linked-resource-id="423232455" data-linked-resource-version="1" data-linked-resource-type="attachment" data-linked-resource-default-alias="Screen Shot 2019-02-25 at 1.24.32 AM.png" data-base-url="https://wiki.colby.edu" data-linked-resource-content-type="image/png" data-linked-resource-container-id="423330890" data-linked-resource-container-version="6"></span>.</p><p> </p><p>After that, the function updateState is created in Cell class to updates whether or not the cell is alive in the next time step, given its neighbors in the current time step by looping through the list returned by getNeighbors in Landscape class. The basic we used here is that <span style="color: rgb(34,51,68);">if a live Cell has either two or three live neighbors, then it will be set to alive. If a dead Cell has exactly three living neighbors, it will be set to alive. Otherwise, the Cell will be set to dead.</span> A snippet is included below:</p><p><span class="confluence-embedded-file-wrapper confluence-embedded-manual-size"><img class="confluence-embedded-image" draggable="false" width="300" src="attachments/423330890/423232454.png" data-image-src="attachments/423330890/423232454.png" data-unresolved-comment-count="0" data-linked-resource-id="423232454" data-linked-resource-version="1" data-linked-resource-type="attachment" data-linked-resource-default-alias="Screen Shot 2019-02-25 at 2.53.34 AM.png" data-base-url="https://wiki.colby.edu" data-linked-resource-content-type="image/png" data-linked-resource-container-id="423330890" data-linked-resource-container-version="6"></span>.</p><p> </p><p>Later a function advance() is created in Landscape class in order to <span style="color: rgb(34,51,68);">move all Cells forward one generation. To achieve that a temporary grid, grid 2, which is identical to grid, is created to get the date in grid and then change is to the new version according to the original one (grid) by running updateState(). After that grid 2 is assigned back to grid. A snippet of advance() is shown below:</span></p><p><span style="color: rgb(34,51,68);"><span class="confluence-embedded-file-wrapper confluence-embedded-manual-size"><img class="confluence-embedded-image" draggable="false" width="300" src="attachments/423330890/423232456.png" data-image-src="attachments/423330890/423232456.png" data-unresolved-comment-count="0" data-linked-resource-id="423232456" data-linked-resource-version="1" data-linked-resource-type="attachment" data-linked-resource-default-alias="Screen Shot 2019-02-25 at 3.02.55 AM.png" data-base-url="https://wiki.colby.edu" data-linked-resource-content-type="image/png" data-linked-resource-container-id="423330890" data-linked-resource-container-version="6"></span>.</span></p><p><span style="color: rgb(34,51,68);"><br/></span></p><p><span style="color: rgb(34,51,68);">Finally the class LifeSimulation is created to run the simulation of the game, which creates Landscape and LandscapeDisplay objects, initializes the grid to be 30% full (alive) and then runs <span style="color: rgb(34,51,68);">the advance()</span><span style="color: rgb(34,51,68);"> method of the Landscape, the repaint()</span><span style="color: rgb(34,51,68);"> method of LandscapeDisplay, and </span><code>Thread.sleep( 250 )</code><span style="color: rgb(34,51,68);"> in a while loop to start the simulation and pause for 250 milliseconds between time steps. A video is recorded and transformed into a gif, which is shown below:</span></span></p><p><span style="color: rgb(34,51,68);"><span style="color: rgb(34,51,68);"><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image" draggable="false" src="attachments/423330890/423232457.gif" data-image-src="attachments/423330890/423232457.gif" data-unresolved-comment-count="0" data-linked-resource-id="423232457" data-linked-resource-version="1" data-linked-resource-type="attachment" data-linked-resource-default-alias="Untitled.gif" data-base-url="https://wiki.colby.edu" data-linked-resource-content-type="image/gif" data-linked-resource-container-id="423330890" data-linked-resource-container-version="6"></span>.</span></span></p><p><span style="color: rgb(34,51,68);"><br/></span></p><p><strong style="text-decoration: underline;"><strong style="text-decoration: underline;"><u><strong>Extension</strong></u></strong></strong></p><p>For the first extension I m<span style="color: rgb(34,51,68);">odified the main method in LifeSimulation to make use of command line parameters. The default values of <span style="color: rgb(34,51,68);">size of the Landscape, <span style="color: rgb(34,51,68);">density of the initial board and <span style="color: rgb(34,51,68);">number of iterations used in the simulation </span></span></span>are the same as the ones in original function but now with command line parameters they can be changed by the user in Terminal. The first variable is the size of Landscape, the second one is density of the initial board and the third one is number of iterations used in simulation.</span></p><p><span style="color: rgb(34,51,68);"><br/></span></p><p><span style="color: rgb(34,51,68);">For the second extension I <span style="color: rgb(34,51,68);">modified the </span><samp>updateState() </samp></span><span style="color: rgb(34,51,68);">function in the Cell class to implement different rules. From the Wikipedia of Game of Life, I learned the notation of different rules. The standard rule we used is </span><span style="color: rgb(34,34,34);">B3/S23, <span>meaning "a cell is born if there are 3 neighbors, and lives on if there are either 2 or 3 neighbors". So in updateState() I created 2 more rules, B6/S16 and B36/23. By adding parameter int rule in updateState() and advance(), now I can select which rule to use by indicating the number representing the rule in 4th position of command line parameters. By running the simulation twice with different rules I got the two gif below by using command line parameters.</span></span></p><p><span style="color: rgb(34,51,68);"><span style="color: rgb(34,34,34);"><span style="color: rgb(34,34,34);"><span class="confluence-embedded-file-wrapper confluence-embedded-manual-size"><img class="confluence-embedded-image" draggable="false" width="300" src="attachments/423330890/423232684.png" data-image-src="attachments/423330890/423232684.png" data-unresolved-comment-count="0" data-linked-resource-id="423232684" data-linked-resource-version="1" data-linked-resource-type="attachment" data-linked-resource-default-alias="Screen Shot 2019-02-25 at 11.08.51 PM.png" data-base-url="https://wiki.colby.edu" data-linked-resource-content-type="image/png" data-linked-resource-container-id="423330890" data-linked-resource-container-version="6"></span><span class="confluence-embedded-file-wrapper confluence-embedded-manual-size"><img class="confluence-embedded-image" draggable="false" width="300" src="attachments/423330890/423232685.gif" data-image-src="attachments/423330890/423232685.gif" data-unresolved-comment-count="0" data-linked-resource-id="423232685" data-linked-resource-version="1" data-linked-resource-type="attachment" data-linked-resource-default-alias="IMG_1491.gif" data-base-url="https://wiki.colby.edu" data-linked-resource-content-type="image/gif" data-linked-resource-container-id="423330890" data-linked-resource-container-version="6"></span></span></span></span></p><p><span style="color: rgb(34,51,68);"><span style="color: rgb(34,34,34);"><span style="color: rgb(34,34,34);"><span class="confluence-embedded-file-wrapper confluence-embedded-manual-size"><img class="confluence-embedded-image" draggable="false" width="300" src="attachments/423330890/423232686.png" data-image-src="attachments/423330890/423232686.png" data-unresolved-comment-count="0" data-linked-resource-id="423232686" data-linked-resource-version="1" data-linked-resource-type="attachment" data-linked-resource-default-alias="Screen Shot 2019-02-25 at 11.08.22 PM.png" data-base-url="https://wiki.colby.edu" data-linked-resource-content-type="image/png" data-linked-resource-container-id="423330890" data-linked-resource-container-version="6"></span><span class="confluence-embedded-file-wrapper confluence-embedded-manual-size"><img class="confluence-embedded-image" draggable="false" width="300" src="attachments/423330890/423232687.gif" data-image-src="attachments/423330890/423232687.gif" data-unresolved-comment-count="0" data-linked-resource-id="423232687" data-linked-resource-version="1" data-linked-resource-type="attachment" data-linked-resource-default-alias="IMG_1492.gif" data-base-url="https://wiki.colby.edu" data-linked-resource-content-type="image/gif" data-linked-resource-container-id="423330890" data-linked-resource-container-version="6"></span></span></span></span></p><p><span style="color: rgb(34,51,68);"><span style="color: rgb(34,34,34);"><span style="color: rgb(34,34,34);">We can see that since in rule 1 a dead cell needs 6 alive cells around to revive, it is hard to revive so that the cells disappeared quickly. In rule 2 since comparing with rule 0 a dead cell with 6 alive cells around can also revive, it increases the chance that cells keep living so that the number of cells decreases slower than the one with rule 0.</span></span></span></p><p><strong style="text-decoration: underline;"><strong style="text-decoration: underline;"><u><strong><br/></strong></u></strong></strong></p><p>For the third extension, I tried to <span style="color: rgb(34,51,68);">identify in comments when dynamically allocated memory is being "lost." in the main function of LifeSimulation.java. For </span><span style="color: rgb(78,201,176);">Landscape</span> <span style="color: rgb(156,220,254);">scape</span> = <span style="color: rgb(197,134,192);">new</span> <span style="color: rgb(220,220,170);">Landscape</span>(<span style="color: rgb(181,206,168);">100</span>,<span style="color: rgb(181,206,168);">100</span>), it disappears after the for loop in the last a few lines ends, so it is gone at the end of the code. For <span style="color: rgb(78,201,176);">Random</span> <span style="color: rgb(156,220,254);">gen</span> = <span style="color: rgb(197,134,192);">new</span> <span style="color: rgb(220,220,170);">Random</span>() it disappears after the for loop that initialize the grid to be 30% full executes. For <span style="color: rgb(78,201,176);">LandscapeDisplay</span> <span style="color: rgb(156,220,254);">display</span> = <span style="color: rgb(197,134,192);">new</span> <span style="color: rgb(220,220,170);">LandscapeDisplay</span>(scape, <span style="color: rgb(181,206,168);">8</span>) it also disappears at the end of the codes, when the last for loop executes.</p><p><span style="color: rgb(34,51,68);"> </span></p><p> </p><p><strong><u>Reflection</u></strong></p><p>In this project I continue learning knowledge in Java and how to implement it in actual coding process. Specifically I learned how to create a 2D grid and how to implement it to simulate a more interesting game – game of life. On the other hand I also become clearer about the rules of the game by creating it with codes. While coding I made some mistakes, such as missing semicolon, so that the codes didn't work well at the beginning. After carefully reading the reminder in Terminal and checking the codes, I successfully finished debugging and became more familiar with the new language Java.</p><p><strong><u><br/></u></strong></p><p><strong><u>Source</u></strong></p><p><a href="https://docs.oracle.com/en/java/javase/11/docs/api/index.html" class="external-link" rel="nofollow">https://docs.oracle.com/en/java/javase/11/docs/api/index.html</a></p><p><a href="https://en.wikipedia.org/wiki/Conway%27s_Game_of_Life" class="external-link" rel="nofollow">https://en.wikipedia.org/wiki/Conway%27s_Game_of_Life</a></p>
</div>
<div class="pageSection group">
<div class="pageSectionHeader">
<h2 id="attachments" class="pageSectionTitle">Attachments:</h2>
</div>
<div class="greybox" align="left">
<img src="images/icons/bullet_blue.gif" height="8" width="8" alt=""/>
<a href="attachments/423330890/423232451.png">Screen Shot 2019-02-25 at 2.35.41 AM.png</a> (image/png)
<br/>
<img src="images/icons/bullet_blue.gif" height="8" width="8" alt=""/>
<a href="attachments/423330890/423232452.png">Screen Shot 2019-02-25 at 2.41.29 AM.png</a> (image/png)
<br/>
<img src="images/icons/bullet_blue.gif" height="8" width="8" alt=""/>
<a href="attachments/423330890/423232453.png">Screen Shot 2019-02-25 at 2.47.05 AM.png</a> (image/png)
<br/>
<img src="images/icons/bullet_blue.gif" height="8" width="8" alt=""/>
<a href="attachments/423330890/423232454.png">Screen Shot 2019-02-25 at 2.53.34 AM.png</a> (image/png)
<br/>
<img src="images/icons/bullet_blue.gif" height="8" width="8" alt=""/>
<a href="attachments/423330890/423232455.png">Screen Shot 2019-02-25 at 1.24.32 AM.png</a> (image/png)
<br/>
<img src="images/icons/bullet_blue.gif" height="8" width="8" alt=""/>
<a href="attachments/423330890/423232456.png">Screen Shot 2019-02-25 at 3.02.55 AM.png</a> (image/png)
<br/>
<img src="images/icons/bullet_blue.gif" height="8" width="8" alt=""/>
<a href="attachments/423330890/423232457.gif">Untitled.gif</a> (image/gif)
<br/>
<img src="images/icons/bullet_blue.gif" height="8" width="8" alt=""/>
<a href="attachments/423330890/423232684.png">Screen Shot 2019-02-25 at 11.08.51 PM.png</a> (image/png)
<br/>
<img src="images/icons/bullet_blue.gif" height="8" width="8" alt=""/>
<a href="attachments/423330890/423232685.gif">IMG_1491.gif</a> (image/gif)
<br/>
<img src="images/icons/bullet_blue.gif" height="8" width="8" alt=""/>
<a href="attachments/423330890/423232686.png">Screen Shot 2019-02-25 at 11.08.22 PM.png</a> (image/png)
<br/>
<img src="images/icons/bullet_blue.gif" height="8" width="8" alt=""/>
<a href="attachments/423330890/423232687.gif">IMG_1492.gif</a> (image/gif)
<br/>
</div>
</div>
</div> </div>
<div id="footer" role="contentinfo">
<section class="footer-body">
<p>Document generated by Confluence on Aug 29, 2022 09:29</p>
<div id="footer-logo"><a href="http://www.atlassian.com/">Atlassian</a></div>
</section>
</div>
</div> </body>
</html>