To introduce concepts of object-oriented graphics and direct manipulation and to gain experience designing and implementing a graphics display list.
Project 2 allowed the user to interactively draw shapes, but not to modify them after they were drawn. The only graphical data structure necessary was a backing Pixmap which stored the pixel configuration of the drawing. In this project, you will extend Project 2 to allow manipulation and editing of shape objects. Instead of a backing Pixmap, the state of the figure will be represented by a graphical display list of simple shapes which can be edited interactively using direct manipulation techniques.
Just as in Project 2, shapes can be drawn by setting various drawing modes and using the mouse. In this project we will limit the number of kinds of shapes to the following: Rectangles, Ellipses and Lines (there will be no points, polylines, or free-form lines). Later projects may add new types of shapes.
Like Project 2, a shape can be drawn by selecting a shape tool and dragging the mouse across the screen, using rubber-band drawing to display it as it is being drawn. Unlike Project 2, once a shape has been drawn it may be modified. In particular, it may be moved by grabbing and dragging it with the middle mouse button, it's color attributes may be changed or it can be deleted. Any shape may be selected by picking it with the left mouse button. Selected shapes are highlighted by displaying their control points, which are small black squares located at the four corners of the shape's bounding box. For this project, these control points are for display purposes only, but in future projects they will be used to change the dimensions of the shape. Once an object has been selected, its color attributes may be changed by selecting colors from the color bar. Shapes can be deselected by picking on them a second time with the left mouse button. A selected shape can be deleted by pushing a "delete" button.
The widget layout will be substantially the same as for Project 2. There will be no toolbar items for Points, Freeform and Polyline, but there will be a "select" tool for picking and moving shapes and an additional pushbutton for deleting selected shapes.
For this project, selecting the clear/fill/line "color mode" will follow this specification: there will be a "radio box" with a radio button for each of Clear, Fill, and Line color modes. Selecting a color in the color bar will change the color for the current mode. Selecting a new color mode should cause the color bar to highlight the color for that mode.
If a shape is selected in the drawing, changing the color for a mode will change the color in that mode for the selected shape. The new selected color for that mode will also apply to new shapes drawn with the mode in that color. Example: The user selects a square in the drawing, and the mode is set to line color. If the user clicks on, say, "blue" in the color bar, then the line color for that square will become blue, and also the current line color will be blue.
Students in the graduate section: Graduate students will need to extend the concept of "undo" for project 3. The user should be able to undo the last operation performed. This operation could be adding a shape, deleting a shape, moving a shape, or changing its color. As with project 2, you only need to provide one level of undo; that is, the user can only undo the last operation.
We suggest that you use Project 2 as a starting point. Whether or not you are using C++, you should try to plan your design in an object-oriented way. In particular, you should replace the backing Pixmap data structure with a data structure consisting of a display list of shape nodes. The node object should contain all the information necessary for drawing and interacting with a shape or node. This includes geometric information, graphical attributes, bounding box, control points and state information such as whether or not the node has been selected. When the drawing area receives a "redraw" event it should traverse the node display list, sending a "redraw" message to each node which causes the node to draw its shape. Other events should be handled in a similar way. For example, there might be a "leftButtonDown" message which would be sent to each node in the display list, checking to see if the mouse click was within the bounding box of each node, and setting the "selected" state of the node accordingly.
Hint for Graduate students on "undo": Consider an "Operation" object, which would have all information about an operation, and know how to undo itself.