Qt Lab #2

Eric Lecolinet - Télécom Paris - Dept. INFRES

Useful links

Step 1: Create a new project

Create a new Qt project (to go faster you can copy the source files of the first lab, then add them to the project). So far, the main difference with the previous project is that it will display a widget for drawing shapes instead of text in the central area.

For this purpose, you need to declare and implement a class (in new files .h and .cpp) that inherits from QWidget. For now this class will not do much: it will just have a proper constructor. The default size of a QWidget being null (as widgets' size is by default computed by considering the elements they contain), use the setMinimumSize() method to enforce an adequate size. Create an instance of this class, make it appear in the central area, then compile and test.

Step 2: Drawing a line interactively

Modify your class so that the user can now draw a line interactively:

Note: The drawing should be persistent, meaning that the line must remain visible if you iconify/deiconify the application's window.

Step 3: Specifying graphical attributes

Modify your class and the application in order to make it possible to specify the color, the thickness and the style of the line before drawing it. Make it simple a this stage, for instance you can just provide a small set of colors to the user (e.g. in a menu or as a set of exclusive buttons).

Note: Do not create as many slots as there are possible values (i.e. there should be one slot for changing the color, one for the thickness and one for the style). QActionGroup and QButtonGroup can help, and also allow making a group of actions or buttons exclusive (this is their default behavior but note that they can also be used for groups of non-exclusive items).

Step 4: Drawing other geometric shapes

Modify your source code so that you can now either draw a line, a rectangle, or an ellipse interactively (the user will need to select which shape she wants to draw before drawing it)

Note:: have a look at the next question as you may want to do both simultaneously.

Step 5: Drawing multiple shapes

In the previous questions, the user could only draw one shape. The goal of this question is to make it possible to draw as many shapes as needed. Importantly, the user may wish to draw different shapes with different graphical attributes (e.g. a red line, then a blue ellipse).

Notes:

Step 6: Editing the shapes

The goal of this question is to allow editing the shapes that were previously drawn (by selecting, moving and resizing them, and changing their graphical attributes).

Note: Selecting shapes requires detecting if the mouse is located on the outline of the shape (or, possibly, inside the shape if the shape is closed). This operation is called picking and Qt classes such as QRect, QRectF, QPainterPath, etc. provides methods (intersects(), contains()) that helps this task (Incidentally, note that this is especially helpful when dealing with non trivial shapes such as bezier curves or shape combinations).

Step 7: Using QtDesigner

The goal of this question is to add a control panel to your user interface using Qt Designer. In this panel you will add widgets (e.g. sliders) for controlling graphical attributes in a more sophisticated way than in Step 3. The actual purpose of this step is to learn how to use Qt Designer and how to mix standard widgets classes with your own classes.

Notes:

Step 8: Ask for confirmation before exiting the program

As in Lab #1, make sure that the user cannot exit the program without saving the data (see last question of Lab #1).

Step 9 (optional): Read and save shapes

Following the same principle as in Lab #1, implement a "read" and a "save" slot that perform these operations and connect them to the appropriate buttons or menu items

Note: Qt objects, in particular QPen and QPainterPath are serializable, which ease this task.

Exercice Report

Please follow the following instructions to avoid mistakes and undesirable problems:



Eric Lecolinet - http://www.telecom-paristech.fr/~elc - Telecom ParisTech