hahahFinal Project Principles of Computer Graphics 2010 Project report Student: Umberto Di Staso – 142685 Professor: Raffaele de Amicis 7/8/2010

GENERAL SYSTEM OVERVIEW The project consists in a software that uses a developed library in the Intermediate project to construct complex functionalities.

The functional asked requisites are:

1. Load a picture in background. 2. Generate different kinds of curves using points generated by mouse.

a. Hermite Spline, b. Bezier Spline, c. BSpline, d. Lagrange.

In this way we can isolate the perimeter of the previous loaded picture.

3. Move single points using the mouse drag property. 4. Select multi points and move them together. 5. Curves must be connected to each other. 6. Save the composition of curves in a file. 7. Load the composition of curves saved before. 8. Load a point file ad interpolate the points using the available curves. In this way we can observe the

differences generated when same points are interpolated by different kind curves. 9. Change in real time the kind of curve that interpolates a set of points.

Below we can see the use case diagram that includes the functionality requisites listed before.

Class Diagram:

The application consists in a set of classes connected to a Main class. As we can see, there are two kinds of listeners associated to the principal class:

1. MouseListener: contains the method used to capture mouse events. Thanks to this kind of listener I can intercept events used to add or drag points over the screen.

2. EventListener: core listener of program. It contains all the methods I have used to manage the functionalities provided by JOGL. As we can see, the developed library and some others classes are used in this listener.

There are also some important classes used in the software:

1. Texture: used to generate the texture that I have put in the background of the screen. 2. GUI: generates the Graphical User Interface of the software.

FINAL PROJECT GUI The Graphical User Interface is completely designed by using Swing components. The reason of this choice is simply because I needed objects like buttons, radio buttons and checkboxes to manage the functionalities provided by the application.

As we can see in the image above, the software gives us a large set of choices used for different kinds of operations:

1. Picture canvas: this area is the portion of the screen that is used to visualize the image that we have loaded before, and set, using the mouse, the points in which the set curve will pass.

2. Clear button: this button clears the picture canvas of any curve we have painted before. 3. Curves set: set of curves that we own:

a. Bezier spline, b. Lagrange, c. Hermite spline, d. BSpline.

4. Delete last point: deletes the last point of the last curve. 5. Move points: option used when we want to move the points of a specific curve (set using the

combo box #8). 6. Ctrl select: this option works with the move points option. It allows us to select precise points of a

specific curve, and move it all together.

7. Change curve: this option allows us to change in real time the kind of a set curve. For example, we can change a Bezier spline in a Lagrange and vice versa.

8. Select curve: this combo box is used to set the curve we want to work with. It operates through options 5-6-7.

9. Load image: used to load any image in background. 10. Load a blank image: used to load a white background image. In this way we can observe in a better

manner the result of our curves. 11. Restore default image: thanks to this option, we can restore the default image in background.

Default image is simply a cup. 12. Load point file: with this option we can load a point file from our hard disk. The point file will be

interpolated using the curves showed before. 13. Load a curve: through this option we can restore a curve painted before. When the curve is

restored, we can add points and extend the restored curve. 14. Save curve: produces the file that will be loaded by using the option showed before. 15. Hide points: allow us to hide all points over the screen. Using this option we can see better ours

results.

FINAL PROJECT AT WORK In this section I want to show, using some images, how the system works.

The first image shows how we can isolate the perimeter of the default image using the tools we have.

Now we can hide all points to see better the final result.

The final step is load a blank background image for emphasize the curves.

Next image shows how a curve can be changed in any type of curve using the “change curve” option.

As we have seen, same points can be interpolated by different curves simply by checking the “change curve option”, setting the curve number that we want to change using the combo box and, at last, selecting the final curve. It is possible that a curve can not be changed in another curve, e.g. a BSpline with 3 control points can not be interpolated by a Bezier, because it requires 4 control points. In this case, no changes will be done, and the original BSpline remains the same.

The next picture shows how users can move points in three different ways.

The simplest one is the classic “drag” option. It will be enabled when “move points” is selected, and a single point on the picture is dragged.

If I drag my mouse, starting where there are not pints, multi point selection will be enabled. This option draws a purple rectangle exactly when I click the mouse and ends when I release the left mouse button. The points inside this area will be moved all together.

The last option is called “ctrl selection”. It permits to drag points that are not adjacent, simply by selecting the points that I want to move and drag one of them. When the points are enabled with ctrl selection, they change color, which is really useful because in this way I can see where ctrl selection is enabled.

The last functionality of the system is dedicated to load a point file and interpolate the points using all the curves that I have.

In particular, I when a point file is loaded, the curves that will be generated are:

1. Bezier, 2. Hermite Spline, 3. BSpline with 2-3-4 degree.

No Lagrange curve is used and the motivation is simple: processing this kind of curve with a very high number of points requests too many resources from the pc where the program is running.

Elements of the file points must be listed in this form:

[X, Y]

Where X and Y are the coordinates of a point. For example:

[0.3502722323049001,-0.7918781725888325]

Is a point inserted in to the file enclosed in the project.

As we did before, we can hide all points

It is really interesting to notice that the difference between the three kinds of curves that I have used is minimal: the general path is the same, and there are no relevance differences.

CONCLUSIONS

During the implementation of this project I have used many materials of the library that have been developed during the Intermediate Project. Major problematic was born when the system checked if the number of points that composed any type of curves was correct: different types of curves need different numbers of points. Another variable that can be found is if a curve is painted at first or not.

To better understand this kind of problematic could be useful have a look at the image below.

First curve is a classic Bezier: it requires simply four control points. The second image shows how two curves can be consecutive: at first three points (yellow circle) belong to a Lagrange curve, that does not require a critical number of points, and then three points (blue circle) to a Bezier curve. In this case the Bezier is the second curve, and it uses the last point of the first curve to complete the minimum number of control points that it requires.

However, to solve this kind of problem was necessary only to work out a simple calculation about the number of control points of the curve that the user is drawing, based on the type of the curve.