Specifications
SHARP CORPORATION
Sharp SL-series Zaurus “Qtopia” Development Start-up Guide
Ver 1.11, February 28, 2003, 37/63
2.9. Development with the QtDesigner
The QtDesigner (also see section 2.2.1) is a useful tool that helps and assists you to design the application GUI
as well as to configure the event handling. When you use this tool, you may need to take somewhat different
steps than the ones described in the above sections.
When QtDesigner is used, the overall development procedure will be; (i) design application GUI by QtDesigner,
(ii) generate the source file and the header file from the QtDesigner file (*.ui), (iii) create subclasses to the
generated class and add procedures other than GUI design to the generated class file(s) to compile-link.
The following is an example of the development flow using the QtDesigner for application development.
(STEP 1) Invoking QtDesigner
You would first want to invoke the QtDesigner (/opt/Qtopia/bin/designer). Note that some Linux distributions
may have newer version of the QtDesigner (than the one that comes with the Qtopia SDK 1.5.0) depending on
the distribution. Please make sure to invoke the QtDesigner installed in the above location.
(STEP 2) Design GUI by the QtDesigner
Once you are done with designing the application GUI, you may want to save the GUI design in a .ui file. (This
application development flow assumes that the GUI design is saved in a “form1.ui” file.)
(STEP 3) Create main.cpp
The QtDesigner will generate a class when you design your application GUI by this tool (in case of this example,
Form1). The name put into the “name” field of the QtDesigner property editor is in fact the class name.
In the main.cpp file, you need to create an object corresponding to that class (see line #7). You would also have
to make an include statement so that it includes the header file of the created class (see line #2):
main.cpp
1: #include <qpe/qpeapplication.h>
2: #include "Form1.h"
3:
4: int main( int argc , char **argv )
5: {
6: QPEApplication myapp(argc, argv);
7: Form1 w;
8: myapp.showMainWidget( &w );
9: return myapp.exec();
10: }