Difference between revisions of "CISC181 S2019 Lab3"

From class_wiki
Jump to: navigation, search
(Created page with " ===Preliminaries=== This assignment continues our use of the Swing library for basic drawing, but also requires mouse interaction and timer events. For review, here again i...")
 
Line 2: Line 2:
 
===Preliminaries===
 
===Preliminaries===
  
This assignment continues our use of the Swing library for basic drawing, but also requires mouse interaction and timer events.  For review, here again is the documentation for the [http://docs.oracle.com/javase/7/docs/api/javax/swing/JFrame.html <tt>JFrame</tt>], [http://docs.oracle.com/javase/7/docs/api/javax/swing/JComponent.html <tt>JComponent</tt>], [http://docs.oracle.com/javase/7/docs/api/java/awt/Graphics.html <tt>Graphics</tt>], and [http://docs.oracle.com/javase/7/docs/api/java/awt/Color.html <tt>Color</tt>] classes.  But also: [https://docs.oracle.com/javase/7/docs/api/java/awt/event/MouseListener.html <tt>MouseListener</tt>
+
This assignment continues our use of the Swing library for basic drawing, but also requires mouse interaction and timer events.  For review, here again is the documentation for the [http://docs.oracle.com/javase/7/docs/api/javax/swing/JFrame.html <tt>JFrame</tt>], [http://docs.oracle.com/javase/7/docs/api/javax/swing/JComponent.html <tt>JComponent</tt>], [http://docs.oracle.com/javase/7/docs/api/java/awt/Graphics.html <tt>Graphics</tt>], and [http://docs.oracle.com/javase/7/docs/api/java/awt/Color.html <tt>Color</tt>] classes.  But also: [https://docs.oracle.com/javase/7/docs/api/java/awt/event/MouseListener.html <tt>MouseListener</tt>] and [https://docs.oracle.com/javase/7/docs/api/javax/swing/Timer.html Swing <tt>Timer</tt>].
 +
 
 
Just like last time:
 
Just like last time:
 
* Make a new project (but now ''n'' = 3) following [[CISC181_S2019_NewAndroidStudioProject | these ]] instructions.   
 
* Make a new project (but now ''n'' = 3) following [[CISC181_S2019_NewAndroidStudioProject | these ]] instructions.   
Line 12: Line 13:
  
 
* Add [[CISC181_S2019_Lab3_pairs | your name and your partner's name]] in a comment before the Lab3 class body, as well as before <tt>LifeJComponent</tt>  
 
* Add [[CISC181_S2019_Lab3_pairs | your name and your partner's name]] in a comment before the Lab3 class body, as well as before <tt>LifeJComponent</tt>  
* Initialize a <tt>JFrame</tt> and custom <tt>LifeJComponent</tt> (as explained in the Swing portion of the Feb. 26 lecture slides) for each of the two exercises below
+
* Initialize a <tt>JFrame</tt> and custom <tt>LifeJComponent</tt>
 
** Here is some [https://drive.google.com/open?id=1UY2cywNpqZx270LkKWXmqtsf4Y_qziefegKv5IE3cuA example code shown in the March. 7 lecture].  You don't have to use it, but it demonstrates mouse interaction and timer events, plus contains the beginning of a button class that may be helpful
 
** Here is some [https://drive.google.com/open?id=1UY2cywNpqZx270LkKWXmqtsf4Y_qziefegKv5IE3cuA example code shown in the March. 7 lecture].  You don't have to use it, but it demonstrates mouse interaction and timer events, plus contains the beginning of a button class that may be helpful
** Two JFrames initialized in main() means two windows should pop up each time you run the program
 
 
For this exercise you will draw several patterns similar to an [https://en.wikipedia.org/wiki/Ishihara_test Ishihara-style color blindness] test. The basic idea is that many randomly-sized circles are drawn, with a number or other meaningful pattern distinguished by some circles being colored differently from the rest.  An example of such a test is shown below:
 
 
[[Image:1024px-Ishihara 9.png|300px]]<br>
 
 
You are not going to draw numbers, but rather several simple shapes: either a large '''circle''', '''square''', or a '''diamond'''.  We provide a [http://nameless.cis.udel.edu/class_wiki/index.php/CISC181_F2017_JFrameExample <tt>ColorJComponent.java</tt>] class to use as a template.  This class already draws randomly-placed, randomly-sized, non-overlapping circles, as shown below:
 
 
Your job is add code to the class to '''color''' the circles in as follows:
 
  
* <!--The window should be initialized to 500 x 500 (this needs to be used for both the JFrame and when calling the constructor for the ColorJComponent object), have the title "Color Test",-->The window should be drawn with a white background
+
For this exercise you will implement the "Game of Life", a cellular automaton on 2-D grid invented by mathematician John Conway in 1970.  The update rules are as follows:
* Each time paintComponent() is called, you should randomly decide whether the hidden shape to be drawn is a circle, square, or diamond.  The hidden shape should be centered in the window, and if it is a square or diamond, its sidelength should be half the window width.  If a circle, its diameter should be half the window width.
 
* Each small circle should be ''filled'' with a randomly-chosen [https://www.rapidtables.com/web/color/RGB_Color.html RGB color] as follows:
 
** If the current "hidden shape" is a ''circle'': If the small circle's center is inside the shape, draw it with a random RGB in the green/light-green range.  If it is outside the shape, choose a random RGB in the red/orange range.
 
** If the current "hidden shape" is a ''square'': If the small circle's center is inside the shape, draw it with a random RGB in the orange/yellow range.  If it is outside the shape, choose a random RGB in the cyan/green range.
 
** If the current "hidden shape" is a ''diamond'': If the small circle's center is inside the shape, draw it with a random RGB in the pink/lavender range.  If it is outside the shape, choose a random RGB in the light gray/dark gray range.
 
  
The process of randomly selecting the potential colors for the circles should occur ''ONCE, in the constructor'' -- not paintComponent().  You will need to store the results somewhere (maybe an array, hint, hint????) and look them up each time you draw.
+
* For a space that is 'populated'
+
**Each cell with one or zero neighbors dies, as if from loneliness
Finally, the positions and sizes of the filled circles should be scaled proportionally if the window changes size (which you will know because getWidth() and getHeight() will return different numbers).
+
**Each cell with four or more neighbors dies, as if by overpopulation
 +
**Each cell with two or three neighbors survives
 +
* For a space that is 'empty' or 'unpopulated', each cell with exactly three neighbors becomes populated
  
''Extra credit: can you figure out how to use arbitrary characters (appropriately enlarged) as the hidden shapes?''
+
There is a link to a web-based implementation [  https://bitstorm.org/gameoflife/ here].  Your implementation does not need to look like this.  Rather, at a minimum you must have the following features:
  
 +
* At least 100 x 100 grid (larger window, of course)
 +
* The grid is on a ''torus'' (i.e., it wraps horizontally and vertically)
 +
* No sliders or menus -- just buttons outside of grid area.  Don't use JButtons -- just draw rectangles with explanatory labels (strings) and react to mouse clicks inside them.
 +
** You should provide at least "Clear" (revert grid to all empty), "Start" (begin running simulation steps automatically at some regular time interval), "Stop" (pause simulation animation), "Next" (take exactly one step of the simulation and show result)
 +
** Buttons that correspond to 4 or more common patterns (e.g., glider, exploder, tumbler).  If you choose one of these, then click on the grid, the currently-selected pattern should be "dropped" at that location.  Otherwise clicking on a grid square should toggle it from empty to full or back.
 +
** A "Random" button should randomly populate the entire grid with a well-chosen uniform probability
  
 
===Finishing up===
 
===Finishing up===
  
 
Remember to use proper [https://google.github.io/styleguide/javaguide.html naming and formatting style] throughout your code, and submit your <tt>Lab3.java</tt> and <tt>LifeJComponent.java</tt> on Canvas by midnight (or just after) on '''Tuesday, March 12'''
 
Remember to use proper [https://google.github.io/styleguide/javaguide.html naming and formatting style] throughout your code, and submit your <tt>Lab3.java</tt> and <tt>LifeJComponent.java</tt> on Canvas by midnight (or just after) on '''Tuesday, March 12'''

Revision as of 15:05, 8 March 2019

Preliminaries

This assignment continues our use of the Swing library for basic drawing, but also requires mouse interaction and timer events. For review, here again is the documentation for the JFrame, JComponent, Graphics, and Color classes. But also: MouseListener and Swing Timer.

Just like last time:

  • Make a new project (but now n = 3) following these instructions.
  • Name your class "Lab3". This happens when you are creating a new module, in the Java class name field

Instructions

Modify Lab3.java as you did last week:

For this exercise you will implement the "Game of Life", a cellular automaton on 2-D grid invented by mathematician John Conway in 1970. The update rules are as follows:

  • For a space that is 'populated'
    • Each cell with one or zero neighbors dies, as if from loneliness
    • Each cell with four or more neighbors dies, as if by overpopulation
    • Each cell with two or three neighbors survives
  • For a space that is 'empty' or 'unpopulated', each cell with exactly three neighbors becomes populated

There is a link to a web-based implementation [ https://bitstorm.org/gameoflife/ here]. Your implementation does not need to look like this. Rather, at a minimum you must have the following features:

  • At least 100 x 100 grid (larger window, of course)
  • The grid is on a torus (i.e., it wraps horizontally and vertically)
  • No sliders or menus -- just buttons outside of grid area. Don't use JButtons -- just draw rectangles with explanatory labels (strings) and react to mouse clicks inside them.
    • You should provide at least "Clear" (revert grid to all empty), "Start" (begin running simulation steps automatically at some regular time interval), "Stop" (pause simulation animation), "Next" (take exactly one step of the simulation and show result)
    • Buttons that correspond to 4 or more common patterns (e.g., glider, exploder, tumbler). If you choose one of these, then click on the grid, the currently-selected pattern should be "dropped" at that location. Otherwise clicking on a grid square should toggle it from empty to full or back.
    • A "Random" button should randomly populate the entire grid with a well-chosen uniform probability

Finishing up

Remember to use proper naming and formatting style throughout your code, and submit your Lab3.java and LifeJComponent.java on Canvas by midnight (or just after) on Tuesday, March 12