|
1 /**************************************************************************** |
|
2 ** |
|
3 ** Copyright (C) 2009 Nokia Corporation and/or its subsidiary(-ies). |
|
4 ** All rights reserved. |
|
5 ** Contact: Nokia Corporation (qt-info@nokia.com) |
|
6 ** |
|
7 ** This file is part of the documentation of the Qt Toolkit. |
|
8 ** |
|
9 ** $QT_BEGIN_LICENSE:LGPL$ |
|
10 ** No Commercial Usage |
|
11 ** This file contains pre-release code and may not be distributed. |
|
12 ** You may use this file in accordance with the terms and conditions |
|
13 ** contained in the Technology Preview License Agreement accompanying |
|
14 ** this package. |
|
15 ** |
|
16 ** GNU Lesser General Public License Usage |
|
17 ** Alternatively, this file may be used under the terms of the GNU Lesser |
|
18 ** General Public License version 2.1 as published by the Free Software |
|
19 ** Foundation and appearing in the file LICENSE.LGPL included in the |
|
20 ** packaging of this file. Please review the following information to |
|
21 ** ensure the GNU Lesser General Public License version 2.1 requirements |
|
22 ** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html. |
|
23 ** |
|
24 ** In addition, as a special exception, Nokia gives you certain additional |
|
25 ** rights. These rights are described in the Nokia Qt LGPL Exception |
|
26 ** version 1.1, included in the file LGPL_EXCEPTION.txt in this package. |
|
27 ** |
|
28 ** If you have questions regarding the use of this file, please contact |
|
29 ** Nokia at qt-info@nokia.com. |
|
30 ** |
|
31 ** |
|
32 ** |
|
33 ** |
|
34 ** |
|
35 ** |
|
36 ** |
|
37 ** |
|
38 ** $QT_END_LICENSE$ |
|
39 ** |
|
40 ****************************************************************************/ |
|
41 |
|
42 /*! |
|
43 \page designer-manual.html |
|
44 |
|
45 \title Qt Designer Manual |
|
46 \ingroup qttools |
|
47 \keyword Qt Designer |
|
48 |
|
49 \QD is Qt's tool for designing and building graphical user |
|
50 interfaces (GUIs) from Qt components. You can compose and customize your |
|
51 widgets or dialogs in a what-you-see-is-what-you-get (WYSIWYG) manner, and |
|
52 test them using different styles and resolutions. |
|
53 |
|
54 Widgets and forms created with \QD integrated seamlessly with programmed |
|
55 code, using Qt's signals and slots mechanism, that lets you easily assign |
|
56 behavior to graphical elements. All properties set in \QD can be changed |
|
57 dynamically within the code. Furthermore, features like widget promotion |
|
58 and custom plugins allow you to use your own components with \QD. |
|
59 |
|
60 If you are new to \QD, you can take a look at the |
|
61 \l{Getting To Know Qt Designer} document. For a quick tutorial on how to |
|
62 use \QD, refer to \l{A Quick Start to Qt Designer}. |
|
63 |
|
64 \image designer-multiple-screenshot.png |
|
65 |
|
66 For more information on using \QD, you can take a look at the following |
|
67 links: |
|
68 |
|
69 \list |
|
70 \o \l{Qt Designer's Editing Modes} |
|
71 \list |
|
72 \o \l{Qt Designer's Widget Editing Mode}{Widget Editing Mode} |
|
73 \o \l{Qt Designer's Signals and Slots Editing Mode} |
|
74 {Signals and Slots Editing Mode} |
|
75 \o \l{Qt Designer's Buddy Editing Mode} |
|
76 {Buddy Editing Mode} |
|
77 \o \l{Qt Designer's Tab Order Editing Mode} |
|
78 {Tab Order Editing Mode} |
|
79 \endlist |
|
80 \o \l{Using Layouts in Qt Designer} |
|
81 \o \l{Saving, Previewing and Printing Forms in Qt Designer} |
|
82 \o \l{Using Containers in Qt Designer} |
|
83 \o \l{Creating Main Windows in Qt Designer} |
|
84 \o \l{Editing Resources with Qt Designer} |
|
85 \o \l{Using Stylesheets with Qt Designer} |
|
86 \o \l{Using a Designer UI File in Your Application} |
|
87 \endlist |
|
88 |
|
89 For advanced usage of \QD, you can refer to these links: |
|
90 |
|
91 \list |
|
92 \o \l{Customizing Qt Designer Forms} |
|
93 \o \l{Using Custom Widgets with Qt Designer} |
|
94 \o \l{Creating Custom Widgets for Qt Designer} |
|
95 \o \l{Creating Custom Widget Extensions} |
|
96 \o \l{Qt Designer's UI File Format} |
|
97 \endlist |
|
98 |
|
99 |
|
100 \section1 Legal Notices |
|
101 |
|
102 Some source code in \QD is licensed under specific highly permissive |
|
103 licenses from the original authors. The Qt team gratefully acknowledges |
|
104 these contributions to \QD and all uses of \QD should also acknowledge |
|
105 these contributions and quote the following license statements in an |
|
106 appendix to the documentation. |
|
107 |
|
108 \list |
|
109 \i \l{Implementation of the Recursive Shadow Casting Algorithm in Qt Designer} |
|
110 \endlist |
|
111 */ |
|
112 |
|
113 |
|
114 /*! |
|
115 \page designer-to-know.html |
|
116 \contentspage {Qt Designer Manual}{Contents} |
|
117 |
|
118 |
|
119 \title Getting to Know Qt Designer |
|
120 |
|
121 \tableofcontents |
|
122 |
|
123 \image designer-screenshot.png |
|
124 |
|
125 \section1 Launching Designer |
|
126 |
|
127 The way that you launch \QD depends on your platform: |
|
128 |
|
129 \list |
|
130 \i On Windows, click the Start button, under the \gui Programs submenu, |
|
131 open the \gui{Qt 4} submenu and click \gui Designer. |
|
132 \i On Unix or Linux, you might find a \QD icon on the desktop |
|
133 background or in the desktop start menu under the \gui Programming |
|
134 or \gui Development submenus. You can launch \QD from this icon. |
|
135 Alternatively, you can type \c{designer} in a terminal window. |
|
136 \i On Mac OS X, double click on \QD in \gui Finder. |
|
137 \endlist |
|
138 |
|
139 \section1 The User Interface |
|
140 |
|
141 When used as a standalone application, \QD's user interface can be |
|
142 configured to provide either a multi-window user interface (the default |
|
143 mode), or it can be used in docked window mode. When used from within an |
|
144 integrated development environment (IDE) only the multi-window user |
|
145 interface is available. You can switch modes in the \gui Preferences dialog |
|
146 from the \gui Edit menu. |
|
147 |
|
148 In multi-window mode, you can arrange each of the tool windows to suit your |
|
149 working style. The main window consists of a menu bar, a tool bar, and a |
|
150 widget box that contains the widgets you can use to create your user |
|
151 interface. |
|
152 |
|
153 \target MainWindow |
|
154 \table |
|
155 \row |
|
156 \i \inlineimage designer-main-window.png |
|
157 \i \bold{Qt Designer's Main Window} |
|
158 |
|
159 The menu bar provides all the standard actions for managing forms, |
|
160 using the clipboard, and accessing application-specific help. |
|
161 The current editing mode, the tool windows, and the forms in use can |
|
162 also be accessed via the menu bar. |
|
163 |
|
164 The tool bar displays common actions that are used when editing a form. |
|
165 These are also available via the main menu. |
|
166 |
|
167 The widget box provides common widgets and layouts that are used to |
|
168 design components. These are grouped into categories that reflect their |
|
169 uses or features. |
|
170 \endtable |
|
171 |
|
172 Most features of \QD are accessible via the menu bar, the tool bar, or the |
|
173 widget box. Some features are also available through context menus that can |
|
174 be opened over the form windows. On most platforms, the right mouse is used |
|
175 to open context menus. |
|
176 |
|
177 \target WidgetBox |
|
178 \table |
|
179 \row |
|
180 \i \inlineimage designer-widget-box.png |
|
181 \i \bold{Qt Designer's Widget Box} |
|
182 |
|
183 The widget box provides a selection of standard Qt widgets, layouts, |
|
184 and other objects that can be used to create user interfaces on forms. |
|
185 Each of the categories in the widget box contain widgets with similar |
|
186 uses or related features. |
|
187 |
|
188 \note Since Qt 4.4, new widgets have been included, e.g., |
|
189 QPlainTextEdit, QCommandLinkButton, QScrollArea, QMdiArea, and |
|
190 QWebView. |
|
191 |
|
192 You can display all of the available objects in a category by clicking |
|
193 on the handle next to the category label. When in |
|
194 \l{Qt Designer's Widget Editing Mode}{Widget Editing |
|
195 Mode}, you can add objects to a form by dragging the appropriate items |
|
196 from the widget box onto the form, and dropping them in the required |
|
197 locations. |
|
198 |
|
199 \QD provides a scratch pad feature that allows you to collect |
|
200 frequently used objects in a separate category. The scratch pad |
|
201 category can be filled with any widget currently displayed in a form |
|
202 by dragging them from the form and dropping them onto the widget box. |
|
203 These widgets can be used in the same way as any other widgets, but |
|
204 they can also contain child widgets. Open a context menu over a widget |
|
205 to change its name or remove it from the scratch pad. |
|
206 \endtable |
|
207 |
|
208 |
|
209 \section1 The Concept of Layouts in Qt |
|
210 |
|
211 A layout is used to arrange and manage the elements that make up a user |
|
212 interface. Qt provides a number of classes to automatically handle layouts |
|
213 -- QHBoxLayout, QVBoxLayout, QGridLayout, and QFormLayout. These classes |
|
214 solve the challenge of laying out widgets automatically, providing a user |
|
215 interface that behaves predictably. Fortunately knowledge of the layout |
|
216 classes is not required to arrange widgets with \QD. Instead, select one of |
|
217 the \gui{Lay Out Horizontally}, \gui{Lay Out in a Grid}, etc., options from |
|
218 the context menu. |
|
219 |
|
220 Each Qt widget has a recommended size, known as \l{QWidget::}{sizeHint()}. |
|
221 The layout manager will attempt to resize a widget to meet its size hint. |
|
222 In some cases, there is no need to have a different size. For example, the |
|
223 height of a QLineEdit is always a fixed value, depending on font size and |
|
224 style. In other cases, you may require the size to change, e.g., the width |
|
225 of a QLineEdit or the width and height of item view widgets. This is where |
|
226 the widget size constraints -- \l{QWidget::minimumSize()}{minimumSize} and |
|
227 \l{QWidget::maximumSize()}{maximumSize} constraints come into play. These |
|
228 are properties you can set in the property editor. For example, to override |
|
229 the default \l{QWidget::}{sizeHint()}, simply set |
|
230 \l{QWidget::minimumSize()}{minimumSize} and \l{QWidget::maximumSize()} |
|
231 {maximumSize} to the same value. Alternatively, to use the current size as |
|
232 a size constraint value, choose one of the \gui{Size Constraint} options |
|
233 from the widget's context menu. The layout will then ensure that those |
|
234 constraints are met. To control the size of your widgets via code, you can |
|
235 reimplement \l{QWidget::}{sizeHint()} in your code. |
|
236 |
|
237 The screenshot below shows the breakdown of a basic user interface designed |
|
238 using a grid. The coordinates on the screenshot show the position of each |
|
239 widget within the grid. |
|
240 |
|
241 \image addressbook-tutorial-part3-labeled-layout.png |
|
242 |
|
243 \note Inside the grid, the QPushButton objects are actually nested. The |
|
244 buttons on the right are first placed in a QVBoxLayout; the buttons at the |
|
245 bottom are first placed in a QHBoxLayout. Finally, they are put into |
|
246 coordinates (1,2) and (3,1) of the QGridLayout. |
|
247 |
|
248 To visualize, imagine the layout as a box that shrinks as much as possible, |
|
249 attempting to \e squeeze your widgets in a neat arrangement, and, at the |
|
250 same time, maximize the use of available space. |
|
251 |
|
252 Qt's layouts help when you: |
|
253 |
|
254 \list 1 |
|
255 \i Resize the user face to fit different window sizes. |
|
256 \i Resize elements within the user interface to suit different |
|
257 localizations. |
|
258 \i Arrange elements to adhere to layout guidelines for different |
|
259 platforms. |
|
260 \endlist |
|
261 |
|
262 So, you no longer have to worry about rearranging widgets for different |
|
263 platforms, settings, and languages. |
|
264 |
|
265 The example below shows how different localizations can affect the user |
|
266 interface. When a localization requires more space for longer text strings |
|
267 the Qt layout automatically scales to accommodate this, while ensuring that |
|
268 the user interface looks presentable and still matches the platform |
|
269 guidelines. |
|
270 |
|
271 \table |
|
272 \header |
|
273 \i A Dialog in English |
|
274 \i A Dialog in French |
|
275 \row |
|
276 \i \image designer-english-dialog.png |
|
277 \i \image designer-french-dialog.png |
|
278 \endtable |
|
279 |
|
280 The process of laying out widgets consists of creating the layout hierarchy |
|
281 while setting as few widget size constraints as possible. |
|
282 |
|
283 For a more technical perspective on Qt's layout classes, refer to the |
|
284 \l{Layout Management} documentation. |
|
285 */ |
|
286 |
|
287 |
|
288 /*! |
|
289 \page designer-quick-start.html |
|
290 \contentspage {Qt Designer Manual}{Contents} |
|
291 |
|
292 |
|
293 \title A Quick Start to Qt Designer |
|
294 |
|
295 Using \QD involves \bold four basic steps: |
|
296 |
|
297 \list 1 |
|
298 \o Choose your form and objects |
|
299 \o Lay the objects out on the form |
|
300 \o Connect the signals to the slots |
|
301 \o Preview the form |
|
302 \endlist |
|
303 |
|
304 \image rgbController-screenshot.png |
|
305 |
|
306 Suppose you would like to design a small widget (see screenshot above) that |
|
307 contains the controls needed to manipulate Red, Green and Blue (RGB) values |
|
308 -- a type of widget that can be seen everywhere in image manipulation |
|
309 programs. |
|
310 |
|
311 \table |
|
312 \row |
|
313 \i \inlineimage designer-choosing-form.png |
|
314 \i \bold{Choosing a Form} |
|
315 |
|
316 You start by choosing \gui Widget from the \gui{New Form} dialog. |
|
317 \endtable |
|
318 |
|
319 |
|
320 \table |
|
321 \row |
|
322 \i \inlineimage rgbController-arrangement.png |
|
323 \i \bold{Placing Widgets on a Form} |
|
324 |
|
325 Drag three labels, three spin boxes and three vertical sliders on to your |
|
326 form. To change the label's default text, simply double-click on it. You |
|
327 can arrange them according to how you would like them to be laid out. |
|
328 \endtable |
|
329 |
|
330 To ensure that they are laid out exactly like this in your program, you |
|
331 need to place these widgets into a layout. We will do this in groups of |
|
332 three. Select the "RED" label. Then, hold down \key Ctrl while you select |
|
333 its corresponding spin box and slider. In the \gui{Form} menu, select |
|
334 \gui{Lay Out in a Grid}. |
|
335 |
|
336 \table |
|
337 \row |
|
338 \i \inlineimage rgbController-form-gridLayout.png |
|
339 \i \inlineimage rgbController-selectForLayout.png |
|
340 \endtable |
|
341 |
|
342 |
|
343 Repeat the step for the other two labels along with their corresponding |
|
344 spin boxes and sliders as well. |
|
345 |
|
346 The next step is to combine all three layouts into one \bold{main layout}. |
|
347 The main layout is the top level widget's (in this case, the QWidget) |
|
348 layout. It is important that your top level widget has a layout; otherwise, |
|
349 the widgets on your window will not resize when your window is resized. To |
|
350 set the layout, \gui{Right click} anywhere on your form, outside of the |
|
351 three separate layouts, and select \gui{Lay Out Horizontally}. |
|
352 Alternatively, you could also select \gui{Lay Out in a Grid} -- you will |
|
353 still see the same arrangement (shown below). |
|
354 |
|
355 \image rgbController-final-layout.png |
|
356 |
|
357 \note Main layouts cannot be seen on the form. To check if you have a main |
|
358 layout installed, try resizing your form; your widgets should resize |
|
359 accordingly. Alternatively, you can take a look at \QD's |
|
360 \gui{Object Inspector}. If your top level widget does not have a layout, |
|
361 you will see the broken layout icon next to it, |
|
362 \inlineimage rgbController-no-toplevel-layout.png |
|
363 . |
|
364 |
|
365 When you click on the slider and drag it to a certain value, you want the |
|
366 spin box to display the slider's position. To accomplish this behavior, you |
|
367 need to connect the slider's \l{QAbstractSlider::}{valueChanged()} signal |
|
368 to the spin box's \l{QSpinBox::}{setValue()} slot. You also need to make |
|
369 the reverse connections, e.g., connect the spin box's \l{QSpinBox::} |
|
370 {valueChanged()} signal to the slider's \l{QAbstractSlider::value()} |
|
371 {setValue()} slot. |
|
372 |
|
373 To do this, you have to switch to \gui{Edit Signals/Slots} mode, either by |
|
374 pressing \key{F4} or something \gui{Edit Signals/Slots} from the \gui{Edit} |
|
375 menu. |
|
376 |
|
377 \table |
|
378 \row |
|
379 \i \inlineimage rgbController-signalsAndSlots.png |
|
380 \i \bold{Connecting Signals to Slots} |
|
381 |
|
382 Click on the slider and drag the cursor towards the spin box. The |
|
383 \gui{Configure Connection} dialog, shown below, will pop up. Select the |
|
384 correct signal and slot and click \gui OK. |
|
385 \endtable |
|
386 |
|
387 \image rgbController-configure-connection1.png |
|
388 |
|
389 Repeat the step (in reverse order), clicking on the spin box and dragging |
|
390 the cursor towards the slider, to connect the spin box's |
|
391 \l{QSpinBox::}{valueChanged()} signal to the slider's |
|
392 \l{QAbstractSlider::value()}{setValue()} slot. |
|
393 |
|
394 You can use the screenshot below as a guide to selecting the correct signal |
|
395 and slot. |
|
396 |
|
397 \image rgbController-configure-connection2.png |
|
398 |
|
399 Now that you have successfully connected the objects for the "RED" |
|
400 component of the RGB Controller, do the same for the "GREEN" and "BLUE" |
|
401 components as well. |
|
402 |
|
403 Since RGB values range between 0 and 255, we need to limit the spin box |
|
404 and slider to that particular range. |
|
405 |
|
406 \table |
|
407 \row |
|
408 \i \inlineimage rgbController-property-editing.png |
|
409 \i \bold{Setting Widget Properties} |
|
410 |
|
411 Click on the first spin box. Within the \gui{Property Editor}, you will |
|
412 see \l{QSpinBox}'s properties. Enter "255" for the |
|
413 \l{QSpinBox::}{maximum} property. Then, click on the first vertical |
|
414 slider, you will see \l{QAbstractSlider}'s properties. Enter "255" for |
|
415 the \l{QAbstractSlider::}{maximum} property as well. Repeat this |
|
416 process for the remaining spin boxes and sliders. |
|
417 \endtable |
|
418 |
|
419 Now, we preview your form to see how it would look in your application - |
|
420 press \key{Ctrl + R} or select \gui Preview from the \gui Form menu. Try |
|
421 dragging the slider - the spin box will mirror its value too (and vice |
|
422 versa). Also, you can resize it to see how the layouts that are used to |
|
423 manage the child widgets, respond to different window sizes. |
|
424 */ |
|
425 |
|
426 |
|
427 /*! |
|
428 \page designer-editing-mode.html |
|
429 \previouspage Getting to Know Qt Designer |
|
430 \contentspage {Qt Designer Manual}{Contents} |
|
431 \nextpage Using Layouts in Qt Designer |
|
432 |
|
433 \title Qt Designer's Editing Modes |
|
434 |
|
435 \QD provides four editing modes: \l{Qt Designer's Widget Editing Mode} |
|
436 {Widget Editing Mode}, \l{Qt Designer's Signals and Slots Editing Mode} |
|
437 {Signals and Slots Editing Mode}, \l{Qt Designer's Buddy Editing Mode} |
|
438 {Buddy Editing Mode} and \l{Qt Designer's Tab Order Editing Mode} |
|
439 {Tab Order Editing Mode}. When working with \QD, you will always be in one |
|
440 of these four modes. To switch between modes, simply select it from the |
|
441 \gui{Edit} menu or the toolbar. The table below describes these modes in |
|
442 further detail. |
|
443 |
|
444 \table |
|
445 \header \i \i \bold{Editing Modes} |
|
446 \row |
|
447 \i \inlineimage designer-widget-tool.png |
|
448 \i In \l{Qt Designer's Widget Editing Mode}{Edit} mode, we can |
|
449 change the appearance of the form, add layouts, and edit the |
|
450 properties of each widget. To switch to this mode, press |
|
451 \key{F3}. This is \QD's default mode. |
|
452 |
|
453 \row |
|
454 \i \inlineimage designer-connection-tool.png |
|
455 \i In \l{Qt Designer's Signals and Slots Editing Mode} |
|
456 {Signals and Slots} mode, we can connect widgets together using |
|
457 Qt's signals and slots mechanism. To switch to this mode, press |
|
458 \key{F4}. |
|
459 |
|
460 \row |
|
461 \i \inlineimage designer-buddy-tool.png |
|
462 \i In \l{Qt Designer's Buddy Editing Mode}{Buddy Editing Mode}, |
|
463 buddy widgets can be assigned to label widgets to help them |
|
464 handle keyboard focus correctly. |
|
465 |
|
466 \row |
|
467 \i \inlineimage designer-tab-order-tool.png |
|
468 \i In \l{Qt Designer's Tab Order Editing Mode} |
|
469 {Tab Order Editing Mode}, we can set the order in which widgets |
|
470 receive the keyboard focus. |
|
471 \endtable |
|
472 |
|
473 */ |
|
474 |
|
475 |
|
476 /*! |
|
477 \page designer-widget-mode.html |
|
478 \previouspage Qt Designer's Editing Modes |
|
479 \contentspage {Qt Designer Manual}{Contents} |
|
480 \nextpage Qt Designer's Signals and Slots Editing Mode |
|
481 |
|
482 \title Qt Designer's Widget Editing Mode |
|
483 |
|
484 \image designer-editing-mode.png |
|
485 |
|
486 In the Widget Editing Mode, objects can be dragged from the main window's |
|
487 widget box to a form, edited, resized, dragged around on the form, and even |
|
488 dragged between forms. Object properties can be modified interactively, so |
|
489 that changes can be seen immediately. The editing interface is intuitive |
|
490 for simple operations, yet it still supports Qt's powerful layout |
|
491 facilities. |
|
492 |
|
493 |
|
494 \tableofcontents |
|
495 |
|
496 To create and edit new forms, open the \gui File menu and select |
|
497 \gui{New Form...} or press \key{Ctrl+N}. Existing forms can also be edited |
|
498 by selecting \gui{Open Form...} from the \gui File menu or pressing |
|
499 \key{Ctrl+O}. |
|
500 |
|
501 At any point, you can save your form by selecting the \gui{Save From As...} |
|
502 option from the \gui File menu. The UI files saved by \QD contain |
|
503 information about the objects used, and any details of signal and slot |
|
504 connections between them. |
|
505 |
|
506 |
|
507 \section1 Editing A Form |
|
508 |
|
509 By default, new forms are opened in widget editing mode. To switch to Edit |
|
510 mode from another mode, select \gui{Edit Widgets} from the \gui Edit menu |
|
511 or press the \key F3 key. |
|
512 |
|
513 Objects are added to the form by dragging them from the main widget box |
|
514 and dropping them in the desired location on the form. Once there, they |
|
515 can be moved around simply by dragging them, or using the cursor keys. |
|
516 Pressing the \key Ctrl key at the same time moves the selected widget |
|
517 pixel by pixel, while using the cursor keys alone make the selected widget |
|
518 snap to the grid when it is moved. Objects can be selected by clicking on |
|
519 them with the left mouse button. You can also use the \key Tab key to |
|
520 change the selection. |
|
521 |
|
522 ### Screenshot of widget box, again |
|
523 |
|
524 The widget box contains objects in a number of different categories, all of |
|
525 which can be placed on the form as required. The only objects that require |
|
526 a little more preparation are the \gui Container widgets. These are |
|
527 described in further detail in the \l{Using Containers in Qt Designer} |
|
528 chapter. |
|
529 |
|
530 |
|
531 \target SelectingObjects |
|
532 \table |
|
533 \row |
|
534 \i \inlineimage designer-selecting-widget.png |
|
535 \i \bold{Selecting Objects} |
|
536 |
|
537 Objects on the form are selected by clicking on them with the left |
|
538 mouse button. When an object is selected, resize handles are shown at |
|
539 each corner and the midpoint of each side, indicating that it can be |
|
540 resized. |
|
541 |
|
542 To select additional objects, hold down the \key Shift key and click on |
|
543 them. If more than one object is selected, the current object will be |
|
544 displayed with resize handles of a different color. |
|
545 |
|
546 To move a widget within a layout, hold down \key Shift and \key Control |
|
547 while dragging the widget. This extends the selection to the widget's |
|
548 parent layout. |
|
549 |
|
550 Alternatively, objects can be selected in the |
|
551 \l{The Object Inspector}{Object Inspector}. |
|
552 \endtable |
|
553 |
|
554 When a widget is selected, normal clipboard operations such as cut, copy, |
|
555 and paste can be performed on it. All of these operations can be done and |
|
556 undone, as necessary. |
|
557 |
|
558 The following shortcuts can be used: |
|
559 |
|
560 \target ShortcutsForEditing |
|
561 \table |
|
562 \header \i Action \i Shortcut \i Description |
|
563 \row |
|
564 \i Cut |
|
565 \i \key{Ctrl+X} |
|
566 \i Cuts the selected objects to the clipboard. |
|
567 \row |
|
568 \i Copy |
|
569 \i \key{Ctrl+C} |
|
570 \i Copies the selected objects to the clipboard. |
|
571 \row |
|
572 \i Paste |
|
573 \i \key{Ctrl+V} |
|
574 \i Pastes the objects in the clipboard onto the form. |
|
575 \row |
|
576 \i Delete |
|
577 \i \key Delete |
|
578 \i Deletes the selected objects. |
|
579 \row |
|
580 \i Clone object |
|
581 \i \key{Ctrl+drag} (leftmouse button) |
|
582 \i Makes a copy of the selected object or group of objects. |
|
583 \row |
|
584 \i Preview |
|
585 \i \key{Ctrl+R} |
|
586 \i Shows a preview of the form. |
|
587 \endtable |
|
588 |
|
589 All of the above actions (apart from cloning) can be accessed via both the |
|
590 \gui Edit menu and the form's context menu. These menus also provide |
|
591 funcitons for laying out objects as well as a \gui{Select All} function to |
|
592 select all the objects on the form. |
|
593 |
|
594 Widgets are not unique objects; you can make as many copies of them as you |
|
595 need. To quickly duplicate a widget, you can clone it by holding down the |
|
596 \key Ctrl key and dragging it. This allows widgets to be copied and placed |
|
597 on the form more quickly than with clipboard operations. |
|
598 |
|
599 |
|
600 \target DragAndDrop |
|
601 \table |
|
602 \row |
|
603 \i \inlineimage designer-dragging-onto-form.png |
|
604 \i \bold{Drag and Drop} |
|
605 |
|
606 \QD makes extensive use of the drag and drop facilities provided by Qt. |
|
607 Widgets can be dragged from the widget box and dropped onto the form. |
|
608 |
|
609 Widgets can also be "cloned" on the form: Holding down \key Ctrl and |
|
610 dragging the widget creates a copy of the widget that can be dragged to |
|
611 a new position. |
|
612 |
|
613 It is also possible to drop Widgets onto the \l {The Object Inspector} |
|
614 {Object Inspector} to handle nested layouts easily. |
|
615 \endtable |
|
616 |
|
617 \QD allows selections of objects to be copied, pasted, and dragged between |
|
618 forms. You can use this feature to create more than one copy of the same |
|
619 form, and experiment with different layouts in each of them. |
|
620 |
|
621 |
|
622 \section2 The Property Editor |
|
623 |
|
624 The Property Editor always displays properties of the currently selected |
|
625 object on the form. The available properties depend on the object being |
|
626 edited, but all of the widgets provided have common properties such as |
|
627 \l{QObject::}{objectName}, the object's internal name, and |
|
628 \l{QWidget::}{enabled}, the property that determines whether an |
|
629 object can be interacted with or not. |
|
630 |
|
631 |
|
632 \target EditingProperties |
|
633 \table |
|
634 \row |
|
635 \i \inlineimage designer-property-editor.png |
|
636 \i \bold{Editing Properties} |
|
637 |
|
638 The property editor uses standard Qt input widgets to manage the |
|
639 properties of jbects on the form. Textual properties are shown in line |
|
640 edits, integer properties are displayed in spinboxes, boolean |
|
641 properties are displayed in check boxes, and compound properties such |
|
642 as colors and sizes are presented in drop-down lists of input widgets. |
|
643 |
|
644 Modified properties are indicated with bold labels. To reset them, click |
|
645 the arrow button on the right. |
|
646 |
|
647 Changes in properties are applied to all selected objects that have the |
|
648 same property. |
|
649 \endtable |
|
650 |
|
651 Certain properties are treated specially by the property editor: |
|
652 |
|
653 \list |
|
654 \o Compound properties -- properties that are made up of more than one |
|
655 value -- are represented as nodes that can be expanded, allowing |
|
656 their values to be edited. |
|
657 \o Properties that contain a choice or selection of flags are edited |
|
658 via combo boxes with checkable items. |
|
659 \o Properties that allow access to rich data types, such as QPalette, |
|
660 are modified using dialogs that open when the properties are edited. |
|
661 QLabel and the widgets in the \gui Buttons section of the widget box |
|
662 have a \c text property that can also be edited by double-clicking |
|
663 on the widget or by pressing \gui F2. \QD interprets the backslash |
|
664 (\\) character specially, enabling newline (\\n) characters to be |
|
665 inserted into the text; the \\\\ character sequence is used to |
|
666 insert a single backslash into the text. A context menu can also be |
|
667 opened while editing, providing another way to insert special |
|
668 characters and newlines into the text. |
|
669 \endlist |
|
670 |
|
671 |
|
672 \section2 Dynamic Properties |
|
673 |
|
674 The property editor can also be used to add new |
|
675 \l{QObject#Dynamic Properties}{dynamic properties} to both standard Qt |
|
676 widgets and to forms themselves. Since Qt 4.4, dynamic properties are added |
|
677 and removed via the property editor's toolbar, shown below. |
|
678 |
|
679 \image designer-property-editor-toolbar.png |
|
680 |
|
681 To add a dynamic property, clcik on the \gui Add button |
|
682 \inlineimage designer-property-editor-add-dynamic.png |
|
683 . To remove it, click on the \gui Remove button |
|
684 \inlineimage designer-property-editor-remove-dynamic.png |
|
685 instead. You can also sort the properties alphabetically and change the |
|
686 color groups by clickinig on the \gui Configure button |
|
687 \inlineimage designer-property-editor-configure.png |
|
688 . |
|
689 |
|
690 \section2 The Object Inspector |
|
691 \table |
|
692 \row |
|
693 \i \inlineimage designer-object-inspector.png |
|
694 \i \bold{The Object Inspector} |
|
695 |
|
696 The \gui{Object Inspector} displays a hierarchical list of all the |
|
697 objects on the form that is currently being edited. To show the child |
|
698 objects of a container widget or a layout, click the handle next to the |
|
699 object label. |
|
700 |
|
701 Each object on a form can be selected by clicking on the corresponding |
|
702 item in the \gui{Object Inspector}. Right-clicking opens the form's |
|
703 context menu. These features can be useful if you have many overlapping |
|
704 objects. To locate an object in the \gui{Object Inspector}, use |
|
705 \key{Ctrl+F}. |
|
706 |
|
707 Since Qt 4.4, double-clicking on the object's name allows you to change |
|
708 the object's name with the in-place editor. |
|
709 |
|
710 Since Qt 4.5, the \gui{Object Inspector} displays the layout state of |
|
711 the containers. The broken layout icon ###ICON is displayed if there is |
|
712 something wrong with the layouts. |
|
713 |
|
714 \endtable |
|
715 */ |
|
716 |
|
717 |
|
718 /*! |
|
719 \page designer-layouts.html |
|
720 \previouspage Qt Designer's Widget Editing Mode |
|
721 \contentspage |
|
722 \nextpage Qt Designer's Signals and Slots Editing Mode |
|
723 |
|
724 \title Using Layouts in Qt Designer |
|
725 |
|
726 Before a form can be used, the objects on the form need to be placed into |
|
727 layouts. This ensures that the objects will be displayed properly when the |
|
728 form is previewed or used in an application. Placing objects in a layout |
|
729 also ensures that they will be resized correctly when the form is resized. |
|
730 |
|
731 |
|
732 \tableofcontents |
|
733 |
|
734 \section1 Applying and Breaking Layouts |
|
735 |
|
736 The simplest way to manage objects is to apply a layout to a group of |
|
737 existing objects. This is achieved by selecting the objects that you need |
|
738 to manage and applying one of the standard layouts using the main toolbar, |
|
739 the \gui Form menu, or the form's context menu. |
|
740 |
|
741 Once widgets have been inserted into a layout, it is not possible to move |
|
742 and resize them individually because the layout itself controls the |
|
743 geometry of each widget within it, taking account of the hints provided by |
|
744 spacers. Instead, you must either break the layout and adjust each object's |
|
745 geometry manually, or you can influence the widget's geometry by resizing |
|
746 the layout. |
|
747 |
|
748 To break the layout, press \key{Ctrl+0} or choose \gui{Break Layout} from |
|
749 the form's context menu, the \gui Form menu or the main toolbar. You can |
|
750 also add and remove spacers from the layout to influence the geometries of |
|
751 the widgets. |
|
752 |
|
753 |
|
754 \target InsertingObjectsIntoALayout |
|
755 \table |
|
756 \row |
|
757 \i \inlineimage designer-layout-inserting.png |
|
758 \i \bold{Inserting Objects into a Layout} |
|
759 |
|
760 Objects can be inserted into an existing layout by dragging them from |
|
761 their current positions and dropping them at the required location. A |
|
762 blue cursor is displayed in the layout as an object is dragged over |
|
763 it to indicate where the object will be added. |
|
764 \endtable |
|
765 |
|
766 |
|
767 \section2 Setting A Top Level Layout |
|
768 |
|
769 The form's top level layout can be set by clearing the slection (click the |
|
770 left mouse button on the form itself) and applying a layout. A top level |
|
771 layout is necessary to ensure that your widgets will resize correctly when |
|
772 its window is resized. To check if you have set a top level layout, preview |
|
773 your widget and attempt to resize the window by dragging the size grip. |
|
774 |
|
775 \table |
|
776 \row |
|
777 \i \inlineimage designer-set-layout.png |
|
778 \i \bold{Applying a Layout} |
|
779 |
|
780 To apply a layout, you can select your choice of layout from the |
|
781 toolbar shown on the left, or from the context menu shown below. |
|
782 \endtable |
|
783 |
|
784 \image designer-set-layout2.png |
|
785 |
|
786 |
|
787 \section2 Horizontal and Vertical Layouts |
|
788 |
|
789 The simplest way to arrange objects on a form is to place them in a |
|
790 horizontal or vertical layout. Horizontal layouts ensure that the widgets |
|
791 within are aligned horizontally; vertical layouts ensure that they are |
|
792 aligned vertically. |
|
793 |
|
794 Horizontal and vertical layouts can be combined and nested to any depth. |
|
795 However, if you need more control over the placement of objects, consider |
|
796 using the grid layout. |
|
797 |
|
798 |
|
799 \section3 The Grid Layout |
|
800 |
|
801 Complex form layouts can be created by placing objects in a grid layout. |
|
802 This kind of layout gives the form designer much more freedom to arrange |
|
803 widgets on the form, but can result in a much less flexible layout. |
|
804 However, for some kinds of form layout, a grid arrangement is much more |
|
805 suitable than a nested arrangement of horizontal and vertical layouts. |
|
806 |
|
807 |
|
808 \section3 Splitter Layouts |
|
809 |
|
810 Another common way to manage the layout of objects on a form is to place |
|
811 them in a splitter. These splitters arrange the objects horizontally or |
|
812 vertically in the same way as normal layouts, but also allow the user to |
|
813 adjust the amount of space allocated to each object. |
|
814 |
|
815 \image designer-splitter-layout.png |
|
816 |
|
817 Although QSplitter is a container widget, \QD treats splitter objects as |
|
818 layouts that are applied to existing widgets. To place a group of widgets |
|
819 into a splitter, select them |
|
820 \l{Qt Designer's Widget Editing Mode#SelectingObjects}{as described here} |
|
821 then apply the splitter layout by using the appropriate toolbar button, |
|
822 keyboard shortcut, or \gui{Lay out} context menu entry. |
|
823 |
|
824 |
|
825 \section3 The Form Layout |
|
826 |
|
827 Since Qt 4.4, another layout class has been included -- QFormLayout. This |
|
828 class manages widgets in a two-column form; the left column holds labels |
|
829 and the right column holds field widgets such as line edits, spin boxes, |
|
830 etc. The QFormLayout class adheres to various platform look and feel |
|
831 guidelines and supports wrapping for long rows. |
|
832 |
|
833 \image designer-form-layout.png |
|
834 |
|
835 The UI file above results in the previews shown below. |
|
836 |
|
837 \table |
|
838 \header |
|
839 \i Windows XP |
|
840 \i Mac OS X |
|
841 \i Cleanlooks |
|
842 \row |
|
843 \i \inlineimage designer-form-layout-windowsXP.png |
|
844 \i \inlineimage designer-form-layout-macintosh.png |
|
845 \i \inlineimage designer-form-layout-cleanlooks.png |
|
846 \endtable |
|
847 |
|
848 |
|
849 \section2 Shortcut Keys |
|
850 |
|
851 In addition to the standard toolbar and context menu entries, there is also |
|
852 a set of keyboard shortcuts to apply layouts on widgets. |
|
853 |
|
854 \target LayoutShortcuts |
|
855 \table |
|
856 \header |
|
857 \i Layout |
|
858 \i Shortcut |
|
859 \i Description |
|
860 \row |
|
861 \i Horizontal |
|
862 \i \key{Ctrl+1} |
|
863 \i Places the selected objects in a horizontal layout. |
|
864 \row |
|
865 \i Vertical |
|
866 \i \key{Ctrl+2} |
|
867 \i Places the selected objects in a vertical layout. |
|
868 \row |
|
869 \i Grid |
|
870 \i \key{Ctrl+5} |
|
871 \i Places the selected objects in a grid layout. |
|
872 \row |
|
873 \i Form |
|
874 \i \key{Ctrl+6} |
|
875 \i Places the selected objects in a form layout. |
|
876 \row |
|
877 \i Horizontal splitter |
|
878 \i \key{Ctrl+3} |
|
879 \i Creates a horizontal splitter and places the selected objects |
|
880 inside it. |
|
881 \row |
|
882 \i Vertical splitter |
|
883 \i \key{Ctrl+4} |
|
884 \i Creates a vertical splitter and places the selected objects |
|
885 inside it. |
|
886 \row |
|
887 \i Adjust size |
|
888 \i \key{Ctrl+J} |
|
889 \i Adjusts the size of the layout to ensure that each child object |
|
890 has sufficient space to display its contents. See |
|
891 QWidget::adjustSize() for more information. |
|
892 \endtable |
|
893 |
|
894 \note \key{Ctrl+0} is used to break a layout. |
|
895 |
|
896 */ |
|
897 |
|
898 |
|
899 /*! |
|
900 \page designer-preview.html |
|
901 \contentspage {Qt Designer Manual}{Contents} |
|
902 \previouspage Using Layouts in Qt Designer |
|
903 \nextpage Qt Designer's Buddy Editing Mode |
|
904 \title Saving, Previewing and Printing Forms in Qt Designer |
|
905 |
|
906 Although \QD's forms are accurate representations of the components being |
|
907 edited, it is useful to preview the final appearance while editing. This |
|
908 feature can be activated by opening the \gui Form menu and selecting |
|
909 \gui Preview, or by pressing \key{Ctrl+R} when in the form. |
|
910 |
|
911 \image designer-dialog-preview.png |
|
912 |
|
913 The preview shows exactly what the final component will look like when used |
|
914 in an application. |
|
915 |
|
916 Since Qt 4.4, it is possible to preview forms with various skins - default |
|
917 skins, skins created with Qt Style Sheets or device skins. This feature |
|
918 simulates the effect of calling \c{QApplication::setStyleSheet()} in the |
|
919 application. |
|
920 |
|
921 To preview your form with skins, open the \gui Edit menu and select |
|
922 \gui{Preferences...} |
|
923 |
|
924 You will see the dialog shown below: |
|
925 |
|
926 \image designer-preview-style.png |
|
927 |
|
928 The \gui{Print/Preview Configuration} checkbox must be checked to activate |
|
929 previews of skins. You can select the styles provided from the \gui{Style} |
|
930 drop-down box. |
|
931 |
|
932 \image designer-preview-style-selection.png |
|
933 |
|
934 Alternatively, you can preview custom style sheet created with Qt Style |
|
935 Sheets. The figure below shows an example of Qt Style Sheet syntax and the |
|
936 corresponding output. |
|
937 |
|
938 \image designer-preview-stylesheet.png |
|
939 |
|
940 Another option would be to preview your form with device skins. A list of |
|
941 generic device skins are available in \QD, however, you may also use |
|
942 other QVFB skins with the \gui{Browse...} option. |
|
943 |
|
944 \image designer-preview-deviceskin-selection.png |
|
945 |
|
946 |
|
947 \section1 Viewing the Form's Code |
|
948 |
|
949 Since Qt 4.4, it is possible to view code generated by the User Interface |
|
950 Compiler (uic) for the \QD form. |
|
951 |
|
952 \image designer-form-viewcode.png |
|
953 |
|
954 Select \gui{View Code...} from the \gui{Form} menu and a dialog with the |
|
955 generated code will be displayed. The screenshot below is an example of |
|
956 code generated by the \c{uic}. |
|
957 |
|
958 \image designer-code-viewer.png |
|
959 |
|
960 \section1 Saving and Printing the Form |
|
961 |
|
962 Forms created in \QD can be saved to an image or printed. |
|
963 |
|
964 \table |
|
965 \row |
|
966 \i \inlineimage designer-file-menu.png |
|
967 \i \bold{Saving Forms} |
|
968 |
|
969 To save a form as an image, choose the \gui{Save Image...} option. The file |
|
970 will be saved in \c{.png} format. |
|
971 |
|
972 \bold{Printing Forms} |
|
973 |
|
974 To print a form, select the \gui{Print...} option. |
|
975 |
|
976 \endtable |
|
977 */ |
|
978 |
|
979 |
|
980 /*! |
|
981 \page designer-connection-mode.html |
|
982 \contentspage {Qt Designer Manual}{Contents} |
|
983 \previouspage Using Layouts in Qt Designer |
|
984 \nextpage Qt Designer's Buddy Editing Mode |
|
985 |
|
986 |
|
987 \title Qt Designer's Signals and Slots Editing Mode |
|
988 |
|
989 \image designer-connection-mode.png |
|
990 |
|
991 In \QD's signals and slots editing mode, you can connect objects in a form |
|
992 together using Qt's signals and slots mechanism. Both widgets and layouts |
|
993 can be connected via an intuitive connection interface, using the menu of |
|
994 compatible signals and slots provided by \QD. When a form is saved, all |
|
995 connections are preserved so that they will be ready for use when your |
|
996 project is built. |
|
997 |
|
998 |
|
999 \tableofcontents |
|
1000 |
|
1001 For more information on Qt's signals and sltos mechanism, refer to the |
|
1002 \l{Signals and Slots} document. |
|
1003 |
|
1004 |
|
1005 \section1 Connecting Objects |
|
1006 |
|
1007 To begin connecting objects, enter the signals and slots editing mode by |
|
1008 opening the \gui Edit menu and selecting \gui{Edit Signals/Slots}, or by |
|
1009 pressing the \key F4 key. |
|
1010 |
|
1011 All widgets and layouts on the form can be connected together. However, |
|
1012 spacers just provide spacing hints to layouts, so they cannot be connected |
|
1013 to other objects. |
|
1014 |
|
1015 |
|
1016 \target HighlightedObjects |
|
1017 \table |
|
1018 \row |
|
1019 \i \inlineimage designer-connection-highlight.png |
|
1020 \i \bold{Highlighted Objects} |
|
1021 |
|
1022 When the cursor is over an object that can be used in a connection, the |
|
1023 object will be highlighted. |
|
1024 \endtable |
|
1025 |
|
1026 To make a connectionn, press the left mouse button and drag the cursor |
|
1027 towards the object you want to connect it to. As you do this, a line will |
|
1028 extend from the source object to the cursor. If the cursor is over another |
|
1029 object on the form, the line will end with an arrow head that points to the |
|
1030 destination object. This indicates that a connection will be made between |
|
1031 the two objects when you release the mouse button. |
|
1032 |
|
1033 You can abandon the connection at any point while you are dragging the |
|
1034 connection path by pressing \key{Esc}. |
|
1035 |
|
1036 \target MakingAConnection |
|
1037 \table |
|
1038 \row |
|
1039 \i \inlineimage designer-connection-making.png |
|
1040 \i \bold{Making a Connection} |
|
1041 |
|
1042 The connection path will change its shape as the cursor moves around |
|
1043 the form. As it passes over objects, they are highlighted, indicating |
|
1044 that they can be used in a signal and slot connection. Release the |
|
1045 mouse button to make the connection. |
|
1046 \endtable |
|
1047 |
|
1048 The \gui{Configure Connection} dialog (below) is displayed, showing signals |
|
1049 from the source object and slots from the destination object that you can |
|
1050 use. |
|
1051 |
|
1052 \image designer-connection-dialog.png |
|
1053 |
|
1054 To complete the connection, select a signal from the source object and a |
|
1055 slot from the destination object, then click \key OK. Click \key Cancel if |
|
1056 you wish to abandon the connection. |
|
1057 |
|
1058 \note If the \gui{Show all signals and slots} checkbox is selected, all |
|
1059 available signals from the source object will be shown. Otherwise, the |
|
1060 signals and slots inherited from QWidget will be hidden. |
|
1061 |
|
1062 You can make as many connections as you like between objects on the form; |
|
1063 it is possible to connect signals from objects to slots in the form itself. |
|
1064 As a result, the signal and slot connections in many dialogs can be |
|
1065 completely configured from within \QD. |
|
1066 |
|
1067 \target ConnectingToTheForm |
|
1068 \table |
|
1069 \row |
|
1070 \i \inlineimage designer-connection-to-form.png |
|
1071 \i \bold{Connecting to a Form} |
|
1072 |
|
1073 To connect an object to the form itself, simply position the cursor |
|
1074 over the form and release the mouse button. The end point of the |
|
1075 connection changes to the electrical "ground" symbol. |
|
1076 \endtable |
|
1077 |
|
1078 |
|
1079 \section1 Editing and Deleting Connections |
|
1080 |
|
1081 By default, connection paths are created with two labels that show the |
|
1082 signal and slot involved in the connection. These labels are usually |
|
1083 oriented along the line of the connection. You can move them around inside |
|
1084 their host widgets by dragging the red square at each end of the connection |
|
1085 path. |
|
1086 |
|
1087 \target ConnectionEditor |
|
1088 \table |
|
1089 \row |
|
1090 \i \inlineimage designer-connection-editor.png |
|
1091 \i \bold{The Signal/Slot Editor} |
|
1092 |
|
1093 The signal and slot used in a connection can be changed after it has |
|
1094 been set up. When a connection is configured, it becomes visible in |
|
1095 \QD's signal and slot editor where it can be further edited. You can |
|
1096 also edit signal/slot connections by double-clicking on the connection |
|
1097 path or one of its labels to display the Connection Dialog. |
|
1098 \endtable |
|
1099 |
|
1100 \target DeletingConnections |
|
1101 \table |
|
1102 \row |
|
1103 \i \inlineimage designer-connection-editing.png |
|
1104 \i \bold{Deleting Connections} |
|
1105 |
|
1106 The whole connection can be selected by clicking on any of its path |
|
1107 segments. Once selected, a connection can be deleted with the |
|
1108 \key Delete key, ensuring that it will not be set up in the UI |
|
1109 file. |
|
1110 \endtable |
|
1111 */ |
|
1112 |
|
1113 |
|
1114 /*! |
|
1115 \page designer-buddy-mode.html |
|
1116 \contentspage{Qt Designer Manual}{Contents} |
|
1117 \previouspage Qt Designer's Signals and Slots Editing Mode |
|
1118 \nextpage Qt Designer's Tab Order Editing Mode |
|
1119 |
|
1120 \title Qt Designer's Buddy Editing Mode |
|
1121 |
|
1122 \image designer-buddy-mode.png |
|
1123 |
|
1124 One of the most useful basic features of Qt is the support for buddy |
|
1125 widgets. A buddy widget accepts the input focus on behalf of a QLabel when |
|
1126 the user types the label's shortcut key combination. The buddy concept is |
|
1127 also used in Qt's \l{Model/View Programming}{model/view} framework. |
|
1128 |
|
1129 |
|
1130 \section1 Linking Labels to Buddy Widgets |
|
1131 |
|
1132 To enter buddy editing mode, open the \gui Edit menu and select |
|
1133 \gui{Edit Buddies}. This mode presents the widgets on the form in a similar |
|
1134 way to \l{Qt Designer's Signals and Slots Editing Mode}{signals and slots |
|
1135 editing mode} but in this mode, connections must start at label widgets. |
|
1136 Ideally, you should connect each label widget that provides a shortcut with |
|
1137 a suitable input widget, such as a QLineEdit. |
|
1138 |
|
1139 |
|
1140 \target MakingBuddies |
|
1141 \table |
|
1142 \row |
|
1143 \i \inlineimage designer-buddy-making.png |
|
1144 \i \bold{Making Buddies} |
|
1145 |
|
1146 To define a buddy widget for a label, click on the label, drag the |
|
1147 connection to another widget on the form, and release the mouse button. |
|
1148 The connection shown indicates how input focus is passed to the buddy |
|
1149 widget. You can use the form preview to test the connections between |
|
1150 each label and its buddy. |
|
1151 \endtable |
|
1152 |
|
1153 |
|
1154 \section1 Removing Buddy Connections |
|
1155 |
|
1156 Only one buddy widget can be defined for each label. To change the buddy |
|
1157 used, it is necessary to delete any existing buddy connection before you |
|
1158 create a new one. |
|
1159 |
|
1160 Connections between labels and their buddy widgets can be deleted in the |
|
1161 same way as signal-slot connections in signals and slots editing mode: |
|
1162 Select the buddy connection by clicking on it and press the \key Delete |
|
1163 key. This operation does not modify either the label or its buddy in any |
|
1164 way. |
|
1165 */ |
|
1166 |
|
1167 |
|
1168 /*! |
|
1169 \page designer-tab-order.html |
|
1170 \contentspage {Qt Designer Manual}{Contents} |
|
1171 \previouspage Qt Designer's Buddy Editing Mode |
|
1172 \nextpage Using Containers in Qt Designer |
|
1173 |
|
1174 \title Qt Designer's Tab Order Editing Mode |
|
1175 |
|
1176 \image designer-tab-order-mode.png |
|
1177 |
|
1178 Many users expect to be able to navigate between widgets and controls |
|
1179 using only the keyboard. Qt lets the user navigate between input widgets |
|
1180 with the \key Tab and \key{Shift+Tab} keyboard shortcuts. The default |
|
1181 \e{tab order} is based on the order in which widgets are constructed. |
|
1182 Although this order may be sufficient for many users, it is often better |
|
1183 to explicitly specify the tab order to make your application easier to |
|
1184 use. |
|
1185 |
|
1186 |
|
1187 \section1 Setting the Tab Order |
|
1188 |
|
1189 To enter tab order editing mode, open the \gui Edit menu and select |
|
1190 \gui{Edit Tab Order}. In this mode, each input widget in the form is shown |
|
1191 with a number indicating its position in the tab order. So, if the user |
|
1192 gives the first input widget the input focus and then presses the tab key, |
|
1193 the focus will move to the second input widget, and so on. |
|
1194 |
|
1195 The tab order is defined by clicking on each of the numbers in the correct |
|
1196 order. The first number you click will change to red, indicating the |
|
1197 currently edited position in the tab order chain. The widget associated |
|
1198 with the number will become the first one in the tab order chain. Clicking |
|
1199 on another widget will make it the second in the tab order, and so on. |
|
1200 |
|
1201 Repeat this process until you are satisfied with the tab order in the form |
|
1202 -- you do not need to click every input widget if you see that the |
|
1203 remaining widgets are already in the correct order. Numbers, for which you |
|
1204 already set the order, change to green, while those which are not clicked |
|
1205 yet, remain blue. |
|
1206 |
|
1207 If you make a mistake, simply double click outside of any number or choose |
|
1208 \gui{Restart} from the form's context menu to start again. If you have many |
|
1209 widgets on your form and would like to change the tab order in the middle or |
|
1210 at the end of the tab order chain, you can edit it at any position. Press |
|
1211 \key{Ctrl} and click the number from which you want to start. |
|
1212 Alternatively, choose \gui{Start from Here} in the context menu. |
|
1213 |
|
1214 */ |
|
1215 |
|
1216 |
|
1217 /*! |
|
1218 \page designer-using-containers.html |
|
1219 \contentspage {Qt Designer Manual}{Contents} |
|
1220 \previouspage Qt Designer's Tab Order Editing Mode |
|
1221 \nextpage Creating Main Windows in Qt Designer |
|
1222 |
|
1223 |
|
1224 \title Using Containers in Qt Designer |
|
1225 |
|
1226 Container widgets provide high level control over groups of objects on a |
|
1227 form. They can be used to perform a variety of functions, such as managing |
|
1228 input widgets, providing paged and tabbed layouts, or just acting as |
|
1229 decorative containers for other objects. |
|
1230 |
|
1231 \image designer-widget-morph.png |
|
1232 |
|
1233 \QD provides visual feedback to help you place objects inside your |
|
1234 containers. When you drag an object from the widget box (or elsewhere) on |
|
1235 the form, each container will be highlighted when the cursor is positioned |
|
1236 over it. This indicates that you can drop the object inside, making it a |
|
1237 child object of the container. This feedback is important because it is |
|
1238 easy to place objects close to containers without actually placing them |
|
1239 inside. Both widgets and spacers can be used inside containers. |
|
1240 |
|
1241 Stacked widgets, tab widgets, and toolboxes are handled specially in \QD. |
|
1242 Normally, when adding pages (tabs, pages, compartments) to these containers |
|
1243 in your own code, you need to supply existing widgets, either as |
|
1244 placeholders or containing child widgets. In \QD, these are automatically |
|
1245 created for you, so you can add child objects to each page straight away. |
|
1246 |
|
1247 Each container typically allows its child objects to be arranged in one or |
|
1248 more layouts. The type of layout management provided depends on each |
|
1249 container, although setting the layout is usually just a matter of |
|
1250 selecting the container by clicking it, and applying a layout. The table |
|
1251 below shows a list of available containers. |
|
1252 |
|
1253 \table |
|
1254 \row |
|
1255 \i \inlineimage designer-containers-frame.png |
|
1256 \i \bold Frames |
|
1257 |
|
1258 Frames are used to enclose and group widgets, as well as to provide |
|
1259 decoration. They are used as the foundation for more complex |
|
1260 containers, but they can also be used as placeholders in forms. |
|
1261 |
|
1262 The most important properties of frames are \c frameShape, |
|
1263 \c frameShadow, \c lineWidth, and \c midLineWidth. These are described |
|
1264 in more detail in the QFrame class description. |
|
1265 |
|
1266 \row |
|
1267 \i \inlineimage designer-containers-groupbox.png |
|
1268 \i \bold{Group Boxes} |
|
1269 |
|
1270 Group boxes are usually used to group together collections of |
|
1271 checkboxes and radio buttons with similar purposes. |
|
1272 |
|
1273 Among the significant properties of group boxes are \c title, \c flat, |
|
1274 \c checkable, and \c checked. These are demonstrated in the |
|
1275 \l{widgets/groupbox}{Group Box} example, and described in the QGroupBox |
|
1276 class documentation. Each group box can contain its own layout, and |
|
1277 this is necessary if it contains other widgets. To add a layout to the |
|
1278 group box, click inside it and apply the layout as usual. |
|
1279 |
|
1280 \row |
|
1281 \i \inlineimage designer-containers-stackedwidget.png |
|
1282 \i \bold{Stacked Widgets} |
|
1283 |
|
1284 Stacked widgets are collections of widgets in which only the topmost |
|
1285 layer is visible. Control over the visible layer is usually managed by |
|
1286 another widget, such as combobox, using signals and slots. |
|
1287 |
|
1288 \QD shows arrows in the top-right corner of the stack to allow you to |
|
1289 see all the widgets in the stack when designing it. These arrows do not |
|
1290 appear in the preview or in the final component. To navigate between |
|
1291 pages in the stack, select the stacked widget and use the |
|
1292 \gui{Next Page} and \gui{Previous Page} entries from the context menu. |
|
1293 The \gui{Insert Page} and \gui{Delete Page} context menu options allow |
|
1294 you to add and remove pages. |
|
1295 |
|
1296 \row |
|
1297 \i \inlineimage designer-containers-tabwidget.png |
|
1298 \i \bold{Tab Widgets} |
|
1299 |
|
1300 Tab widgets allow the developer to split up the contents of a widget |
|
1301 into different labelled sections, only one of which is displayed at any |
|
1302 given time. By default, the tab widget contains two tabs, and these can |
|
1303 be deleted or renamed as required. You can also add additional tabs. |
|
1304 |
|
1305 To delete a tab: |
|
1306 \list |
|
1307 \o Click on its label to make it the current tab. |
|
1308 \o Select the tab widget and open its context menu. |
|
1309 \o Select \gui{Delete Page}. |
|
1310 \endlist |
|
1311 |
|
1312 To add a new tab: |
|
1313 \list |
|
1314 \o Select the tab widget and open its context menu. |
|
1315 \o Select \gui{Insert Page}. |
|
1316 \o You can add a page before or after the \e current page. \QD |
|
1317 will create a new widget for that particular tab and insert it |
|
1318 into the tab widget. |
|
1319 \o You can set the title of the current tab by changing the |
|
1320 \c currentTabText property in the \gui{Property Editor}. |
|
1321 \endlist |
|
1322 |
|
1323 \row |
|
1324 \i \inlineimage designer-containers-toolbox.png |
|
1325 \i \bold{ToolBox Widgets} |
|
1326 |
|
1327 Toolbox widgets provide a series of pages or compartments in a toolbox. |
|
1328 They are handled in a way similar to stacked widgets. |
|
1329 |
|
1330 To rename a page in a toolbox, make the toolbox your current pange and |
|
1331 change its \c currentItemText property from the \gui{Property Editor}. |
|
1332 |
|
1333 To add a new page, select \gui{Insert Page} from the toolbox widget's |
|
1334 context menu. You can add the page before or after the current page. |
|
1335 |
|
1336 To delete a page, select \gui{Delete Page} from the toolbox widget's |
|
1337 context menu. |
|
1338 |
|
1339 \row |
|
1340 \i \inlineimage designer-containers-dockwidget.png |
|
1341 \i \bold{Dock Widgets} |
|
1342 |
|
1343 Dock widgets are floating panels, often containing input widgets and |
|
1344 more complex controls, that are either attached to the edges of the |
|
1345 main window in "dock areas", or floated as independent tool windows. |
|
1346 |
|
1347 Although dock widgets can be added to any type of form, they are |
|
1348 typically used with forms created from the |
|
1349 \l{Creating Main Windows in Qt Designer}{main window template}. |
|
1350 |
|
1351 \endtable |
|
1352 */ |
|
1353 |
|
1354 |
|
1355 /*! |
|
1356 \page designer-creating-mainwindows.html |
|
1357 \contentspage {Qt Designer Manual}{Contents} |
|
1358 \previouspage Using Containers in Qt Designer |
|
1359 \nextpage Editing Resources with Qt Designer |
|
1360 |
|
1361 \title Creating Main Windows in Qt Designer |
|
1362 |
|
1363 \QD can be used to create user interfaces for different purposes, and |
|
1364 it provides different kinds of form templates for each user interface. The |
|
1365 main window template is used to create application windows with menu bars, |
|
1366 toolbars, and dock widgets. |
|
1367 |
|
1368 \omit |
|
1369 \image designer-mainwindow-example.png |
|
1370 \endomit |
|
1371 |
|
1372 Create a new main window by opening the \gui File menu and selecting the |
|
1373 \gui{New Form...} option, or by pressing \key{Ctrl+N}. Then, select the |
|
1374 \gui{Main Window} template. This template provides a main application |
|
1375 window containing a menu bar and a toolbar by default -- these can be |
|
1376 removed if they are not required. |
|
1377 |
|
1378 If you remove the menu bar, a new one can be created by selecting the |
|
1379 \gui{Create Menu Bar} option from the context menu, obtained by |
|
1380 right-clicking within the main window form. |
|
1381 |
|
1382 An application can have only \bold one menu bar, but \bold several |
|
1383 toolbars. |
|
1384 |
|
1385 |
|
1386 \section1 Menus |
|
1387 |
|
1388 Menus are added to the menu bar by modifying the \gui{Type Here} |
|
1389 placeholders. One of these is always present for editing purposes, and |
|
1390 will not be displayed in the preview or in the finished window. |
|
1391 |
|
1392 Once created, the properties of a menu can be accessed using the |
|
1393 \l{Qt Designer's Widget Editing Mode#The Property Editor}{Property Editor}, |
|
1394 and each menu can be accessed for this purpose via the |
|
1395 \l{Qt Designer's Widget Editing Mode#The Object Inspector}{The Object Inspector}. |
|
1396 |
|
1397 Existing menus can be removed by opening a context menu over the label in |
|
1398 the menu bar, and selecting \gui{Remove Menu 'menu_name'}. |
|
1399 |
|
1400 |
|
1401 \target CreatingAMenu |
|
1402 \raw HTML |
|
1403 <div style="float: left; margin-right: 2em"> |
|
1404 \endraw |
|
1405 \inlineimage designer-creating-menu1.png |
|
1406 \inlineimage designer-creating-menu2.png |
|
1407 \br |
|
1408 \inlineimage designer-creating-menu3.png |
|
1409 \inlineimage designer-creating-menu4.png |
|
1410 \raw HTML |
|
1411 </div> |
|
1412 \endraw |
|
1413 |
|
1414 \section2 Creating a Menu |
|
1415 |
|
1416 Double-click the placeholder item to begin editing. The menu text, |
|
1417 displayed using a line edit, can be modified. |
|
1418 |
|
1419 Insert the required text for the new menu. Inserting an |
|
1420 ampersand character (&) causes the letter following it to be |
|
1421 used as a mnemonic for the menu. |
|
1422 |
|
1423 Press \key Return or \key Enter to accept the new text, or press |
|
1424 \key Escape to reject it. You can undo the editing operation later if |
|
1425 required. |
|
1426 |
|
1427 \raw HTML |
|
1428 <div style="clear: both" /> |
|
1429 \endraw |
|
1430 |
|
1431 Menus can also be rearranged in the menu bar simply by dragging and |
|
1432 dropping them in the preferred location. A vertical red line indicates the |
|
1433 position where the menu will be inserted. |
|
1434 |
|
1435 Menus can contain any number of entries and separators, and can be nested |
|
1436 to the required depth. Adding new entries to menus can be achieved by |
|
1437 navigating the menu structure in the usual way. |
|
1438 |
|
1439 \target CreatingAMenuEntry |
|
1440 \raw HTML |
|
1441 <div style="float: right; margin-left: 2em"> |
|
1442 \endraw |
|
1443 \inlineimage designer-creating-menu-entry1.png |
|
1444 \inlineimage designer-creating-menu-entry2.png |
|
1445 \br |
|
1446 \inlineimage designer-creating-menu-entry3.png |
|
1447 \inlineimage designer-creating-menu-entry4.png |
|
1448 \raw HTML |
|
1449 </div> |
|
1450 \endraw |
|
1451 |
|
1452 \section2 Creating a Menu Entry |
|
1453 |
|
1454 Double-click the \gui{Type Here} placeholder to begin editing, or |
|
1455 double-click \gui{Add Separator} to insert a new separator line after |
|
1456 the last entry in the menu. |
|
1457 |
|
1458 The menu entry's text is displayed using a line edit, and can be |
|
1459 modified. |
|
1460 |
|
1461 Insert the required text for the new entry, optionally using |
|
1462 the ampersand character (&) to mark the letter to use as a |
|
1463 mnemonic for the entry. |
|
1464 |
|
1465 Press \key Return or \key Enter to accept the new text, or press |
|
1466 \key Escape to reject it. The action created for this menu entry will |
|
1467 be accessible via the \l{#TheActionEditor}{Action Editor}, and any |
|
1468 associated keyboard shortcut can be set there. |
|
1469 |
|
1470 \raw HTML |
|
1471 <div style="clear: both" /> |
|
1472 \endraw |
|
1473 |
|
1474 Just like with menus, entries can be moved around simply by dragging and |
|
1475 dropping them in the preferred location. When an entry is dragged over a |
|
1476 closed menu, the menu will open to allow it to be inserted there. Since |
|
1477 menu entries are based on actions, they can also be dropped onto toolbars, |
|
1478 where they will be displayed as toolbar buttons. |
|
1479 |
|
1480 \section1 Toolbars |
|
1481 |
|
1482 \raw HTML |
|
1483 <div style="float: left; margin-right: 2em"> |
|
1484 \endraw |
|
1485 \inlineimage designer-creating-toolbar.png |
|
1486 \raw HTML |
|
1487 </div> |
|
1488 \endraw |
|
1489 |
|
1490 \section2 Creating and Removing a Toolbar |
|
1491 |
|
1492 Toolbars are added to a main window in a similar way to the menu bar: |
|
1493 Select the \gui{Add Tool Bar} option from the form's context menu. |
|
1494 Alternatively, if there is an existing toolbar in the main window, you can |
|
1495 click the arrow on its right end to create a new toolbar. |
|
1496 |
|
1497 Toolbars are removed from the form via an entry in the toolbar's context |
|
1498 menu. |
|
1499 |
|
1500 \raw HTML |
|
1501 <div style="clear: both" /> |
|
1502 \endraw |
|
1503 |
|
1504 \section2 Adding and Removing Toolbar Buttons |
|
1505 |
|
1506 Toolbar buttons are created as actions in the |
|
1507 \l{#TheActionEditor}{Action Editor} and dragged onto the toolbar. |
|
1508 Since actions can be represented by menu entries and toolbar buttons, |
|
1509 they can be moved between menus and toolbars. |
|
1510 |
|
1511 \raw HTML |
|
1512 <div style="float: right; margin-left: 2em"> |
|
1513 \endraw |
|
1514 \inlineimage designer-adding-toolbar-action.png |
|
1515 \inlineimage designer-removing-toolbar-action.png |
|
1516 \raw HTML |
|
1517 </div> |
|
1518 \endraw |
|
1519 |
|
1520 To share an action between a menu and a toolbar, drag its icon from the |
|
1521 action editor to the toolbar rather than from the menu where its entry is |
|
1522 located. See \l{#Adding an Action}{Adding an Action} for more information |
|
1523 about this process. |
|
1524 |
|
1525 Toolbar buttons are removed via the toolbar's context menu. |
|
1526 |
|
1527 \raw HTML |
|
1528 <div style="clear: both" /> |
|
1529 \endraw |
|
1530 |
|
1531 \section1 Actions |
|
1532 |
|
1533 With the menu bar and the toolbars in place, it's time to populate them |
|
1534 with actions. New actions for both menus and toolbars are created in the |
|
1535 action editor window, simplifying the creation and management of actions. |
|
1536 |
|
1537 \target TheActionEditor |
|
1538 \raw HTML |
|
1539 <div style="float: left; margin-right: 2em"> |
|
1540 \endraw |
|
1541 \inlineimage designer-action-editor.png |
|
1542 \raw HTML |
|
1543 </div> |
|
1544 \endraw |
|
1545 |
|
1546 \section2 The Action Editor |
|
1547 |
|
1548 Enable the action editor by opening the \gui Tools menu, and switching |
|
1549 on the \gui{Action Editor} option. |
|
1550 |
|
1551 The action editor allows you to create \gui New actions and \gui Delete |
|
1552 actions. It also provides a search function, \gui Filter, using the |
|
1553 action's text. |
|
1554 |
|
1555 \QD's action editor can be viewed in the classic \gui{Icon View} and |
|
1556 \gui{Detailed View}. The screenshot below shows the action editor in |
|
1557 \gui{Detailed View}. You can also copy and paste actions between menus, |
|
1558 toolbars and forms. |
|
1559 |
|
1560 \raw HTML |
|
1561 <div style="clear: both" /> |
|
1562 \endraw |
|
1563 |
|
1564 \section2 Creating an Action |
|
1565 |
|
1566 To create an action, use the action editor's \gui New button, which will |
|
1567 then pop up an input dialog. Provide the new action with a \gui Text -- |
|
1568 this is the text that will appear in a menu entry and as the action's |
|
1569 tooltip. The text is also automatically added to an "action" prefix, |
|
1570 creating the action's \gui{Object Name}. |
|
1571 |
|
1572 In addition, the dialog provides the option of selecting an \gui Icon for |
|
1573 the action, as well as removing the current icon. |
|
1574 |
|
1575 Once the action is created, it can be used wherever actions are applicable. |
|
1576 |
|
1577 \raw HTML |
|
1578 <div style="clear: left" /> |
|
1579 \endraw |
|
1580 |
|
1581 \target AddingAnAction |
|
1582 \raw HTML |
|
1583 <div style="float: right; margin-left: 2em"> |
|
1584 \endraw |
|
1585 \inlineimage designer-adding-menu-action.png |
|
1586 \inlineimage designer-adding-toolbar-action.png |
|
1587 \raw HTML |
|
1588 </div> |
|
1589 \endraw |
|
1590 |
|
1591 \section2 Adding an Action |
|
1592 |
|
1593 To add an action to a menu or a toolbar, simply press the left mouse |
|
1594 button over the action in the action editor, and drag it to the |
|
1595 preferred location. |
|
1596 |
|
1597 \QD provides highlighted guide lines that tell you where the action |
|
1598 will be added. Release the mouse button to add the action when you have |
|
1599 found the right spot. |
|
1600 |
|
1601 \raw HTML |
|
1602 <div style="clear: right" /> |
|
1603 \endraw |
|
1604 |
|
1605 \section1 Dock Widgets |
|
1606 |
|
1607 Since dock widgets are \l{Using Containers in Qt Designer} |
|
1608 {container widgets}, they can be added to a form in the usuasl way. Once |
|
1609 added to a form, dock widgets are not placed in any particular dock area by |
|
1610 default; you need to set the \gui{docked} property to true for each widget |
|
1611 and choose an appropriate value for its \gui{dockWidgetArea} property. |
|
1612 |
|
1613 \target AddingADockWidget |
|
1614 |
|
1615 \raw HTML |
|
1616 <div style="float: left; margin-right: 2em"> |
|
1617 \endraw |
|
1618 \inlineimage designer-adding-dockwidget.png |
|
1619 \raw HTML |
|
1620 </div> |
|
1621 \endraw |
|
1622 |
|
1623 \section2 Adding a Dock Widget |
|
1624 |
|
1625 To add a dock widget to a form, drag one from the \gui Containers section |
|
1626 of the widget box, and drop it onto the main form area. Do not add the |
|
1627 dock widget to an existing layout. Instead, open the \gui{Property Editor} |
|
1628 and enable the \gui{docked} property to place it in a dock area. |
|
1629 |
|
1630 Note that it is sometimes easier to configure a dock widget if it is added |
|
1631 to a form before a layout is applied to the central widget. For example, |
|
1632 it is possible to undock it and resize it, making it more convenient to |
|
1633 add child widgets. |
|
1634 |
|
1635 Dock widgets can be optionally floated as independent tool windows. |
|
1636 Hence, it is useful to give them window titles by setting their |
|
1637 \l{QDockWidget::}{windowTitle} property. This also helps to identify them on the |
|
1638 form. |
|
1639 |
|
1640 \raw HTML |
|
1641 <div style="clear: both" /> |
|
1642 \endraw |
|
1643 */ |
|
1644 |
|
1645 |
|
1646 /*! |
|
1647 \page designer-resources.html |
|
1648 \contentspage {Qt Designer Manual}{Contents} |
|
1649 \previouspage Creating Main Windows in Qt Designer |
|
1650 \nextpage Using Stylesheets with Qt Designer |
|
1651 |
|
1652 \title Editing Resources with Qt Designer |
|
1653 |
|
1654 \image designer-resources-editing.png |
|
1655 |
|
1656 \QD fully supports the \l{The Qt Resource System}{Qt Resource System}, |
|
1657 enabling resources to be specified together with forms as they are |
|
1658 designed. To aid designers and developers manage resources for their |
|
1659 applications, \QD's resource editor allows resources to be defined on a |
|
1660 per-form basis. In other words, each form can have a separate resource |
|
1661 file. |
|
1662 |
|
1663 \section1 Defining a Resource File |
|
1664 |
|
1665 To specify a resource file you must enable the resource editor by opening |
|
1666 the \gui Tools menu, and switching on the \gui{Resource Browser} option. |
|
1667 |
|
1668 \target ResourceFiles |
|
1669 \table |
|
1670 \row |
|
1671 \i \inlineimage designer-resource-browser.png |
|
1672 \i \bold{Resource Files} |
|
1673 |
|
1674 Within the resource browser, you can open existing resource files or |
|
1675 create new ones. Click the \gui{Edit Resources} button |
|
1676 \inlineimage designer-edit-resources-button.png |
|
1677 to edit your resources. To reload resources, click on the \gui Reload |
|
1678 button |
|
1679 \inlineimage designer-reload-resources-button.png |
|
1680 . |
|
1681 \endtable |
|
1682 |
|
1683 |
|
1684 Once a resource file is loaded, you can create or remove entries in it |
|
1685 using the given \gui{Add Files} |
|
1686 \inlineimage designer-add-resource-entry-button.png |
|
1687 and \gui{Remove Files} |
|
1688 \inlineimage designer-remove-resource-entry-button.png |
|
1689 buttons, and specify resources (e.g., images) using the \gui{Add Files} |
|
1690 button |
|
1691 \inlineimage designer-add-files-button.png |
|
1692 . Note that these resources must reside within the current resource file's |
|
1693 directory or one of its subdirectories. |
|
1694 |
|
1695 |
|
1696 \target EditResource |
|
1697 \table |
|
1698 \row |
|
1699 \i \inlineimage designer-edit-resource.png |
|
1700 \i \bold{Editing Resource Files} |
|
1701 |
|
1702 Press the |
|
1703 \inlineimage designer-add-resource-entry-button.png |
|
1704 button to add a new resource entry to the file. Then use the |
|
1705 \gui{Add Files} button |
|
1706 \inlineimage designer-add-files-button.png |
|
1707 to specify the resource. |
|
1708 |
|
1709 You can remove resources by selecting the corresponding entry in the |
|
1710 resource editor, and pressing the |
|
1711 \inlineimage designer-remove-resource-entry-button.png |
|
1712 button. |
|
1713 \endtable |
|
1714 |
|
1715 |
|
1716 \section1 Using the Resources |
|
1717 |
|
1718 Once the resources are defined you can use them actively when composing |
|
1719 your form. For example, you might want to create a tool button using an |
|
1720 icon specified in the resource file. |
|
1721 |
|
1722 \target UsingResources |
|
1723 \table |
|
1724 \row |
|
1725 \i \inlineimage designer-resources-using.png |
|
1726 \i \bold{Using Resources} |
|
1727 |
|
1728 When changing properties with values that may be defined within a |
|
1729 resource file, \QD's property editor allows you to specify a resource |
|
1730 in addition to the option of selecting a source file in the ordinary |
|
1731 way. |
|
1732 |
|
1733 \row |
|
1734 \i \inlineimage designer-resource-selector.png |
|
1735 \i \bold{Selecting a Resource} |
|
1736 |
|
1737 You can open the resource selector by clicking \gui{Choose Resource...} |
|
1738 to add resources any time during the design process. |
|
1739 |
|
1740 \omit |
|
1741 ... check with Friedemann |
|
1742 To quickly assign icon pixmaps to actions or pixmap properties, you may |
|
1743 drag the pixmap from the resource editor to the action editor, or to the |
|
1744 pixmap property in the property editor. |
|
1745 \endomit |
|
1746 |
|
1747 \endtable |
|
1748 */ |
|
1749 |
|
1750 |
|
1751 /*! |
|
1752 \page designer-stylesheet.html |
|
1753 \contentspage {Qt Designer Manual}{Contents} |
|
1754 \previouspage Editing Resources with Qt Designer |
|
1755 \nextpage Using a Designer UI File in Your Application |
|
1756 |
|
1757 \title Using Stylesheets with Qt Designer |
|
1758 |
|
1759 Since Qt 4.2, it is possible to edit stylesheets in \QD with the stylesheet |
|
1760 editor. |
|
1761 |
|
1762 \target UsingStylesheets |
|
1763 \table |
|
1764 \row |
|
1765 \i \inlineimage designer-stylesheet-options.png |
|
1766 \bold{Setting a Stylesheet} |
|
1767 |
|
1768 The stylesheet editor can be accessed by right-clicking a widget |
|
1769 and selecting \gui{Change styleSheet...} |
|
1770 |
|
1771 \row |
|
1772 \i \inlineimage designer-stylesheet-usage.png |
|
1773 \endtable |
|
1774 |
|
1775 */ |
|
1776 |
|
1777 |
|
1778 /*! |
|
1779 \page designer-using-a-ui-file.html |
|
1780 \previouspage Using Stylesheets with Qt Designer |
|
1781 \contentspage {Qt Designer Manual}{Contents} |
|
1782 \nextpage Using Custom Widgets with Qt Designer |
|
1783 |
|
1784 \title Using a Designer UI File in Your Application |
|
1785 |
|
1786 With Qt's integrated build tools, \l{qmake Manual}{qmake} and \l uic, the |
|
1787 code for user interface components created with \QD is automatically |
|
1788 generated when the rest of your application is built. Forms can be included |
|
1789 and used directly from your application. Alternatively, you can use them to |
|
1790 extend subclasses of standard widgets. These forms can be processed at |
|
1791 compile time or at run time, depending on the approach used. |
|
1792 |
|
1793 |
|
1794 \tableofcontents |
|
1795 \section1 Compile Time Form Processing |
|
1796 |
|
1797 A compile time processed form can be used in your application with one of |
|
1798 the following approaches: |
|
1799 |
|
1800 \list |
|
1801 \o The Direct Approach: you construct a widget to use as a placeholder |
|
1802 for the component, and set up the user interface inside it. |
|
1803 \o The Single Inheritance Approach: you subclass the form's base class |
|
1804 (QWidget or QDialog, for example), and include a private instance |
|
1805 of the form's user interface object. |
|
1806 \o The MultipleInheritance Approach: you subclass both the form's base |
|
1807 class and the form's user interface object. This allows the widgets |
|
1808 defined in the form to be used directly from within the scope of |
|
1809 the subclass. |
|
1810 \endlist |
|
1811 |
|
1812 |
|
1813 \section2 The Direct Approach |
|
1814 |
|
1815 To demonstrate how to use user interface (UI) files straight from |
|
1816 \QD, we create a simple Calculator Form application. This is based on the |
|
1817 original \l{Calculator Form Example}{Calculator Form} example. |
|
1818 |
|
1819 The application consists of one source file, \c main.cpp and a UI |
|
1820 file. |
|
1821 |
|
1822 The \c{calculatorform.ui} file designed with \QD is shown below: |
|
1823 |
|
1824 \image directapproach-calculatorform.png |
|
1825 |
|
1826 We will use \c qmake to build the executable, so we need to write a |
|
1827 \c{.pro} file: |
|
1828 |
|
1829 \snippet doc/src/snippets/uitools/calculatorform/calculatorform.pro 0 |
|
1830 |
|
1831 The special feature of this file is the \c FORMS declaration that tells |
|
1832 \c qmake which files to process with \c uic. In this case, the |
|
1833 \c calculatorform.ui file is used to create a \c ui_calculatorform.h file |
|
1834 that can be used by any file listed in the \c SOURCES declaration. To |
|
1835 ensure that \c qmake generates the \c ui_calculatorform.h file, we need to |
|
1836 include it in a file listed in \c SOURCES. Since we only have \c main.cpp, |
|
1837 we include it there: |
|
1838 |
|
1839 \snippet doc/src/snippets/uitools/calculatorform/main.cpp 0 |
|
1840 |
|
1841 This include is an additional check to ensure that we do not generate code |
|
1842 for UI files that are not used. |
|
1843 |
|
1844 The \c main function creates the calculator widget by constructing a |
|
1845 standard QWidget that we use to host the user interface described by the |
|
1846 \c calculatorform.ui file. |
|
1847 |
|
1848 \snippet doc/src/snippets/uitools/calculatorform/main.cpp 1 |
|
1849 |
|
1850 In this case, the \c{Ui::CalculatorForm} is an interface description object |
|
1851 from the \c ui_calculatorform.h file that sets up all the dialog's widgets |
|
1852 and the connections between its signals and slots. |
|
1853 |
|
1854 This approach provides a quick and easy way to use simple, self-contained |
|
1855 components in your applications, but many componens created with \QD will |
|
1856 require close integration with the rest of the application code. For |
|
1857 instance, the \c CalculatorForm code provided above will compile and run, |
|
1858 but the QSpinBox objects will not interact with the QLabel as we need a |
|
1859 custom slot to carry out the add operation and display the result in the |
|
1860 QLabel. To achieve this, we need to subclass a standard Qt widget (known as |
|
1861 the single inheritance approach). |
|
1862 |
|
1863 |
|
1864 \section2 The Single Inheritance Approach |
|
1865 |
|
1866 In this approach, we subclass a Qt widget and set up the user interface |
|
1867 from within the constructor. Components used in this way expose the widgets |
|
1868 and layouts used in the form to the Qt widget subclass, and provide a |
|
1869 standard system for making signal and slot connections between the user |
|
1870 interface and other objects in your application. |
|
1871 |
|
1872 This approach is used in the \l{Calculator Form Example}{Calculator Form} |
|
1873 example. |
|
1874 |
|
1875 To ensure that we can use the user interface, we need to include the header |
|
1876 file that \c uic generates before referring to \c{Ui::CalculatorForm}: |
|
1877 |
|
1878 \snippet examples/designer/calculatorform/calculatorform.h 0 |
|
1879 |
|
1880 This means that the \c{.pro} file must be updated to include |
|
1881 \c{calculatorform.h}: |
|
1882 |
|
1883 \snippet examples/designer/calculatorform/calculatorform.pro 0 |
|
1884 |
|
1885 The subclass is defined in the following way: |
|
1886 |
|
1887 \snippet examples/designer/calculatorform/calculatorform.h 1 |
|
1888 |
|
1889 The important feature of the class is the private \c ui object which |
|
1890 provides the code for setting up and managing the user interface. |
|
1891 |
|
1892 The constructor for the subclass constructs and configures all the widgets |
|
1893 and layouts for the dialog just by calling the \c ui object's \c setupUi() |
|
1894 function. Once this has been done, it is possible to modify the user |
|
1895 interface as needed. |
|
1896 |
|
1897 \snippet examples/designer/calculatorform/calculatorform.cpp 0 |
|
1898 |
|
1899 We can connect signals and slots in user interface widgets in the usual |
|
1900 way, taking care to prefix the \c ui object to each widget used. |
|
1901 |
|
1902 The advantages of this approach are its simple use of inheritance to |
|
1903 provide a QWidget-based interface, and its encapsulation of the user |
|
1904 interface widget variables within the \c ui data member. We can use this |
|
1905 method to define a number of user interfaces within the same widget, each |
|
1906 of which is contained within its own namespace, and overlay (or compose) |
|
1907 them. This approach can be used to create individual tabs from existing |
|
1908 forms, for example. |
|
1909 |
|
1910 |
|
1911 \section2 The Multiple Inheritance Approach |
|
1912 |
|
1913 Forms created with \QD can be subclassed together with a standard |
|
1914 QWidget-based class. This approach makes all the user interface components |
|
1915 defined in the form directly accessible within the scope of the subclass, |
|
1916 and enables signal and slot connections to be made in the usual way with |
|
1917 the \l{QObject::connect()}{connect()} function. |
|
1918 |
|
1919 This approach is used in the \l{Multiple Inheritance Example} |
|
1920 {Multiple Inheritance} example. |
|
1921 |
|
1922 We need to include the header file that \c uic generates from the |
|
1923 \c calculatorform.ui file: |
|
1924 |
|
1925 \snippet examples/uitools/multipleinheritance/calculatorform.h 0 |
|
1926 |
|
1927 The class is defined in a similar way to the one used in the |
|
1928 \l{The Single Inheritance Approach}{single inheritance approach}, except that |
|
1929 this time we inherit from \e{both} QWidget and \c{Ui::CalculatorForm}: |
|
1930 |
|
1931 \snippet examples/uitools/multipleinheritance/calculatorform.h 1 |
|
1932 |
|
1933 We inherit \c{Ui::CalculatorForm} privately to ensure that the user |
|
1934 interface objects are private in our subclass. We can also inherit it with |
|
1935 the \c public or \c protected keywords in the same way that we could have |
|
1936 made \c ui public or protected in the previous case. |
|
1937 |
|
1938 The constructor for the subclass performs many of the same tasks as the |
|
1939 constructor used in the \l{The Single Inheritance Approach} |
|
1940 {single inheritance} example: |
|
1941 |
|
1942 \snippet examples/uitools/multipleinheritance/calculatorform.cpp 0 |
|
1943 |
|
1944 In this case, the widgets used in the user interface can be accessed in the |
|
1945 same say as a widget created in code by hand. We no longer require the |
|
1946 \c{ui} prefix to access them. |
|
1947 |
|
1948 Subclassing using multiple inheritance gives us more direct access to the |
|
1949 contents of the form, is slightly cleaner than the single inheritance |
|
1950 approach, but does not conveniently support composition of multiple user |
|
1951 interfaces. |
|
1952 |
|
1953 |
|
1954 \section1 Run Time Form Processing |
|
1955 |
|
1956 Alternatively, forms can be processed at run time, producing dynamically- |
|
1957 generated user interfaces. This can be done using the QtUiTools module |
|
1958 that provides the QUiLoader class to handle forms created with \QD. |
|
1959 |
|
1960 |
|
1961 \section2 The UiTools Approach |
|
1962 |
|
1963 A resource file containing a UI file is required to process forms at |
|
1964 run time. Also, the application needs to be configured to use the QtUiTools |
|
1965 module. This is done by including the following declaration in a \c qmake |
|
1966 project file, ensuring that the application is compiled and linked |
|
1967 appropriately. |
|
1968 |
|
1969 \snippet doc/src/snippets/code/doc_src_designer-manual.qdoc 0 |
|
1970 |
|
1971 The QUiLoader class provides a form loader object to construct the user |
|
1972 interface. This user interface can be retrieved from any QIODevice, e.g., |
|
1973 a QFile object, to obtain a form stored in a project's resource file. The |
|
1974 QUiLoader::load() function constructs the form widget using the user |
|
1975 interface description contained in the file. |
|
1976 |
|
1977 The QtUiTools module classes can be included using the following directive: |
|
1978 |
|
1979 \snippet doc/src/snippets/code/doc_src_designer-manual.qdoc 1 |
|
1980 |
|
1981 The QUiLoader::load() function is invoked as shown in this code from the |
|
1982 \l{Text Finder Example}{Text Finder} example: |
|
1983 |
|
1984 \snippet examples/uitools/textfinder/textfinder.cpp 4 |
|
1985 |
|
1986 In a class that uses QtUiTools to build its user interface at run time, we |
|
1987 can locate objects in the form using qFindChild(). For example, in the |
|
1988 follownig code, we locate some components based on their object names and |
|
1989 widget types: |
|
1990 |
|
1991 \snippet examples/uitools/textfinder/textfinder.cpp 1 |
|
1992 |
|
1993 Processing forms at run-time gives the developer the freedom to change a |
|
1994 program's user interface, just by changing the UI file. This is useful |
|
1995 when customizing programs to suit various user needs, such as extra large |
|
1996 icons or a different colour scheme for accessibility support. |
|
1997 |
|
1998 |
|
1999 \section1 Automatic Connections |
|
2000 |
|
2001 The signals and slots connections defined for compile time or run time |
|
2002 forms can either be set up manually or automatically, using QMetaObject's |
|
2003 ability to make connections between signals and suitably-named slots. |
|
2004 |
|
2005 Generally, in a QDialog, if we want to process the information entered by |
|
2006 the user before accepting it, we need to connect the clicked() signal from |
|
2007 the \gui OK button to a custom slot in our dialog. We will first show an |
|
2008 example of the dialog in which the slot is connected by hand then compare |
|
2009 it with a dialog that uses automatic connection. |
|
2010 |
|
2011 |
|
2012 \section2 A Dialog Without Auto-Connect |
|
2013 |
|
2014 We define the dialog in the same way as before, but now include a slot in |
|
2015 addition to the constructor: |
|
2016 |
|
2017 \snippet doc/src/snippets/designer/noautoconnection/imagedialog.h 0 |
|
2018 |
|
2019 The \c checkValues() slot will be used to validate the values provided by |
|
2020 the user. |
|
2021 |
|
2022 In the dialog's constructor we set up the widgets as before, and connect |
|
2023 the \gui Cancel button's \l{QPushButton::clicked()}{clicked()} signal to |
|
2024 the dialog's reject() slot. We also disable the |
|
2025 \l{QPushButton::autoDefault}{autoDefault} property in both buttons to |
|
2026 ensure that the dialog does not interfere with the way that the line edit |
|
2027 handles return key events: |
|
2028 |
|
2029 \snippet doc/src/snippets/designer/noautoconnection/imagedialog.cpp 0 |
|
2030 \dots |
|
2031 \snippet doc/src/snippets/designer/noautoconnection/imagedialog.cpp 1 |
|
2032 |
|
2033 We connect the \gui OK button's \l{QPushButton::clicked()}{clicked()} |
|
2034 signal to the dialog's checkValues() slot which we implement as follows: |
|
2035 |
|
2036 \snippet doc/src/snippets/designer/noautoconnection/imagedialog.cpp 2 |
|
2037 |
|
2038 This custom slot does the minimum necessary to ensure that the data |
|
2039 entered by the user is valid - it only accepts the input if a name was |
|
2040 given for the image. |
|
2041 |
|
2042 \section2 Widgets and Dialogs with Auto-Connect |
|
2043 |
|
2044 Although it is easy to implement a custom slot in the dialog and connect |
|
2045 it in the constructor, we could instead use QMetaObject's auto-connection |
|
2046 facilities to connect the \gui OK button's clicked() signal to a slot in |
|
2047 our subclass. \c{uic} automatically generates code in the dialog's |
|
2048 \c setupUi() function to do this, so we only need to declare and |
|
2049 implement a slot with a name that follows a standard convention: |
|
2050 |
|
2051 \snippet doc/src/snippets/code/doc_src_designer-manual.qdoc 2 |
|
2052 |
|
2053 Using this convention, we can define and implement a slot that responds to |
|
2054 mouse clicks on the \gui OK button: |
|
2055 |
|
2056 \snippet doc/src/snippets/designer/autoconnection/imagedialog.h 0 |
|
2057 |
|
2058 Another example of automatic signal and slot connection would be the |
|
2059 \l{Text Finder Example}{Text Finder} with its \c{on_findButton_clicked()} |
|
2060 slot. |
|
2061 |
|
2062 We use QMetaObject's system to enable signal and slot connections: |
|
2063 |
|
2064 \snippet examples/uitools/textfinder/textfinder.cpp 2 |
|
2065 |
|
2066 This enables us to implement the slot, as shown below: |
|
2067 |
|
2068 \snippet examples/uitools/textfinder/textfinder.cpp 6 |
|
2069 \dots |
|
2070 \snippet examples/uitools/textfinder/textfinder.cpp 8 |
|
2071 |
|
2072 Automatic connection of signals and slots provides both a standard naming |
|
2073 convention and an explicit interface for widget designers to work to. By |
|
2074 providing source code that implements a given interface, user interface |
|
2075 designers can check that their designs actually work without having to |
|
2076 write code themselves. |
|
2077 */ |
|
2078 |
|
2079 |
|
2080 /*! |
|
2081 \page designer-customizing-forms.html |
|
2082 \contentspage {Qt Designer Manual}{Contents} |
|
2083 \previouspage Using Stylesheets with Qt Designer |
|
2084 \nextpage Using Custom Widgets with Qt Designer |
|
2085 |
|
2086 \title Customizing Qt Designer Forms |
|
2087 |
|
2088 \image designer-form-settings.png |
|
2089 |
|
2090 When saving a form in \QD, it is stored as a UI file. Several form |
|
2091 settings, for example the grid settings or the margin and spacing for the |
|
2092 default layout, are stored along with the form's components. These settings |
|
2093 are used when the \l uic generates the form's C++ code. For more |
|
2094 information on how to use forms in your application, see the |
|
2095 \l{Using a Designer UI File in Your Application} section. |
|
2096 |
|
2097 |
|
2098 \section1 Modifying the Form Settings |
|
2099 |
|
2100 To modify the form settings, open the \gui Form menu and select \gui{Form |
|
2101 Settings...} |
|
2102 |
|
2103 In the forms settings dialog you can specify the \gui Author of the form. |
|
2104 |
|
2105 You can also alter the margin and spacing properties for the form's default |
|
2106 layout (\gui {Layout Default}). These default layout properties will be |
|
2107 replaced by the corresponding \gui {Layout Function}, if the function is |
|
2108 specified, when \c uic generates code for the form. The form settings |
|
2109 dialog lets you specify functions for both the margin and the spacing. |
|
2110 |
|
2111 \target LayoutFunction |
|
2112 \table |
|
2113 \row |
|
2114 \i \inlineimage designer-form-layoutfunction.png |
|
2115 \i \bold{Layout Function} |
|
2116 |
|
2117 The default layout properties will be replaced by the corresponding |
|
2118 \gui{Layout Function}, when \c uic generates code for the form. This is |
|
2119 useful when different environments requires different layouts for the same |
|
2120 form. |
|
2121 |
|
2122 To specify layout functions for the form's margin and spacing, check the |
|
2123 \gui{Layout Function} group box to enable the line edits. |
|
2124 \endtable |
|
2125 |
|
2126 You can also specify the form's \gui{Include Hints}; i.e., provide a list |
|
2127 of the header files which will then be included in the form window's |
|
2128 associated UI file. Header files may be local, i.e., relative to the |
|
2129 project's directory, \c "mywidget.h", or global, i.e. part of Qt or the |
|
2130 compilers standard libraries: \c <QtGui/QWidget>. |
|
2131 |
|
2132 Finally, you can specify the function used to load pixmaps into the form |
|
2133 window (the \gui {Pixmap Function}). |
|
2134 */ |
|
2135 |
|
2136 |
|
2137 /*! |
|
2138 \page designer-using-custom-widgets.html |
|
2139 \contentspage {Qt Designer Manual}{Contents} |
|
2140 \previouspage Customizing Qt Designer Forms |
|
2141 \nextpage Creating Custom Widgets for Qt Designer |
|
2142 |
|
2143 \title Using Custom Widgets with Qt Designer |
|
2144 |
|
2145 \QD can display custom widgets through its extensible plugin mechanism, |
|
2146 allowing the range of designable widgets to be extended by the user and |
|
2147 third parties. This feature also allows \QD to optionally support |
|
2148 \l{Qt3Support}{Qt 3 compatibility widgets}. Alternatively, it is possible |
|
2149 to use existing widgets as placeholders for widget classes that provide |
|
2150 similar APIs. |
|
2151 |
|
2152 Widgets from the Qt3Support library are made available via in \QD's support |
|
2153 for custom widgets. |
|
2154 |
|
2155 |
|
2156 \section1 Handling Custom Widgets |
|
2157 |
|
2158 Although \QD supports all of the standard Qt widgets, and can be configured |
|
2159 to handle widgets supplied in the Qt3Support library, some specialized |
|
2160 widgets may not be available as standard for a number of reasons: |
|
2161 |
|
2162 \list |
|
2163 \i Custom widgets may not be available at the time the user interface |
|
2164 is being designed. |
|
2165 \i Custom widgets may be platform-specific, and designers may be |
|
2166 developing the user interface on a different platform to end users. |
|
2167 \i The source code for a custom widget is not available, or the user |
|
2168 interface designers are unable to use the widget for non-technical |
|
2169 reasons. |
|
2170 \endlist |
|
2171 |
|
2172 In the above situations, it is still possible to design forms with the aim |
|
2173 of using custom widgets in the application. To achieve this, we can use |
|
2174 the widget promotion feature of \QD. |
|
2175 |
|
2176 In all other cases, where the source code to the custom widgets is |
|
2177 available, we can adapt the custom widget for use with \QD. |
|
2178 |
|
2179 |
|
2180 \section2 Promoting Widgets |
|
2181 |
|
2182 \image designer-promoting-widgets.png |
|
2183 |
|
2184 If some forms must be designed, but certain custom widgets are unavailble |
|
2185 to the designer, we can substitute similar widgets to represent the missing |
|
2186 widgets. For example, we might represent instances of a custom push button |
|
2187 class, \c MyPushButton, with instances of QPushButton and promote these to |
|
2188 \c MyPushButton so that \l{uic.html}{uic} generates suitable code for this |
|
2189 missing class. |
|
2190 |
|
2191 When choosing a widget to use as a placeholder, it is useful to compare the |
|
2192 API of the missing widget with those of standard Qt widgets. For |
|
2193 specialized widgets that subclass standard classes, the obvious choice of |
|
2194 placeholder is the base class of the custom widget; for example, QSlider |
|
2195 might be used for specialized QSlider subclasses. |
|
2196 |
|
2197 For specialized widgets that do not share a common API with standard Qt |
|
2198 widgets, it is worth considering adapting a custom widget for use in \QD. |
|
2199 If this is not possible then QWidget is the obvious choice for a |
|
2200 placeholder widget since it is the lowest common denominator for all |
|
2201 widgets. |
|
2202 |
|
2203 To add a placeholder, select an object of a suitable base class and choose |
|
2204 \gui{Promote to ...} from the form's context menu. After entering the class |
|
2205 name and header file in the lower part of the dialog, choose \gui{Add}. The |
|
2206 placeholder class will now appear along with the base class in the upper |
|
2207 list. Click the \gui{Promote} button to accept this choice. |
|
2208 |
|
2209 Now, when the form's context menu is opened over objects of the base class, |
|
2210 the placeholder class will appear in the \gui{Promote to} submenu, allowing |
|
2211 for convenient promotion of objects to that class. |
|
2212 |
|
2213 A promoted widget can be reverted to its base class by choosing |
|
2214 \gui{Demote to} from the form's context menu. |
|
2215 |
|
2216 |
|
2217 \section2 User Defined Custom Widgets |
|
2218 |
|
2219 \image worldtimeclockplugin-example.png |
|
2220 |
|
2221 Custom widgets can be adapted for use with \QD, giving designers the |
|
2222 opportunity to configure the user interface using the actual widgets that |
|
2223 will be used in an application rather than placeholder widgets. The process |
|
2224 of creating a custom widget plugin is described in the |
|
2225 \l{Creating Custom Widgets for Qt Designer} chapter of this manual. |
|
2226 |
|
2227 To use a plugin created in this way, it is necessary to ensure that the |
|
2228 plugin is located on a path that \QD searches for plugins. Generally, |
|
2229 plugins stored in \c{$QTDIR/plugins/designer} will be loaded when \QD |
|
2230 starts. Further information on building and installing plugins can be found |
|
2231 \l{Creating Custom Widgets for Qt Designer#BuildingandInstallingthePlugin} |
|
2232 {here}. You can also refer to the \l{How to Create Qt Plugins} |
|
2233 {Plugins HOWTO} document for information about creating plugins. |
|
2234 */ |
|
2235 |
|
2236 |
|
2237 /*! |
|
2238 \page designer-creating-custom-widgets.html |
|
2239 \previouspage Using Custom Widgets with Qt Designer |
|
2240 \contentspage {Qt Designer Manual}{Contents} |
|
2241 \nextpage Creating Custom Widget Extensions |
|
2242 |
|
2243 \title Creating Custom Widgets for Qt Designer |
|
2244 |
|
2245 \QD's plugin-based architecture allows user-defined and third party custom |
|
2246 widgets to be edited just like you do with standard Qt widgets. All of the |
|
2247 custom widget's features are made available to \QD, including widget |
|
2248 properties, signals, and slots. Since \QD uses real widgets during the form |
|
2249 design process, custom widgets will appear the same as they do when |
|
2250 previewed. |
|
2251 |
|
2252 \image worldtimeclockplugin-example.png |
|
2253 |
|
2254 The \l QtDesigner module provides you with the ability to create custom |
|
2255 widgets in \QD. |
|
2256 |
|
2257 |
|
2258 \section1 Getting Started |
|
2259 |
|
2260 To integrate a custom widget with \QD, you require a suitable description |
|
2261 for the widget and an appropriate \c{.pro} file. |
|
2262 |
|
2263 |
|
2264 \section2 Providing an Interface Description |
|
2265 |
|
2266 To inform \QD about the type of widget you want to provide, create a |
|
2267 subclass of QDesignerCustomWidgetInterface that describes the various |
|
2268 properties your widget exposes. Most of these are supplied by functions |
|
2269 that are pure virtual in the base class, because only the author of the |
|
2270 plugin can provide this information. |
|
2271 |
|
2272 \table |
|
2273 \header |
|
2274 \o Function |
|
2275 \o Description of the return value |
|
2276 \row |
|
2277 \o \c name() |
|
2278 \o The name of the class that provides the widget. |
|
2279 \row |
|
2280 \o \c group() |
|
2281 \o The group in \QD's widget box that the widget belongs to. |
|
2282 \row |
|
2283 \o \c toolTip() |
|
2284 \o A short description to help users identify the widget in \QD. |
|
2285 \row |
|
2286 \o \c whatsThis() |
|
2287 \o A longer description of the widget for users of \QD. |
|
2288 \row |
|
2289 \o \c includeFile() |
|
2290 \o The header file that must be included in applications that use |
|
2291 this widget. This information is stored in UI files and will |
|
2292 be used by \c uic to create a suitable \c{#includes} statement |
|
2293 in the code it generates for the form containing the custom |
|
2294 widget. |
|
2295 \row |
|
2296 \o \c icon() |
|
2297 \o An icon that can be used to represent the widget in \QD's |
|
2298 widget box. |
|
2299 \row |
|
2300 \o \c isContainer() |
|
2301 \o True if the widget will be used to hold child widgets; |
|
2302 false otherwise. |
|
2303 \row |
|
2304 \o \c createWidget() |
|
2305 \o A QWidget pointer to an instance of the custom widget, |
|
2306 constructed with the parent supplied. |
|
2307 \note createWidget() is a factory function responsible for |
|
2308 creating the widget only. The custom widget's properties will |
|
2309 not be available until load() returns. |
|
2310 \row |
|
2311 \o \c domXml() |
|
2312 \o A description of the widget's properties, such as its object |
|
2313 name, size hint, and other standard QWidget properties. |
|
2314 \row |
|
2315 \o \c codeTemplate() |
|
2316 \o This function is reserved for future use by \QD. |
|
2317 \endtable |
|
2318 |
|
2319 Two other virtual functions can also be reimplemented: |
|
2320 |
|
2321 \table |
|
2322 \row |
|
2323 \o \c initialize() |
|
2324 \o Sets up extensions and other features for custom widgets. Custom |
|
2325 container extensions (see QDesignerContainerExtension) and task |
|
2326 menu extensions (see QDesignerTaskMenuExtension) should be set |
|
2327 up in this function. |
|
2328 \row |
|
2329 \o \c isInitialized() |
|
2330 \o Returns true if the widget has been initialized; returns false |
|
2331 otherwise. Reimplementations usually check whether the |
|
2332 \c initialize() function has been called and return the result |
|
2333 of this test. |
|
2334 \endtable |
|
2335 |
|
2336 |
|
2337 \section2 Notes on the \c{domXml()} Function |
|
2338 |
|
2339 The \c{domXml()} function returns a UI file snippet that is used by |
|
2340 \QD's widget factory to create a custom widget and its applicable |
|
2341 properties. |
|
2342 |
|
2343 Since Qt 4.4, \QD's widget box allows for a complete UI file to |
|
2344 describe \bold one custom widget. The UI file can be loaded using the |
|
2345 \c{<ui>} tag. Specifying the <ui> tag allows for adding the <customwidget> |
|
2346 element that contains additional information for custom widgets. The |
|
2347 \c{<widget>} tag is sufficient if no additional information is required |
|
2348 |
|
2349 If the custom widget does not provide a reasonable size hint, it is |
|
2350 necessary to specify a default geometry in the string returned by the |
|
2351 \c domXml() function in your subclass. For example, the |
|
2352 \c AnalogClockPlugin provided by the \l{designer/customwidgetplugin} |
|
2353 {Custom Widget Plugin} example, defines a default widgetgeometry in the |
|
2354 following way: |
|
2355 |
|
2356 \dots |
|
2357 \snippet examples/designer/customwidgetplugin/customwidgetplugin.cpp 11 |
|
2358 \dots |
|
2359 |
|
2360 An additional feature of the \c domXml() function is that, if it returns |
|
2361 an empty string, the widget will not be installed in \QD's widget box. |
|
2362 However, it can still be used by other widgets in the form. This feature |
|
2363 is used to hide widgets that should not be explicitly created by the user, |
|
2364 but are required by other widgets. |
|
2365 |
|
2366 |
|
2367 A complete custom widget specification looks like: |
|
2368 |
|
2369 \code |
|
2370 <ui language="c++"> displayname="MyWidget"> |
|
2371 <widget class="widgets::MyWidget" name="mywidget"/> |
|
2372 <customwidgets> |
|
2373 <customwidget> |
|
2374 <class>widgets::MyWidget</class> |
|
2375 <addpagemethod>addPage</addpagemethod> |
|
2376 <propertyspecifications> |
|
2377 <stringpropertyspecification name="fileName" notr="true" type="singleline" |
|
2378 <stringpropertyspecification name="text" type="richtext" |
|
2379 </propertyspecifications> |
|
2380 </customwidget> |
|
2381 </customwidgets> |
|
2382 </ui> |
|
2383 \endcode |
|
2384 |
|
2385 Attributes of the \c{<ui>} tag: |
|
2386 \table |
|
2387 \header |
|
2388 \o Attribute |
|
2389 \o Presence |
|
2390 \o Values |
|
2391 \o Comment |
|
2392 \row |
|
2393 \o \c{language} |
|
2394 \o optional |
|
2395 \o "c++", "jambi" |
|
2396 \o This attribute specifies the language the custom widget is intended for. |
|
2397 It is mainly there to prevent C++-plugins from appearing in Qt Jambi. |
|
2398 \row |
|
2399 \o \c{displayname} |
|
2400 \o optional |
|
2401 \o Class name |
|
2402 \o The value of the attribute appears in the Widget box and can be used to |
|
2403 strip away namespaces. |
|
2404 \endtable |
|
2405 |
|
2406 The \c{<addpagemethod>} tag tells \QD and \l uic which method should be used to |
|
2407 add pages to a container widget. This applies to container widgets that require |
|
2408 calling a particular method to add a child rather than adding the child by passing |
|
2409 the parent. In particular, this is relevant for containers that are not a |
|
2410 a subclass of the containers provided in \QD, but are based on the notion |
|
2411 of \e{Current Page}. In addition, you need to provide a container extension |
|
2412 for them. |
|
2413 |
|
2414 The \c{<propertyspecifications>} element can contain a list of property meta information. |
|
2415 Currently, properties of type string are supported. For these properties, the |
|
2416 \c{<stringpropertyspecification>} tag can be used. This tag has the following attributes: |
|
2417 |
|
2418 |
|
2419 \table |
|
2420 \header |
|
2421 \o Attribute |
|
2422 \o Presence |
|
2423 \o Values |
|
2424 \o Comment |
|
2425 \row |
|
2426 \o \c{name} |
|
2427 \o required |
|
2428 \o Name of the property |
|
2429 \row |
|
2430 \o \c{type} |
|
2431 \o required |
|
2432 \o See below table |
|
2433 \o The value of the attribute determines how the property editor will handle them. |
|
2434 \row |
|
2435 \o \c{notr} |
|
2436 \o optional |
|
2437 \o "true", "false" |
|
2438 \o If the attribute is "true", the value is not meant to be translated. |
|
2439 \endtable |
|
2440 |
|
2441 Values of the \c{type} attribute of the string property: |
|
2442 |
|
2443 \table |
|
2444 \header |
|
2445 \o Value |
|
2446 \o Type |
|
2447 \row |
|
2448 \o \c{"richtext"} |
|
2449 \o Rich text. |
|
2450 \row |
|
2451 \o \c{"multiline"} |
|
2452 \o Multi-line plain text. |
|
2453 \row |
|
2454 \o \c{"singleline"} |
|
2455 \o Single-line plain text. |
|
2456 \row |
|
2457 \o \c{"stylesheet"} |
|
2458 \o A CSS-style sheet. |
|
2459 \row |
|
2460 \o \c{"objectname"} |
|
2461 \o An object name (restricted set of valid characters). |
|
2462 \row |
|
2463 \o \c{"url"} |
|
2464 \o URL, file name. |
|
2465 \endtable |
|
2466 |
|
2467 \section1 Plugin Requirements |
|
2468 |
|
2469 In order for plugins to work correctly on all platforms, you need to ensure |
|
2470 that they export the symbols needed by \QD. |
|
2471 |
|
2472 First of all, the plugin class must be exported in order for the plugin to |
|
2473 be loaded by \QD. Use the Q_EXPORT_PLUGIN2() macro to do this. Also, the |
|
2474 QDESIGNER_WIDGET_EXPORT macro must be used to define each custom widget class |
|
2475 within a plugin, that \QD will instantiate. |
|
2476 |
|
2477 |
|
2478 \section1 Creating Well Behaved Widgets |
|
2479 |
|
2480 Some custom widgets have special user interface features that may make them |
|
2481 behave differently to many of the standard widgets found in \QD. |
|
2482 Specifically, if a custom widget grabs the keyboard as a result of a call |
|
2483 to QWidget::grabKeyboard(), the operation of \QD will be affected. |
|
2484 |
|
2485 To give custom widgets special behavior in \QD, provide an implementation |
|
2486 of the initialize() function to configure the widget construction process |
|
2487 for \QD specific behavior. This function will be called for the first time |
|
2488 before any calls to createWidget() and could perhaps set an internal flag |
|
2489 that can be tested later when \QD calls the plugin's createWidget() |
|
2490 function. |
|
2491 |
|
2492 |
|
2493 \target BuildingandInstallingthePlugin |
|
2494 \section1 Building and Installing the Plugin |
|
2495 |
|
2496 \section2 A Simple Plugin |
|
2497 |
|
2498 The \l{Custom Widget Plugin Example} demonstrates a simple \QD plugin. |
|
2499 |
|
2500 The \c{.pro} file for a plugin must specify the headers and sources for |
|
2501 both the custom widget and the plugin interface. Typically, this file only |
|
2502 has to specify that the plugin's project is to be built as a library, but |
|
2503 with specific plugin support for \QD. This is done with the following |
|
2504 declarations: |
|
2505 |
|
2506 \snippet examples/designer/customwidgetplugin/customwidgetplugin.pro 1 |
|
2507 |
|
2508 If Qt is configured to build in both debug and release modes, \QD will be |
|
2509 built in release mode. When this occurs, it is necessary to ensure that |
|
2510 plugins are also built in release mode. To do this, include the following |
|
2511 declaration in the plugin's \c{.pro} file: |
|
2512 |
|
2513 \snippet doc/src/snippets/code/doc_src_designer-manual.qdoc 3 |
|
2514 |
|
2515 If plugins are built in a mode that is incompatible with \QD, they will |
|
2516 not be loaded and installed. For more information about plugins, see the |
|
2517 \l{plugins-howto.html}{Plugins HOWTO} document. |
|
2518 |
|
2519 It is also necessary to ensure that the plugin is installed together with |
|
2520 other \QD widget plugins: |
|
2521 |
|
2522 \snippet doc/src/snippets/code/doc_src_designer-manual.qdoc 4 |
|
2523 |
|
2524 The \c $[QT_INSTALL_PLUGINS] variable is a placeholder to the location of |
|
2525 the installed Qt plugins. You can configure \QD to look for plugins in |
|
2526 other locations by setting the \c QT_PLUGIN_PATH environment variable |
|
2527 before running the application. |
|
2528 |
|
2529 \note \QD will look for a \c designer subdirectory in each path supplied. |
|
2530 |
|
2531 See QCoreApplication::libraryPaths() for more information about customizing |
|
2532 paths for libraries and plugins with Qt applications. |
|
2533 |
|
2534 \section2 Splitting up the Plugin |
|
2535 |
|
2536 In a real world scenario, you do not want to have dependencies of the |
|
2537 application making use of the custom widgets to the \QD headers and |
|
2538 libraries as introduced by the simple approach explained above. |
|
2539 |
|
2540 There are two ways to resolve this: |
|
2541 |
|
2542 \list |
|
2543 \i Create a \c{.pri} file that contains the headers sources and sources |
|
2544 of the custom widget: |
|
2545 |
|
2546 \code |
|
2547 INCLUDEPATH += $$PWD |
|
2548 HEADERS += $$PWD/analogclock.h |
|
2549 SOURCES += $$PWD/analogclock.cpp |
|
2550 \endcode |
|
2551 |
|
2552 This file would then be included by the \c{.pro} file of the plugin and |
|
2553 the application: |
|
2554 |
|
2555 \code |
|
2556 include(customwidget.pri) |
|
2557 \endcode |
|
2558 |
|
2559 Running \c{qmake -Wall} on the \c{.pro} files causes a warning to be |
|
2560 printed if an included \c{.pri} file cannot be found. |
|
2561 |
|
2562 \i Create a standalone shared library containing the custom widgets only |
|
2563 as described in |
|
2564 \l{sharedlibrary.html}{Creating Shared Libraries}. |
|
2565 |
|
2566 This library would then be used by the application as well as by the |
|
2567 \QD plugin. Care must be taken to ensure that the plugin can locate |
|
2568 the library at run-time. |
|
2569 \endlist |
|
2570 |
|
2571 \section1 Related Examples |
|
2572 |
|
2573 For more information on using custom widgets in \QD, refer to the |
|
2574 \l{designer/customwidgetplugin}{Custom Widget Plugin} and |
|
2575 \l{designer/worldtimeclockplugin}{World Time Clock Plugin} examples for more |
|
2576 information about using custom widgets in \QD. Also, you can use the |
|
2577 QDesignerCustomWidgetCollectionInterface class to combine several custom |
|
2578 widgets into a single library. |
|
2579 */ |
|
2580 |
|
2581 |
|
2582 /*! |
|
2583 \page designer-creating-custom-widgets-extensions.html |
|
2584 \previouspage Creating Custom Widgets for Qt Designer |
|
2585 \nextpage Qt Designer's UI File Format |
|
2586 \contentspage {Qt Designer Manual}{Contents} |
|
2587 |
|
2588 \title Creating Custom Widget Extensions |
|
2589 |
|
2590 Once you have a custom widget plugin for \QD, you can provide it with the |
|
2591 expected behavior and functionality within \QD's workspace, using custom |
|
2592 widget extensions. |
|
2593 |
|
2594 |
|
2595 \section1 Extension Types |
|
2596 |
|
2597 There are several available types of extensions in \QD. You can use all of |
|
2598 these extensions in the same pattern, only replacing the respective |
|
2599 extension base class. |
|
2600 |
|
2601 QDesignerContainerExtension is necessary when implementing a custom |
|
2602 multi-page container. |
|
2603 |
|
2604 \table |
|
2605 \row |
|
2606 \i \inlineimage designer-manual-taskmenuextension.png |
|
2607 \i \bold{QDesignerTaskMenuExtension} |
|
2608 |
|
2609 QDesignerTaskMenuExtension is useful for custom widgets. It provides an |
|
2610 extension that allows you to add custom menu entries to \QD's task |
|
2611 menu. |
|
2612 |
|
2613 The \l{designer/taskmenuextension}{Task Menu Extension} example |
|
2614 illustrates how to use this class. |
|
2615 |
|
2616 \row |
|
2617 \i \inlineimage designer-manual-containerextension.png |
|
2618 \i \bold{QDesignerContainerExtension} |
|
2619 |
|
2620 QDesignerContainerExtension is necessary when implementing a custom |
|
2621 multi-page container. It provides an extension that allows you to add |
|
2622 and delete pages for a multi-page container plugin in \QD. |
|
2623 |
|
2624 The \l{designer/containerextension}{Container Extension} example |
|
2625 further explains how to use this class. |
|
2626 |
|
2627 \note It is not possible to add custom per-page properties for some |
|
2628 widgets (e.g., QTabWidget) due to the way they are implemented. |
|
2629 \endtable |
|
2630 |
|
2631 \table |
|
2632 \row |
|
2633 \i \inlineimage designer-manual-membersheetextension.png |
|
2634 \i \bold{QDesignerMemberSheetExtension} |
|
2635 |
|
2636 The QDesignerMemberSheetExtension class allows you to manipulate a |
|
2637 widget's member functions displayed when connecting signals and slots. |
|
2638 |
|
2639 \row |
|
2640 \i \inlineimage designer-manual-propertysheetextension.png |
|
2641 \i \bold{QDesignerPropertySheetExtension, |
|
2642 QDesignerDynamicPropertySheetExtension} |
|
2643 |
|
2644 These extension classes allow you to control how a widget's properties |
|
2645 are displayed in \QD's property editor. |
|
2646 \endtable |
|
2647 |
|
2648 \omit |
|
2649 \row |
|
2650 \o |
|
2651 \o \bold {QDesignerScriptExtension} |
|
2652 |
|
2653 The QDesignerScriptExtension class allows you to define script |
|
2654 snippets that are executed when a form is loaded. The extension |
|
2655 is primarily intended to be used to set up the internal states |
|
2656 of custom widgets. |
|
2657 \endtable |
|
2658 \endomit |
|
2659 |
|
2660 |
|
2661 \QD uses the QDesignerPropertySheetExtension and the |
|
2662 QDesignerMemberSheetExtension classes to feed its property and signal and |
|
2663 slot editors. Whenever a widget is selected in its workspace, \QD will |
|
2664 query for the widget's property sheet extension; likewise, whenever a |
|
2665 connection between two widgets is requested, \QD will query for the |
|
2666 widgets' member sheet extensions. |
|
2667 |
|
2668 \warning All widgets have default property and member sheets. If you |
|
2669 implement custom property sheet or member sheet extensions, your custom |
|
2670 extensions will override the default sheets. |
|
2671 |
|
2672 |
|
2673 \section1 Creating an Extension |
|
2674 |
|
2675 To create an extension you must inherit both QObject and the appropriate |
|
2676 base class, and reimplement its functions. Since we are implementing an |
|
2677 interface, we must ensure that it is made known to the meta object system |
|
2678 using the Q_INTERFACES() macro in the extension class's definition. For |
|
2679 example: |
|
2680 |
|
2681 \snippet doc/src/snippets/code/doc_src_designer-manual.qdoc 7 |
|
2682 |
|
2683 This enables \QD to use the qobject_cast() function to query for supported |
|
2684 interfaces using a QObject pointer only. |
|
2685 |
|
2686 |
|
2687 \section1 Exposing an Extension to Qt Designer |
|
2688 |
|
2689 In \QD the extensions are not created until they are required. For this |
|
2690 reason, when implementing extensions, you must subclass QExtensionFactory |
|
2691 to create a class that is able to make instances of your extensions. Also, |
|
2692 you must register your factory with \QD's extension manager; the extension |
|
2693 manager handles the construction of extensions. |
|
2694 |
|
2695 When an extension is requested, \QD's extension manager will run through |
|
2696 its registered factories calling QExtensionFactory::createExtension() for |
|
2697 each of them until it finds one that is able to create the requested |
|
2698 extension for the selected widget. This factory will then make an instance |
|
2699 of the extension. |
|
2700 |
|
2701 \image qtdesignerextensions.png |
|
2702 |
|
2703 |
|
2704 \section2 Creating an Extension Factory |
|
2705 |
|
2706 The QExtensionFactory class provides a standard extension factory, but it |
|
2707 can also be used as an interface for custom extension factories. |
|
2708 |
|
2709 The purpose is to reimplement the QExtensionFactory::createExtension() |
|
2710 function, making it able to create your extension, such as a |
|
2711 \l{designer/containerextension}{MultiPageWidget} container extension. |
|
2712 |
|
2713 You can either create a new QExtensionFactory and reimplement the |
|
2714 QExtensionFactory::createExtension() function: |
|
2715 |
|
2716 \snippet doc/src/snippets/code/doc_src_designer-manual.qdoc 8 |
|
2717 |
|
2718 or you can use an existing factory, expanding the |
|
2719 QExtensionFactory::createExtension() function to enable the factory to |
|
2720 create your custom extension as well: |
|
2721 |
|
2722 \snippet doc/src/snippets/code/doc_src_designer-manual.qdoc 9 |
|
2723 |
|
2724 |
|
2725 \section2 Accessing Qt Designer's Extension Manager |
|
2726 |
|
2727 When implementing a custom widget plugin, you must subclass the |
|
2728 QDesignerCustomWidgetInterface to expose your plugin to \QD. This is |
|
2729 covered in more detail in the |
|
2730 \l{Creating Custom Widgets for Qt Designer} section. The registration of |
|
2731 an extension factory is typically made in the |
|
2732 QDesignerCustomWidgetInterface::initialize() function: |
|
2733 |
|
2734 \snippet doc/src/snippets/code/doc_src_designer-manual.qdoc 10 |
|
2735 |
|
2736 The \c formEditor parameter in the |
|
2737 QDesignerCustomWidgetInterface::initialize() function is a pointer to \QD's |
|
2738 current QDesignerFormEditorInterface object. You must use the |
|
2739 QDesignerFormEditorInterface::extensionManager() function to retrieve an |
|
2740 interface to \QD's extension manager. Then you use the |
|
2741 QExtensionManager::registerExtensions() function to register your custom |
|
2742 extension factory. |
|
2743 |
|
2744 |
|
2745 \section1 Related Examples |
|
2746 |
|
2747 For more information on creating custom widget extensions in \QD, refer to |
|
2748 the \l{designer/taskmenuextension}{Task Menu Extension} and |
|
2749 \l{designer/containerextension}{Container Extension} examples. |
|
2750 */ |
|
2751 |
|
2752 |
|
2753 /*! |
|
2754 \page designer-ui-file-format.html |
|
2755 \previouspage Creating Custom Widget Extensions |
|
2756 \contentspage {Qt Designer Manual}{Contents} |
|
2757 |
|
2758 \title Qt Designer's UI File Format |
|
2759 |
|
2760 The \c UI file format used by \QD is described by the |
|
2761 \l{http://www.w3.org/XML/Schema}{XML schema} presented below, |
|
2762 which we include for your convenience. Be aware that the format |
|
2763 may change in future Qt releases. |
|
2764 |
|
2765 \quotefile tools/designer/data/ui4.xsd |
|
2766 */ |
|
2767 |
|
2768 |
|
2769 /*! |
|
2770 \page designer-recursive-shadow-casting.html |
|
2771 \title Implementation of the Recursive Shadow Casting Algorithm in Qt Designer |
|
2772 \contentspage {Qt Designer Manual}{Contents} |
|
2773 |
|
2774 \ingroup licensing |
|
2775 \brief License information for contributions to specific parts of the Qt |
|
2776 Designer source code. |
|
2777 |
|
2778 \legalese |
|
2779 Copyright (C) 2009 Nokia Corporation and/or its subsidiary(-ies). \BR |
|
2780 Copyright (C) 2005 Bjoern Bergstroem |
|
2781 |
|
2782 Permission is hereby granted, free of charge, to any person obtaining |
|
2783 a copy of this software and associated documentation files (the |
|
2784 "Software"), to deal in the Software without restriction, including |
|
2785 without limitation the rights to use, modify, market, reproduce, |
|
2786 grant sublicenses and distribute subject to the following conditions: |
|
2787 The above copyright notice and this permission notice shall be |
|
2788 included in all copies or substantial portions of the Software. These |
|
2789 files are provided AS IS with NO WARRANTY OF ANY KIND, INCLUDING THE |
|
2790 WARRANTY OF DESIGN, MERCHANTIBILITY AND FITNESS FOR A PARTICULAR |
|
2791 PURPOSE. |
|
2792 \endlegalese |
|
2793 */ |