| 1 | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
|
|---|
| 2 | <!-- /home/espenr/tmp/qt-3.3.8-espenr-2499/qt-x11-free-3.3.8/extensions/motif/doc/walkthrough.doc:1190 -->
|
|---|
| 3 | <html>
|
|---|
| 4 | <head>
|
|---|
| 5 | <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
|
|---|
| 6 | <title>Replacing the View Widget</title>
|
|---|
| 7 | <style type="text/css"><!--
|
|---|
| 8 | fn { margin-left: 1cm; text-indent: -1cm; }
|
|---|
| 9 | a:link { color: #004faf; text-decoration: none }
|
|---|
| 10 | a:visited { color: #672967; text-decoration: none }
|
|---|
| 11 | body { background: #ffffff; color: black; }
|
|---|
| 12 | --></style>
|
|---|
| 13 | </head>
|
|---|
| 14 | <body>
|
|---|
| 15 |
|
|---|
| 16 | <table border="0" cellpadding="0" cellspacing="0" width="100%">
|
|---|
| 17 | <tr bgcolor="#E5E5E5">
|
|---|
| 18 | <td valign=center>
|
|---|
| 19 | <a href="index.html">
|
|---|
| 20 | <font color="#004faf">Home</font></a>
|
|---|
| 21 | | <a href="classes.html">
|
|---|
| 22 | <font color="#004faf">All Classes</font></a>
|
|---|
| 23 | | <a href="mainclasses.html">
|
|---|
| 24 | <font color="#004faf">Main Classes</font></a>
|
|---|
| 25 | | <a href="annotated.html">
|
|---|
| 26 | <font color="#004faf">Annotated</font></a>
|
|---|
| 27 | | <a href="groups.html">
|
|---|
| 28 | <font color="#004faf">Grouped Classes</font></a>
|
|---|
| 29 | | <a href="functions.html">
|
|---|
| 30 | <font color="#004faf">Functions</font></a>
|
|---|
| 31 | </td>
|
|---|
| 32 | <td align="right" valign="center"><img src="logo32.png" align="right" width="64" height="32" border="0"></td></tr></table><h1 align=center>Replacing the View Widget</h1>
|
|---|
| 33 |
|
|---|
| 34 |
|
|---|
| 35 |
|
|---|
| 36 | [ <a href="motif-walkthrough-7.html">Previous: Refactoring Existing Code</a> ]
|
|---|
| 37 | [ <a href="motif-walkthrough.html">Home</a> ]
|
|---|
| 38 | [ <a href="motif-walkthrough-9.html">Next: Replacing the Print Dialog</a> ]
|
|---|
| 39 | <p> We are ready to start replacing the <em>View</em> widget. However, our
|
|---|
| 40 | example program uses the <tt>XmNotebook</tt> widget class. Qt does not
|
|---|
| 41 | provide a direct equivalent of this class, so we are faced with three
|
|---|
| 42 | possibilities, each with several advantages and disadvantages.
|
|---|
| 43 | <p> <ol type=1>
|
|---|
| 44 | <p> <li> We can continue the conversion using existing Qt widgets.
|
|---|
| 45 | <p> <ul>
|
|---|
| 46 | <p> <li> Advantages - The widgets provided by Qt are well designed and
|
|---|
| 47 | tested, allowing us to quickly redesign the user interface.
|
|---|
| 48 | <p> <li> Disadvantages - Most, if not all, of the existing data structures
|
|---|
| 49 | and code will need to be modified or rewritten. New code must be
|
|---|
| 50 | written in a way that maintains compatibility with previous versions
|
|---|
| 51 | of our application.
|
|---|
| 52 | <p> </ul>
|
|---|
| 53 | <p> <li> We can write a new <a href="qwidget.html">QWidget</a> subclass that is identical to the <tt>XmNotebook</tt> widget class.
|
|---|
| 54 | <p> <ul>
|
|---|
| 55 | <p> <li> Advantages - The existing data structures will not change, allowing
|
|---|
| 56 | compatibility with previous and future versions.
|
|---|
| 57 | <p> <li> Disadvantages - The new widget will need to be written and
|
|---|
| 58 | regression tested. Existing code in our application will need to be
|
|---|
| 59 | changed in order to deal with the new widget's API.
|
|---|
| 60 | <p> </ul>
|
|---|
| 61 | <p> <li> We can leave the <tt>XmNotebook</tt> widget untouched.
|
|---|
| 62 | <p> <ul>
|
|---|
| 63 | <p> <li> Advantages - The existing data structures and code remain
|
|---|
| 64 | unchanged, allowing us to continue development on other projects,
|
|---|
| 65 | new features, etc.
|
|---|
| 66 | <p> <li> Disadvantages - This is the simplest solution, but the application
|
|---|
| 67 | will still be dependent upon X11; we will not be able to deploy our
|
|---|
| 68 | application on all platforms supported by Qt.
|
|---|
| 69 | <p> </ul>
|
|---|
| 70 | <p> </ol>
|
|---|
| 71 | <p> We will use the first approach to complete the migration of the
|
|---|
| 72 | example project used in this walkthrough, using <a href="qtextedit.html">QTextEdit</a>, <a href="qlabel.html">QLabel</a> and
|
|---|
| 73 | <a href="qspinbox.html">QSpinBox</a> to provide a similar look. The only difference is that we
|
|---|
| 74 | will not have tabs.
|
|---|
| 75 | <p> We use <a href="designer-manual.html">Qt Designer</a> to add the
|
|---|
| 76 | QTextEdit, QLabel and QSpinBox widgets to the <em>Main Window</em> widget.
|
|---|
| 77 | <p> <h2> Data Structure Modifications
|
|---|
| 78 | </h2>
|
|---|
| 79 | <a name="1"></a><p> The <tt>Page</tt> struct contains <tt>majorPB</tt> and <tt>minorPB</tt> members which
|
|---|
| 80 | need to be removed. These members correspond to the tabs displayed in
|
|---|
| 81 | the existing version. The new version will not have any tabs, so we
|
|---|
| 82 | remove them.
|
|---|
| 83 | <p>
|
|---|
| 84 |
|
|---|
| 85 | <pre></pre>
|
|---|
| 86 | <p> <h2> Code Modifications
|
|---|
| 87 | </h2>
|
|---|
| 88 | <a name="2"></a><p> Most of the existing functions in our application need to be modified
|
|---|
| 89 | to work with the new <em>View</em> widget. The <tt>MainWindow</tt> class has five
|
|---|
| 90 | new functions that correspond to existing functions.
|
|---|
| 91 | <p> <center><table cellpadding="4" cellspacing="2" border="0">
|
|---|
| 92 | <tr bgcolor="#a2c511"> <th valign="top">Existing Function <th valign="top">New Function
|
|---|
| 93 | <tr bgcolor="#f0f0f0"> <td valign="top"><tt>void SetPage( int )</tt> <td valign="top"><tt>void MainWindow::setPage( int )</tt>
|
|---|
| 94 | <tr bgcolor="#d0d0d0"> <td valign="top"><tt>void PageChange( ... )</tt> <td valign="top"><tt>void MainWnidow::pageChange( int )</tt>
|
|---|
| 95 | <tr bgcolor="#f0f0f0"> <td valign="top"><tt>void TextChanged( ... )</tt> <td valign="top"><tt>void MainWnidow::textChanged()</tt>
|
|---|
| 96 | <tr bgcolor="#d0d0d0"> <td valign="top"><tt>void ReadDB( char * )</tt> <td valign="top"><tt>void MainWindow::readDB( char * )</tt>
|
|---|
| 97 | <tr bgcolor="#f0f0f0"> <td valign="top"><tt>void SaveDB( char * )</tt> <td valign="top"><tt>void MainWindow::saveDB( char * )</tt>
|
|---|
| 98 | </table></center>
|
|---|
| 99 | <p> <a name="mainwindow-ui-h-view-widget-modifications"></a>
|
|---|
| 100 | <p> The <tt>SetPage()</tt> function implementation is moved to the <tt>MainWindow::setPage()</tt> function in <tt>mainwindow.ui.h</tt>. We remove the
|
|---|
| 101 | <tt>SetPage()</tt> function declaration and implementation from <tt>page.h</tt>
|
|---|
| 102 | and <tt>actions.cpp</tt>, respectively. In order to make <tt>MainWindow::setPage()</tt> work correctly, we need to modify the code to
|
|---|
| 103 | use the new widgets in our <em>Main Window</em> widget.
|
|---|
| 104 | <p>
|
|---|
| 105 |
|
|---|
| 106 | <pre></pre>
|
|---|
| 107 | <p> First, we set the current value of the <tt>spinbox</tt> to the current page
|
|---|
| 108 | number.
|
|---|
| 109 | <p> <pre></pre>
|
|---|
| 110 | <p> Next, we set the current text and cursor position of the <tt>textedit</tt>
|
|---|
| 111 | to the contents of the current page.
|
|---|
| 112 | <p> <pre></pre>
|
|---|
| 113 | <p> If the current page has a custom label, we set it as the current text
|
|---|
| 114 | of the <tt>textlabel</tt>; otherwise we set the <tt>textlabel</tt> contents to
|
|---|
| 115 | "Page X" (where X is the current page number).
|
|---|
| 116 | <p> <pre></pre>
|
|---|
| 117 | <p> If the current page has major and/or minor tab text, we append these
|
|---|
| 118 | to the <tt>labeltext</tt>. This ensures that all information entered by the
|
|---|
| 119 | user remains visible.
|
|---|
| 120 | <p> <pre></pre>
|
|---|
| 121 | <p> We should continue to handle the possibility that the current page
|
|---|
| 122 | does not exist. In this case, we clear the contents of the <tt>textedit</tt> widget and set the <tt>textlabel</tt> contents to the current page
|
|---|
| 123 | number (with an indication that the page is invalid).
|
|---|
| 124 | <p> <pre></pre>
|
|---|
| 125 | <p> The <tt>PageChange()</tt> function is moved from <tt>todo.cpp</tt> to the <tt>MainWindow::pageChange()</tt> function in <tt>mainwindow.ui.h</tt>. As with the
|
|---|
| 126 | <tt>MainWindow::setPae()</tt> function, we need to modify the code to use
|
|---|
| 127 | the new widgets in our <em>Main Window</em> widget.
|
|---|
| 128 | <p> Note: <a href="qtextedit.html#text">QTextEdit::text</a>() returns a <a href="qstring.html">QString</a>, which needs to be converted
|
|---|
| 129 | into a normal <tt>char*</tt> array. To do this we create a copy of the
|
|---|
| 130 | string in the local encoding. We need to make the copy using <a href="qcstring.html#qstrdup">qstrdup</a>() because the data contained in the <a href="qcstring.html">QCString</a> returned by
|
|---|
| 131 | <a href="qstring.html#local8Bit">QString::local8Bit</a>() is deallocated when the QCString is destroyed.
|
|---|
| 132 | <p> <pre></pre>
|
|---|
| 133 | <p> The <tt>TextChanged()</tt> function does nothing more than set the <tt>modified</tt> variable to 1. Our new <tt>MainWindow::textChanged()</tt> function
|
|---|
| 134 | does exactly the same.
|
|---|
| 135 | <p> <pre></pre>
|
|---|
| 136 | <p> Since both the <tt>MainWindow::pageChange()</tt> and <tt>MainWindow::textChanged()</tt> functions access the <tt>modified</tt> global
|
|---|
| 137 | variable, we add a forward declaration at the top of <tt>mainwindow.ui.h</tt>.
|
|---|
| 138 | <p> <a name="io-cpp-view-widget-modifications"></a>
|
|---|
| 139 | <p> The <tt>ReadDB()</tt> and \s SaveDB() implementations in <tt>io.cpp</tt> are
|
|---|
| 140 | renamed to <tt>MainWindow::readDB()</tt> and <tt>MainWindow::saveDB()</tt>,
|
|---|
| 141 | respectively. We need to modify the code in order to make the code
|
|---|
| 142 | work properly.
|
|---|
| 143 | <p> First, We add <tt>#include</tt> statements for the <tt>MainWindow</tt>, <a href="qspinbox.html">QSpinBox</a>
|
|---|
| 144 | and <a href="qtextedit.html">QTextEdit</a> classes.
|
|---|
| 145 | <p>
|
|---|
| 146 |
|
|---|
| 147 | <pre></pre><pre></pre>
|
|---|
| 148 | <p> The new <tt>MainWindow::readDB()</tt> and <tt>MainWindow::saveDB()</tt> functions
|
|---|
| 149 | will not use any Xt/Motif functions, so we remove the Xt/Motif <tt>#include</tt> statements and the global variables <tt>notebook</tt> and <tt>textw</tt>.
|
|---|
| 150 | These functions remain largely unchanged, maintaining compatibility
|
|---|
| 151 | with previous versions. Also, the <tt>ReadDB()</tt> and <tt>SaveDB()</tt>
|
|---|
| 152 | functions have been converted into <tt>MainWindow</tt> member functions, so
|
|---|
| 153 | we can pass <em>this</em> as the <em>parent</em> argument to the <a href="qmessagebox.html">QMessageBox</a>
|
|---|
| 154 | functions.
|
|---|
| 155 | <p> <pre></pre>
|
|---|
| 156 | <p> After reading the file in the <tt>MainWindow::readDB()</tt> function, we set
|
|---|
| 157 | the current and maximum values of the <tt>spinbox</tt> to the appropriate
|
|---|
| 158 | values.
|
|---|
| 159 | <p>
|
|---|
| 160 |
|
|---|
| 161 | <p> <pre></pre>
|
|---|
| 162 | <p> In the <tt>MainWindow::saveDB()</tt> function, we need to store the text
|
|---|
| 163 | currently displayed, so we use <a href="qtextedit.html#text">QTextEdit::text</a>() instead of <tt>XmTextGetString()</tt>. Note: QTextEdit::text() returns a <a href="qstring.html">QString</a>, which
|
|---|
| 164 | needs to be converted into a normal <tt>char*</tt> array. To do this we
|
|---|
| 165 | create a copy of the string in the local encoding. We need to make
|
|---|
| 166 | the copy using <a href="qcstring.html#qstrdup">qstrdup</a>() because the data contained in the <a href="qcstring.html">QCString</a>
|
|---|
| 167 | returned by <a href="qstring.html#local8Bit">QString::local8Bit</a>() is deallocated when the QCString is
|
|---|
| 168 | destroyed.
|
|---|
| 169 | <p> <pre></pre>
|
|---|
| 170 | <p> <a name="actions-cpp-viewwidget-modifications"></a>
|
|---|
| 171 | <p> Due to the removal of the <tt>majorPB</tt> and <tt>minorPB</tt> members from the
|
|---|
| 172 | <tt>Page</tt> struct, the <tt>FixPages()</tt> function in <tt>actions.cpp</tt> is no
|
|---|
| 173 | longer needed. We remove the implementation and forward declaration
|
|---|
| 174 | of <tt>FixPages()</tt> from <tt>actions.cpp</tt> and <tt>page.h</tt>, respectively.
|
|---|
| 175 | Calls to <tt>FixPages()</tt> are removed from the <tt>MainWindow::selNewPage()</tt> and <tt>MainWindow::selDeletePage()</tt>, both of
|
|---|
| 176 | which are in <tt>mainwindow.ui.h</tt>.
|
|---|
| 177 | <p> We move <tt>AdjustPages()</tt> to <tt>mainwindow.ui.h</tt> and make it <tt>static</tt>,
|
|---|
| 178 | since it is only used in this file. We remove the forward declaration
|
|---|
| 179 | from <tt>page.h</tt> as well.
|
|---|
| 180 | <p> After our modifications, the <tt>actions.cpp</tt> file is empty. We remove
|
|---|
| 181 | it from our project file and regenerate our <tt>Makefile</tt>.
|
|---|
| 182 | <p> <a name="todo-cpp-view-widget-modifications"></a>
|
|---|
| 183 | <p> Now that we have implemented our new <em>View</em> widget, we need to remove
|
|---|
| 184 | the old <a href="motif-extension.html#Motif">Motif</a> based view widget from <tt>todo.cpp</tt>.
|
|---|
| 185 | <p> Since we will not be using any Motif widgets, we remove all Motif <tt>#include</tt> statements, including <a href="qmotifwidget-h.html">qmotifwidget.h</a>.
|
|---|
| 186 | <p>
|
|---|
| 187 |
|
|---|
| 188 | <pre></pre><pre></pre>
|
|---|
| 189 | <p> We also remove the forward declarations of the <tt>ReadDB()</tt> function
|
|---|
| 190 | and the <tt>notebook</tt>, <tt>textw</tt> and <tt>labelw</tt> global variables.
|
|---|
| 191 | <p> <pre></pre>
|
|---|
| 192 | <p> Next, we remove the <tt>center</tt> widget, which uses <a href="qmotifwidget.html">QMotifWidget</a>. The <em>Main Window</em> widget and <em>View</em> widget are contained entirely in our
|
|---|
| 193 | <tt>MainWindow</tt> class, so no extra initialization is needed after
|
|---|
| 194 | creating the <tt>mainwindow</tt> widget.
|
|---|
| 195 | <p> <pre></pre>
|
|---|
| 196 | <p> Since the <tt>ReadDB()</tt> and <tt>SetPage()</tt> functions have been changed into
|
|---|
| 197 | <tt>MainWindow</tt> member functions, we need to call them using our <tt>mainwindow</tt> instance.
|
|---|
| 198 | <p> <pre></pre>
|
|---|
| 199 | <p> The <em>View</em> widget has now been replaced. After building our project,
|
|---|
| 200 | we confirm that the application works correctly.
|
|---|
| 201 | <p> [ <a href="motif-walkthrough-7.html">Previous: Refactoring Existing Code</a> ]
|
|---|
| 202 | [ <a href="motif-walkthrough.html">Home</a> ]
|
|---|
| 203 | [ <a href="motif-walkthrough-9.html">Next: Replacing the Print Dialog</a> ]
|
|---|
| 204 | <p>
|
|---|
| 205 | <!-- eof -->
|
|---|
| 206 | <p><address><hr><div align=center>
|
|---|
| 207 | <table width=100% cellspacing=0 border=0><tr>
|
|---|
| 208 | <td>Copyright © 2007
|
|---|
| 209 | <a href="troll.html">Trolltech</a><td align=center><a href="trademarks.html">Trademarks</a>
|
|---|
| 210 | <td align=right><div align=right>Qt 3.3.8</div>
|
|---|
| 211 | </table></div></address></body>
|
|---|
| 212 | </html>
|
|---|
