CS112 Assignment 6

CS 112

Assignment 6

Due: Friday, April 1, at the beginning of class

You can turn in your assignment up until 5:00pm on 4/1/10 without penalty, but it is best to hand in the assignment at the beginning of class. Your hardcopy submission should include a cover sheet, printouts of two code files: drawGUI.m and popGUI.m, and a hardcopy of a picture created with the GUI sketchpad that you construct for Problem 1. Your electronic submission is described in the section Uploading your saved work

Reading

The following material is especially useful to review for this assignment: notes and examples from Lectures #12-14, and Lab #7. There is also extensive online documentation on the creation of graphical user interfaces with the GUIDE program available through the MATLAB Help facility.

Getting Started: Create an assign6_programs folder

There are no initial programs needed for this assignment, as you will be creating two GUI-based programs from scratch. Create a folder for your programs that includes assign6_programs in the name, e.g. sohie_assign6_programs. In MATLAB, set the Current Directory appropriately.

Uploading your saved work

Use Fetch or WinSCP to upload your saved work, and connect to the CS file server using your personal user account name and password. After logging in to your account:

Browse through your directory and find the drop/assign6 folder
Upload your assign6_programs folder into your drop/assign6 folder
When done uploading, be sure to delete your assign6_programs folder from the Desktop by dragging it to the trash can, and then empty the trash (Finder--> Empty Trash).
Be sure to Exit out of MATLAB when you are done

When you are done with this assignment, you should have four files stored in your assign6_programs folder: two M-Files, drawGUI.m and popGUI.m, and two .fig files, drawGUI.fig and popGUI.fig.

Problem 1: Create a GUI sketchpad

In this problem, you will build a GUI sketchpad that might look something like this when complete:

Part A: Using the Layout Editor to lay out your GUI

To begin, enter guide in the Command Window to start the Layout Editor for the MATLAB Graphical User Interface Development Environment. A GUIDE Quick Start window will appear with Blank GUI (Default) selected. Click the OK button. A Layout Editor window will appear (image shown below), titled untitled.fig (when you save your GUI for the first time, name it drawGUI). Select Preferences... from the File menu, and in the Preferences window, check the box labeled Show names in component palette and click the OK button. You are now ready to create your first GUI!

First, you're going to design the physical layout of your sketchpad, using the components listed below. The GUI image above is just a sample -- you are free to layout your own GUI as you wish.

Axes: drawing window
Popup Menu: menu to select square, circle or triangle
Edit Text: text boxes with labels where the user can enter the following information:
- x coordinate of position of new figure
- y coordinate of position of new figure
- size of new figure
- line style for new figure, e.g. g:*
- name of picture
Static Text: text label for picture name
Checkbox: to set linewidth to 1 (if not checked) or 2 (if checked)
Toggle Button: to specify hold on or hold off
Push Button: buttons for each of these actions:
1. plot the new figure
2. undo the last plot
3. close the GUI

For each component, do the following:

drag and resize the component to the desired location and size
double-click on the component to open the Property Inspector to set the following properties for each component:
- the String property specifies the text string that will appear on the component
- the Tag property specifies a name that will be used to refer to this component in your GUI code
- (optional) ForegroundColor, BackgroundColor, FontSize

General tips for working with GUIs

The .m file and .fig files are intertwined:
When you add a new component to the .fig file, the .m is automatically updated to include the new component.
Resizing the whole GUI:
The entire GUI window can be resized by dragging the lower right corners of the full Layout Editor window and the inner layout grid.
Saving your work so far:
Click on the save icon (floppy disk) in the menu bar, or select Save from the File menu. Type drawGUI as the file name. MATLAB will also save the Layout Editor figure as a .fig file, e.g. drawGUI.fig.
Saving and running your GUI:
Click on the green triangle (circled in red below) at the far right end of the menu bar.
Executing the current GUI file:
Type drawGUI in the Command Window, or selecting Run from the Tools menu.
Revisiting this GUI later:
To return to this GUI in the Layout Editor at a later time, enter guide drawGUI.fig in the Command Window

Part B: Writing MATLAB code to add functionality to your GUI components

Once you have your GUI components laid out, you can then modify the drawGUI.m code file to perform actions in response to each of the GUI components. Recall that MATLAB automatically generates code for each GUI component in your drawGUI.m file. First, modify the drawGUI_OpeningFcn function (executed when the GUI is first created) by constructing fields of the handles structure that store all of the information that needs to be shared across the GUI components:

vectors of x and y coordinates for a square with side length 1
vectors of x and y coordinates for a circle of diameter 1
vectors of x and y coordinates for an equilateral triangle with side length 1
vector to store the plots drawn so far (to support the undo operation)

Think carefully when constructing your unit shapes above. The GUI allows for repositioning (the user supplies x and y position) and scaling (the user supplies figure size) of these shapes, so your unit shapes must support these actions.

Your next step is to modify the Callback functions for the components that have an immediate visual effect in your GUI. For example, the plot button has an immediate effect when pressed in the GUI. For the other GUI components that do not have an immediate visual effect (e.g., x position, y position, etc), MATLAB automatically keeps track of the current values of the user-entered strings.

