diff options
Diffstat (limited to 'doc/html/designer-manual-3.html')
| -rw-r--r-- | doc/html/designer-manual-3.html | 18 |
1 files changed, 9 insertions, 9 deletions
diff --git a/doc/html/designer-manual-3.html b/doc/html/designer-manual-3.html index e0dd2b3f0..1cd7e09fc 100644 --- a/doc/html/designer-manual-3.html +++ b/doc/html/designer-manual-3.html @@ -69,18 +69,18 @@ body { background: #ffffff; color: black; } </ol><p align="center"><img align="middle" src="mw-newfile.png" width="565" height="330"> </p> <p>The <em>New File</em> dialog is used to create all the files that can be used in a <em>TQt Designer</em> project. This includes C++ source files, an automatically generated <tt>main.cpp</tt> file (if you are in a project), and a variety of forms based on pre-defined templates. (You can create your own templates too.)</p> -<p>For the <tt>colortool</tt> application we want to start with a main window form. When we create this form, <em>TQt Designer</em> will present a wizard which we can use to automatically create menu and toolbar options and automatically create the relevant signal/slot connections. For every menu option or toolbar button, <em>TQt Designer</em> will create a single <a href="ntqaction.html">TQAction</a> (see the <a href="designer-manual-3.html#actions-and-action-groups-sidebar">Actions and Action Groups</a> sidebar).</p> +<p>For the <tt>colortool</tt> application we want to start with a main window form. When we create this form, <em>TQt Designer</em> will present a wizard which we can use to automatically create menu and toolbar options and automatically create the relevant signal/slot connections. For every menu option or toolbar button, <em>TQt Designer</em> will create a single <a href="tqaction.html">TQAction</a> (see the <a href="designer-manual-3.html#actions-and-action-groups-sidebar">Actions and Action Groups</a> sidebar).</p> <blockquote> <p align="center"><b> Actions and Action Groups</b></p> <a name="actions-and-action-groups-sidebar"></a><p>An <em>action</em> is an operation that the user initiates through the user interface, for example, saving a file or changing some text's font weight to bold.</p> -<p>We often want the user to be able to perform an action using a variety of means. For example, to save a file we might want the user to be able to press <b>Ctrl+S</b>, or to click the <b>Save</b> toolbar button or to click the <b>File|Save</b> menu option. Although the means of invoking the action are all different, the underlying operation is the same and we don't want to duplicate the code that performs the operation. In TQt we can create an action (a <a href="ntqaction.html">TQAction</a> object) which will call the appropriate function when the action is invoked. We can assign an accelerator, (e.g. <b>Ctrl+S</b>), to an action. We can also add an action to a menu and to a toolbar.</p> +<p>We often want the user to be able to perform an action using a variety of means. For example, to save a file we might want the user to be able to press <b>Ctrl+S</b>, or to click the <b>Save</b> toolbar button or to click the <b>File|Save</b> menu option. Although the means of invoking the action are all different, the underlying operation is the same and we don't want to duplicate the code that performs the operation. In TQt we can create an action (a <a href="tqaction.html">TQAction</a> object) which will call the appropriate function when the action is invoked. We can assign an accelerator, (e.g. <b>Ctrl+S</b>), to an action. We can also add an action to a menu and to a toolbar.</p> <p>If the action has an on/off state, e.g. bold is on or off, when the user changes the state, for example by clicking a toolbar button, the state of everything associated with the action, e.g. menu items and toolbar buttons, is updated.</p> -<p>Some actions should operate together like radio buttons. For example, if we have left align, center align and right align actions, only one should be 'on' at any one time. An <em>action group</em> (a <a href="qactiongroup.html">TQActionGroup</a> object) is used to group a set of actions together. If the action group's <tt>exclusive</tt> property is TRUE then only one of the actions in the group can be on at any one time. If the user changes the state of an action in an action group where <tt>exclusive</tt> is TRUE, everything associated with the actions in the action group, e.g. menu items and toolbar buttons, is updated.</p> +<p>Some actions should operate together like radio buttons. For example, if we have left align, center align and right align actions, only one should be 'on' at any one time. An <em>action group</em> (a <a href="tqactiongroup.html">TQActionGroup</a> object) is used to group a set of actions together. If the action group's <tt>exclusive</tt> property is TRUE then only one of the actions in the group can be on at any one time. If the user changes the state of an action in an action group where <tt>exclusive</tt> is TRUE, everything associated with the actions in the action group, e.g. menu items and toolbar buttons, is updated.</p> <!-- index Actions and Action Groups --><p><em>TQt Designer</em> can create actions and action groups visually, assign accelerators to them, and associate them with menu items and toolbar buttons.</p> </blockquote> <h3><a name="4"></a>Creating the Main Window</h3> <!-- index Main Window!Creating --><!-- index Creating Main Windows --><!-- index Main Window!Wizard --><!-- index Wizards!Main Window --><!-- index Creating Menus --><!-- index Menus!Adding --><!-- index Adding!Menus --><!-- index Creating Toolbars --><!-- index Toolbars, Creating --><!-- index Toolbar Buttons!Adding --><!-- index Adding!Toolbars --><!-- index Adding!Actions and Action Groups --><!-- index Adding!Toolbar Buttons --><p>We will use the Main Window Wizard to build a main window. The wizard allows us to create actions as well as a menu bar and a toolbar through which the user can invoke the actions. We will also create our own actions, menus and toolbar buttons, and add a main widget to the main window.</p> -<p>Click <b>File|New</b> to invoke the <em>New File</em> dialog, click "Main Window" to create a main window form, then click <b>OK</b>. A new <a href="ntqmainwindow.html">TQMainWindow</a> form will be created and the <em>Main Window Wizard</em> will pop up.</p> +<p>Click <b>File|New</b> to invoke the <em>New File</em> dialog, click "Main Window" to create a main window form, then click <b>OK</b>. A new <a href="tqmainwindow.html">TQMainWindow</a> form will be created and the <em>Main Window Wizard</em> will pop up.</p> <h4><a name="4-1"></a>Using the Main Window Wizard</h4> <ol type=1><li><p>The <em>Choose available menus and toolbars</em> page appears first. It presents three categories of default actions, File Actions, Edit Actions and Help Actions. For each category you can choose to have <em>TQt Designer</em> create menu items, toolbar buttons, and signal/slots connections for the relevant actions. You can always add or delete actions, menu items, toolbar buttons, and connections later.</p> <!-- index Creating Menus --><!-- index Menus!Adding --><!-- index Creating Toolbars --><!-- index Toolbars, Creating --><!-- index Toolbar Buttons!Adding --><!-- index Adding!Menus --><!-- index Adding!Toolbars --><!-- index Adding!Actions and Action Groups --><!-- index Adding!Toolbar Buttons --><!-- index Signals and Slots!Connecting Actions --><p>We will accept the defaults for File Actions and for the Edit Actions, i.e. have menu items, toolbar buttons and the relevant connections created. In fact we'll be changing the Edit actions considerably later on, but it is still convenient to create them now. We won't have any Help Actions on the toolbar so uncheck the Help Action's Toolbar checkbox. Click <b>Next</b> to move on to the next wizard page.</p> @@ -160,7 +160,7 @@ body { background: #ffffff; color: black; } <p>All the actions in an action group are added to a toolbar in one go, simply by dragging the action group from the Action Editor and dropping it on the toolbar.</p> <p>Since toolbar buttons normally only show an image, all actions that are to be used in toolbars should have their <em>iconSet</em> property set to a suitable image.</p> <!-- index Separator!Toolbar button --><!-- index Deleting!Toolbar Separators --><!-- index Deleting!Toolbars --><p>Toolbar buttons and separators (usually represented as indented vertical gray lines), can be dragged and dropped into new positions in the toolbar at any time. Separators can be inserted by right clicking a toolbar button and clicking <b>Insert Separator</b>. Toolbar buttons and separators can be deleted by right clicking them and then clicking Delete Item. Toolbars can be deleted by right clicking their toolbar handle and then clicking Delete Toolbar.</p> -<!-- index Previewing!Toolbars --><p>If you preview an application you'll find that all the toolbars can be dragged to different docking points (top, left, right and bottom of a <a href="ntqmainwindow.html">TQMainWindow</a> or subclass), or dragged out of the application as independent tool windows.</p> +<!-- index Previewing!Toolbars --><p>If you preview an application you'll find that all the toolbars can be dragged to different docking points (top, left, right and bottom of a <a href="tqmainwindow.html">TQMainWindow</a> or subclass), or dragged out of the application as independent tool windows.</p> </blockquote> <blockquote> <p align="center"><b> Adding Widgets to the Toolbar</b></p> @@ -205,7 +205,7 @@ body { background: #ffffff; color: black; } <p>Click the viewActionGroup action group in the Action Editor, and drag it to the View menu; drop it on this menu (when the horizontal red line appears beneath the View menu). Because we dragged the action group, <em>all</em> its actions (in our case the viewTableAction and viewIconsAction) are added to the relevant menu. We'll also make the view actions available on the toolbar. Click the viewActionGroup once again, and drag it to the toolbar; drop it the right of the separator at the far right of the toolbar, and drop it on the toolbar's edge. (Again, a vertical red line will indicate the position.)</p> <p>Don't forget that you can preview to see things in action with <b>Ctrl+T</b>, and to click <b>File|Save</b> (or press <b>Ctrl+S</b>) regularly! If you preview now you will find that if you click the view toolbar buttons and menu options that both the toolbar buttons and the menu items automatically stay in sync.</p> <h3><a name="5"></a>Creating the Main Widget</h3> -<p>Most main-window style applications consist of a menu bar, a toolbar, a status bar and a central widget. We've already created a menu bar and toolbar, and since we've created a <a href="ntqmainwindow.html">TQMainWindow</a> (via the main window wizard), we also have a status bar. Widgets commonly used as an application's main widget are <a href="ntqlistview.html">TQListView</a> (which provides a tree view), <a href="ntqtable.html">TQTable</a> and <a href="tqtextedit.html">TQTextEdit</a>. Since we want to provide our users with two different views of the same data, we'll use a <a href="tqwidgetstack.html">TQWidgetStack</a> as our main widget. The <a href="tqwidgetstack.html">TQWidgetStack</a> has no visual representation of its own; you place one or more widgets on each <a href="tqwidgetstack.html">TQWidgetStack</a> "page", as if each page was a form in its own right, and then provide the user with some mechanism for switching between pages. (This is similar in principle to using a <a href="ntqtabwidget.html">TQTabWidget</a>.) We want to provide our users with two views: a tabular view that lists colors and their names, and an icon-based view that shows color swatches. In our example we only place a single widget on each <a href="tqwidgetstack.html">TQWidgetStack</a> page; but this merely reflects the application's design -- we could have placed any number of widgets on each page.</p> +<p>Most main-window style applications consist of a menu bar, a toolbar, a status bar and a central widget. We've already created a menu bar and toolbar, and since we've created a <a href="tqmainwindow.html">TQMainWindow</a> (via the main window wizard), we also have a status bar. Widgets commonly used as an application's main widget are <a href="ntqlistview.html">TQListView</a> (which provides a tree view), <a href="ntqtable.html">TQTable</a> and <a href="tqtextedit.html">TQTextEdit</a>. Since we want to provide our users with two different views of the same data, we'll use a <a href="tqwidgetstack.html">TQWidgetStack</a> as our main widget. The <a href="tqwidgetstack.html">TQWidgetStack</a> has no visual representation of its own; you place one or more widgets on each <a href="tqwidgetstack.html">TQWidgetStack</a> "page", as if each page was a form in its own right, and then provide the user with some mechanism for switching between pages. (This is similar in principle to using a <a href="ntqtabwidget.html">TQTabWidget</a>.) We want to provide our users with two views: a tabular view that lists colors and their names, and an icon-based view that shows color swatches. In our example we only place a single widget on each <a href="tqwidgetstack.html">TQWidgetStack</a> page; but this merely reflects the application's design -- we could have placed any number of widgets on each page.</p> <p>Click the Toolbox's Containers button, then click WidgetStack. Click approximately in the middle of the form to place the widget stack. Change the widget stack's <em>name</em> property to "colorWidgetStack".</p> <p align="center"><img align="middle" src="mw-addmainwidg.png" width="641" height="394"> </p> @@ -543,9 +543,9 @@ body { background: #ffffff; color: black; } } </pre> <p>This function looks up the color name in the colors map and retrieves the color the name refers to. It then displays the name, hex value and whether the color is a web color in the status bar.</p> -<p>Note that <a href="ntqmainwindow.html">TQMainWindow</a> only creates a status bar if you actually use one. Since we haven't used one up until now we've had no problem, but if we were to try compiling we'd get an error because we're now using a status bar but haven't declared the relevant header. Click Object Explorer's Members tab and add a "ntqstatusbar.h" to the "Includes (In Implementation)" section. (Right click "Includes (In Implementation)", click <b>New</b>, enter "ntqstatusbar.h" then press <b>Enter</b>.)</p> +<p>Note that <a href="tqmainwindow.html">TQMainWindow</a> only creates a status bar if you actually use one. Since we haven't used one up until now we've had no problem, but if we were to try compiling we'd get an error because we're now using a status bar but haven't declared the relevant header. Click Object Explorer's Members tab and add a "tqstatusbar.h" to the "Includes (In Implementation)" section. (Right click "Includes (In Implementation)", click <b>New</b>, enter "tqstatusbar.h" then press <b>Enter</b>.)</p> <p>You should now have added the following declaration to your includes (in implementation):</p> -<ul><li><p>"ntqstatusbar.h"</p> +<ul><li><p>"tqstatusbar.h"</p> </ul><p>Try saving (press <b>Ctrl+S</b>), making and running the application. Move to different colors and see the status bar indicating the color you are on. (If it doesn't build see the <a href="designer-manual-4.html#6">Troubleshooting</a> section.)</p> <h4><a name="6-19"></a>Changing Views</h4> <p>Up to now we have not yet been able to see the icon view in action because there's been no code in place to switch views. We'll address this issue now.</p> @@ -558,7 +558,7 @@ body { background: #ffffff; color: black; } colorWidgetStack->raiseWidget( iconsPage ); } </pre> - <p>(If you're cutting and pasting the code don't forget to name the <a href="ntqaction.html">TQAction</a> parameter "action".)</p> + <p>(If you're cutting and pasting the code don't forget to name the <a href="tqaction.html">TQAction</a> parameter "action".)</p> <h4><a name="6-20"></a>Editing the Code: File Handling</h4> <p>Since the X Consortium has already defined a file format for relating colors to color names we will use their format rather than creating one specially for the application. This has the advantage that we will be able to read and write <tt>rgb.txt</tt>, and that our format will be familiar to many users.</p> <h4><a name="6-21"></a>fileNew()</h4> |