Edit Text component for picture name: modify the Static Text string that appears below the drawing area, using the text that the user entered in the Edit Text box. Remember that you have access to all of the GUI components through the input handles structure and can read and modify the state of these components with the set and get functions.
Toggle Button: set hold on or hold off, depending on the state of this button, and also adjust the text string that appears on this button in the GUI display
Push Button components: for the plot button, call the plot function to plot the selected figure (square, circle or triangle) in the drawing window, using the current settings for the x and y position, size, line style and linewidth. Also modify the field of the handles structure that stores the vector of plots in the current display, in order to support the undo operation. For the undo button, delete the last plot drawn and update the handles structure appropriately. For the close button, execute the following statement: delete(handles.figure1)

Notes:

Remember that every function that modifies the value of a field of the handles structure must include the following statement at the end:
guidata(hObject,handles)
Many Callback functions will remain empty, that is, no action will be performed when the GUI components are used. The GUI component information (e.g. x position) is accessed by using the handles structure from within the Callback function for the plot button.
You can also include printing statements by omitting the semi-colon at the end of any statement that produces a value, or adding calls to the disp function. These values will be printed in the Command Window.

Part C: I think my GUI is done, now what do I do?

Thoroughly test your GUI to make sure it really works.

Nothing to undo?

Check your GUI in the following scenario. If your hold on button is clicked and you plot something, and then click undo, what you just drew should go away. Now, if you click undo again, but there is nothing to undo, a well-designed GUI would handle this scenario gracefully (i.e. without generating MATLAB error messages). Your GUI should handle this scenario gracefully.

View the whole drawing from the beginning

MATLAB's tendency is to show just what you plot and no more. When drawing in a sketchpad, it is often desirable to view the entire drawing canvas for the session. One way to do this is to create a rectangle that has the dimensions of your desired drawing (e.g. 12.5 x 9.25 in the above GUI), and draw that rectangle in white so it is invisible. This will initialize the plotting area to the specified dimensions. Of course, if the user plots something out of that canvas, (e.g. a bird at coordinates (20,20)), then MATLAB will automatically expand the canvas to include the new object.

Design a picture and print a hardcopy

Fully test your GUI by experimenting with many settings. When testing, remember that you should hit the return key after editing any text field of your GUI. When you are convinced your GUI is working well, construct a final picture to submit with your assignment. Print a hard copy of your final picture (see instructions below) to turn in with your assignment.

How to print a hard copy of your final picture in your sketchpad

On a Mac
On a PC

Electronic submission

Be sure to include both the drawGUI.m and drawGUI.fig files in the assign6_programs folder that you submit electronically.

Problem 2: Simulating Population Growth

Population growth refers to how a population increases or decreases over time. This growth is controlled by the birth and death rates of the population. If a population has a constant birth rate over time and is never limited by factors such as food or disease, it exhibits exponential growth, which is captured mathematically by the following equation:

p_t+1 = r * p_t

where p_t is the population in generation t, p_t+1 is the population in generation t+1, and r is the growth rate between generations.

Real populations are limited by factors such as food and disease, creating an upper limit on the size of the population that the environment can support. Ecologists refer to this as the carrying capacity of the environment. The type of growth that occurs in this scenerio is referred to as logistic growth and is captured mathematically by the following equation:

p_t+1 = r * p_t * (K - p_t)/K

where K is the carrying capacity.

In this problem, you will create a GUI based program that allows you to visualize the results of simulating these two types of population growth for different values of the parameters. The following is a sample GUI display for this program, named popGUI (your GUI does not need to be laid out in exactly the same way):

The display area on the left shows two individuals (randomly positioned dots) in an initial population in the first generation. The three text boxes allow the user to enter values for the growth rate, carrying capacity, and number of generations to be simulated. The button labeled logistic is a toggle button that is used to select the exponential or logistic models. The close button closes the window and terminates the program. The remaining three buttons cause the following actions to be performed:

step: simulate one generation of growth using the selected model, add the new individuals (randomly positioned dots) to the population display, and in the display area on the right, graph the populations vs. generations for all of the generations so far
run: simulate multiple generations of growth, using the number of generations that the user entered in the generations textbox. For each generation, perform the actions listed above (add new individuals to the population display and graph the population vs. generation for all of the generations so far). The pause function can be used to create a pause between generations, for example, pause(0.5) creates a half-second pause.
reset: return the program to the state displayed above, where there is just a single generation of two individuals and the display area on the right is cleared

The following display shows the results after a simulation of 25 generations of the logistic growth model:

Some tips on completing your program:

There are two pieces of information that would be helpful to include in the handles structure: the number of generations simulated so far, and a vector of the populations computed for these generations. This information should be initialized in the popGUI_OpeningFcn function and modified in the Callback functions for the step, run and reset buttons.
Again remember to call the guidata function inside any Callback function that modifies the handles structure.
The two display areas (Axes) can be given Tag properties in the same way as other GUI components. The axes function can be used to specify which display area to direct graphing operations. Suppose the display area on the left has the Tag property populationAxes. The following statement will cause graphing operations to be directed to this area:
axes(handles.populationAxes);

Once an axis is specified, all graphing operations (e.g. calls to axis, hold on, hold off, fill, plot, etc.) will be directed to the populationAxes display area.
There is no need to add any code to the Callback functions defined for the three Edit Text boxes
There can be substantial overlap between the code you write in the Callback functions for the step and run buttons. The run button just repeats the actions of a single step multiple times.
Recall that rand(1) can be used to generate a random number between 0 and 1, which can be used to calculate random x and y coordinates for dots in the population display.

Electronic submission

Be sure to include both the popGUI.m and popGUI.fig files in the assign6_programs folder that you submit electronically.