<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en_US" lang="en_US">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- porting4-designer.qdoc -->
<title>Qt 4.8: Porting UI Files to Qt 4</title>
<link rel="stylesheet" type="text/css" href="style/style.css" />
<script src="scripts/jquery.js" type="text/javascript"></script>
<script src="scripts/functions.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="style/superfish.css" />
<link rel="stylesheet" type="text/css" href="style/narrow.css" />
<!--[if IE]>
<meta name="MSSmartTagsPreventParsing" content="true">
<meta http-equiv="imagetoolbar" content="no">
<![endif]-->
<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="style/style_ie6.css">
<![endif]-->
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="style/style_ie7.css">
<![endif]-->
<!--[if IE 8]>
<link rel="stylesheet" type="text/css" href="style/style_ie8.css">
<![endif]-->
<script src="scripts/superfish.js" type="text/javascript"></script>
<script src="scripts/narrow.js" type="text/javascript"></script>
</head>
<body class="" onload="CheckEmptyAndLoadList();">
<div class="header" id="qtdocheader">
<div class="content">
<div id="nav-logo">
<a href="index.html">Home</a></div>
<a href="index.html" class="qtref"><span>Qt Reference Documentation</span></a>
<div id="narrowsearch"></div>
<div id="nav-topright">
<ul>
<li class="nav-topright-home"><a href="http://qt.digia.com/">Qt HOME</a></li>
<li class="nav-topright-dev"><a href="http://qt-project.org/">DEV</a></li>
<li class="nav-topright-doc nav-topright-doc-active"><a href="http://qt-project.org/doc/">
DOC</a></li>
<li class="nav-topright-blog"><a href="http://blog.qt.digia.com/">BLOG</a></li>
</ul>
</div>
<div id="shortCut">
<ul>
<li class="shortCut-topleft-inactive"><span><a href="index.html">Qt 4.8</a></span></li>
<li class="shortCut-topleft-active"><a href="http://qt-project.org/doc/">ALL VERSIONS </a></li>
</ul>
</div>
<ul class="sf-menu" id="narrowmenu">
<li><a href="#">API Lookup</a>
<ul>
<li><a href="classes.html">Class index</a></li>
<li><a href="functions.html">Function index</a></li>
<li><a href="modules.html">Modules</a></li>
<li><a href="namespaces.html">Namespaces</a></li>
<li><a href="qtglobal.html">Global Declarations</a></li>
<li><a href="qdeclarativeelements.html">QML elements</a></li>
</ul>
</li>
<li><a href="#">Qt Topics</a>
<ul>
<li><a href="qt-basic-concepts.html">Programming with Qt</a></li>
<li><a href="qtquick.html">Device UIs & Qt Quick</a></li>
<li><a href="qt-gui-concepts.html">UI Design with Qt</a></li>
<li><a href="supported-platforms.html">Supported Platforms</a></li>
<li><a href="technology-apis.html">Qt and Key Technologies</a></li>
<li><a href="best-practices.html">How-To's and Best Practices</a></li>
</ul>
</li>
<li><a href="#">Examples</a>
<ul>
<li><a href="all-examples.html">Examples</a></li>
<li><a href="tutorials.html">Tutorials</a></li>
<li><a href="demos.html">Demos</a></li>
<li><a href="qdeclarativeexamples.html">QML Examples</a></li>
</ul>
</li>
</ul>
</div>
</div>
<div class="wrapper">
<div class="hd">
<span></span>
</div>
<div class="bd group">
<div class="sidebar">
<div class="searchlabel">
Search index:</div>
<div class="search" id="sidebarsearch">
<form id="qtdocsearch" action="" onsubmit="return false;">
<fieldset>
<input type="text" name="searchstring" id="pageType" value="" />
<div id="resultdialog">
<a href="#" id="resultclose">Close</a>
<p id="resultlinks" class="all"><a href="#" id="showallresults">All</a> | <a href="#" id="showapiresults">API</a> | <a href="#" id="showarticleresults">Articles</a> | <a href="#" id="showexampleresults">Examples</a></p>
<p id="searchcount" class="all"><span id="resultcount"></span><span id="apicount"></span><span id="articlecount"></span><span id="examplecount"></span> results:</p>
<ul id="resultlist" class="all">
</ul>
</div>
</fieldset>
</form>
</div>
<div class="box first bottombar" id="lookup">
<h2 title="API Lookup"><span></span>
API Lookup</h2>
<div id="list001" class="list">
<ul id="ul001" >
<li class="defaultLink"><a href="classes.html">Class index</a></li>
<li class="defaultLink"><a href="functions.html">Function index</a></li>
<li class="defaultLink"><a href="modules.html">Modules</a></li>
<li class="defaultLink"><a href="namespaces.html">Namespaces</a></li>
<li class="defaultLink"><a href="qtglobal.html">Global Declarations</a></li>
<li class="defaultLink"><a href="qdeclarativeelements.html">QML elements</a></li>
</ul>
</div>
</div>
<div class="box bottombar" id="topics">
<h2 title="Qt Topics"><span></span>
Qt Topics</h2>
<div id="list002" class="list">
<ul id="ul002" >
<li class="defaultLink"><a href="qt-basic-concepts.html">Programming with Qt</a></li>
<li class="defaultLink"><a href="qtquick.html">Device UIs & Qt Quick</a></li>
<li class="defaultLink"><a href="qt-gui-concepts.html">UI Design with Qt</a></li>
<li class="defaultLink"><a href="supported-platforms.html">Supported Platforms</a></li>
<li class="defaultLink"><a href="technology-apis.html">Qt and Key Technologies</a></li>
<li class="defaultLink"><a href="best-practices.html">How-To's and Best Practices</a></li>
</ul>
</div>
</div>
<div class="box" id="examples">
<h2 title="Examples"><span></span>
Examples</h2>
<div id="list003" class="list">
<ul id="ul003">
<li class="defaultLink"><a href="all-examples.html">Examples</a></li>
<li class="defaultLink"><a href="tutorials.html">Tutorials</a></li>
<li class="defaultLink"><a href="demos.html">Demos</a></li>
<li class="defaultLink"><a href="qdeclarativeexamples.html">QML Examples</a></li>
</ul>
</div>
</div>
</div>
<div class="wrap">
<div class="toolbar">
<div class="breadcrumb toolblock">
<ul>
<li class="first"><a href="index.html">Home</a></li>
<!-- Breadcrumbs go here -->
<li>Porting UI Files to Qt 4</li>
</ul>
</div>
<div class="toolbuttons toolblock">
<ul>
<li id="smallA" class="t_button">A</li>
<li id="medA" class="t_button active">A</li>
<li id="bigA" class="t_button">A</li>
<li id="print" class="t_button"><a href="javascript:this.print();">
<span>Print</span></a></li>
</ul>
</div>
</div>
<div class="content mainContent">
<link rel="prev" href="porting4-dnd.html" />
<link rel="next" href="graphicsview-porting.html" />
<p class="naviNextPrevious headerNavi">
<a class="prevPage" href="porting4-dnd.html">Porting to Qt 4 - Drag and Drop</a>
<a class="nextPage" href="graphicsview-porting.html">Porting to Graphics View</a>
</p><p/>
<div class="toc">
<h3><a name="toc">Contents</a></h3>
<ul>
<li class="level1"><a href="#uic-output">uic Output</a></li>
<li class="level1"><a href="#working-with-uic3">Working with uic3</a></li>
<li class="level1"><a href="#limitations-of-uic3">Limitations of uic3</a></li>
<li class="level1"><a href="#icons">Icons</a></li>
<li class="level1"><a href="#custom-widgets">Custom Widgets</a></li>
</ul>
</div>
<h1 class="title">Porting UI Files to Qt 4</h1>
<span class="subtitle"></span>
<!-- $$$porting4-designer.html-description -->
<div class="descr"> <a name="details"></a>
<p>Qt Designer has changed significantly in the Qt 4 release. We have moved away from viewing Qt Designer as an IDE and concentrated on creating a robust form builder which can be extended and embedded in existing IDEs. Our efforts are ongoing and include the <a href="http://qt.digia.com/Product/Developer-Tools/">Visual Studio Integration</a>, as well as integrating Designer with KDevelop and possibly other IDEs.</p>
<p>The most important changes in Qt Designer 4 which affect porting for UI files are summarized below:</p>
<ul>
<li><b>Removed project manager.</b> Qt Designer now only reads and edits UI files. It has no notion of a project file (<tt>.pro</tt>).</li>
<li><b>Removed code editor.</b> Qt Designer can no longer be used to edit source files.</li>
<li><b>Changed format of UI files.</b> Qt Designer 4 cannot read files created by Qt Designer 3 and vice versa. However, we provide the tool <tt>uic3</tt> to generate Qt 4 code out of Qt 3 UI files, and to convert old UI files into a format readable by Qt Designer 4.</li>
<li><b>Changed structure of the code generated by <tt>uic</tt>.</b> The <tt>myform.ui</tt> file containing the form <tt>MyForm</tt> is now converted into a single header file <tt>ui_myform.h</tt>, which contains the declaration and inline definition of a POD class <tt>Ui::MyForm</tt>.</li>
<li><b>New resource file system.</b> Icon data is no longer stored in the UI file. Instead, icons are put into resource files (<tt>.qrc</tt>).</li>
</ul>
<p>The rest of this document explains how to deal with the main differences between Qt Designer 3 and Qt Designer 4:</p>
<p>See <a href="porting4.html">Porting to Qt 4</a> and <a href="qt3to4.html">qt3to4 - The Qt 3 to 4 Porting Tool</a> for more information about porting from Qt 3 to Qt 4. See also the <a href="designer-manual.html">Qt Designer Manual</a>.</p>
<a name="uic-output"></a>
<h2>uic Output</h2>
<p>In Qt 3, <tt>uic</tt> generated a header file and an implementation for a class, which inherited from one of Qt's widgets. To use the form, the programmer included the generated sources into the application and created an instance of the class.</p>
<p>In Qt 4, <tt>uic</tt> creates a header file containing a POD class. The name of this class is the object name of the main container, qualified with the <tt>Ui</tt> namespace (e.g., <tt>Ui::MyForm</tt>). The class is implemented using inline functions, removing the need of a separate <tt>.cpp</tt> file. Just as in Qt 3, this class contains pointers to all the widgets inside the form as public members. In addition, the generated class provides the public method <tt>setupUi()</tt>.</p>
<p>The class generated by <tt>uic</tt> is not a <a href="qwidget.html">QWidget</a>; in fact, it's not even a <a href="qobject.html">QObject</a>. Instead, it is a class which knows how to populate an instance of a main container with the contents of the form. The programmer creates the main container himself, then passes it to <tt>setupUi()</tt>.</p>
<p>For example, here's the <tt>uic</tt> output for a simple <tt>helloworld.ui</tt> form (some details were removed for simplicity):</p>
<pre class="cpp"> <span class="keyword">namespace</span> Ui {
<span class="keyword">class</span> HelloWorld
{
<span class="keyword">public</span>:
<span class="type"><a href="qvboxlayout.html">QVBoxLayout</a></span> <span class="operator">*</span>vboxLayout;
<span class="type"><a href="qpushbutton.html">QPushButton</a></span> <span class="operator">*</span>pushButton;
<span class="type">void</span> setupUi(<span class="type"><a href="qwidget.html">QWidget</a></span> <span class="operator">*</span>HelloWorld)
{
HelloWorld<span class="operator">-</span><span class="operator">></span>setObjectName(<span class="type"><a href="qstring.html">QString</a></span><span class="operator">::</span>fromUtf8(<span class="string">"HelloWorld"</span>));
vboxLayout <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qvboxlayout.html">QVBoxLayout</a></span>(HelloWorld);
vboxLayout<span class="operator">-</span><span class="operator">></span>setObjectName(<span class="type"><a href="qstring.html">QString</a></span><span class="operator">::</span>fromUtf8(<span class="string">"vboxLayout"</span>));
pushButton <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qpushbutton.html">QPushButton</a></span>(HelloWorld);
pushButton<span class="operator">-</span><span class="operator">></span>setObjectName(<span class="type"><a href="qstring.html">QString</a></span><span class="operator">::</span>fromUtf8(<span class="string">"pushButton"</span>));
vboxLayout<span class="operator">-</span><span class="operator">></span>addWidget(pushButton);
retranslateUi(HelloWorld);
}
};
}</pre>
<p>In this case, the main container was specified to be a <a href="qwidget.html">QWidget</a> (or any subclass of <a href="qwidget.html">QWidget</a>). Had we started with a <a href="qmainwindow.html">QMainWindow</a> template in Qt Designer, <tt>setupUi()</tt>'s parameter would be of type <a href="qmainwindow.html">QMainWindow</a>.</p>
<p>There are two ways to create an instance of our form. One approach is to create an instance of the <tt>Ui::HelloWorld</tt> class, an instance of the main container (a plain <a href="qwidget.html">QWidget</a>), and call <tt>setupUi()</tt>:</p>
<pre class="cpp"> <span class="preprocessor">#include <QApplication></span>
<span class="preprocessor">#include <QWidget></span>
<span class="preprocessor">#include "ui_helloworld.h" // defines Ui::HelloWorld</span>
<span class="type">int</span> main(<span class="type">int</span> argc<span class="operator">,</span> <span class="type">char</span> <span class="operator">*</span>argv<span class="operator">[</span><span class="operator">]</span>)
{
<span class="type"><a href="qapplication.html">QApplication</a></span> app(argc<span class="operator">,</span> argv);
<span class="type"><a href="qwidget.html">QWidget</a></span> w;
Ui<span class="operator">::</span>HelloWorld ui;
ui<span class="operator">.</span>setupUi(<span class="operator">&</span>w);
w<span class="operator">.</span>show();
<span class="keyword">return</span> app<span class="operator">.</span>exec();
}</pre>
<p>The second approach is to inherit from both the <tt>Ui::HelloWorld</tt> class and the main container, and to call <tt>setupUi()</tt> in the constructor of the subclass. In that case, <a href="qwidget.html">QWidget</a> (or one of its subclasses, e.g. <a href="qdialog.html">QDialog</a>) must appear first in the base class list so that <a href="moc.html#moc">moc</a> picks it up correctly. For example:</p>
<pre class="cpp"> <span class="preprocessor">#include <QApplication></span>
<span class="preprocessor">#include <QWidget></span>
<span class="preprocessor">#include "ui_helloworld.h" // defines Ui::HelloWorld</span>
<span class="keyword">class</span> HelloWorldWidget : <span class="keyword">public</span> <span class="type"><a href="qwidget.html">QWidget</a></span><span class="operator">,</span> <span class="keyword">public</span> Ui<span class="operator">::</span>HelloWorld
{
Q_OBJECT
<span class="keyword">public</span>:
HelloWorldWidget(<span class="type"><a href="qwidget.html">QWidget</a></span> <span class="operator">*</span>parent <span class="operator">=</span> <span class="number">0</span>)
: <span class="type"><a href="qwidget.html">QWidget</a></span>(parent)
{ setupUi(<span class="keyword">this</span>); }
};
<span class="type">int</span> main(<span class="type">int</span> argc<span class="operator">,</span> <span class="type">char</span> <span class="operator">*</span>argv<span class="operator">[</span><span class="operator">]</span>)
{
<span class="type"><a href="qapplication.html">QApplication</a></span> app(argc<span class="operator">,</span> argv);
HelloWorldWidget w;
w<span class="operator">.</span>show();
<span class="keyword">return</span> app<span class="operator">.</span>exec();
}</pre>
<p>This second method is useful when porting Qt 3 forms to Qt 4. <tt>HelloWorldWidget</tt> is a class whose instance is the actual form and which contains public pointers to all the widgets in it. It therefore has an interface identical to that of a class generated by <tt>uic</tt> in Qt 3.</p>
<p>Creating POD classes from UI files is more flexible and generic than the old approach of creating widgets. Qt Designer does not need to know anything about the main container apart from the base widget class it inherits. Indeed, <tt>Ui::HelloWorld</tt> can be used to populate any container that inherits <a href="qwidget.html">QWidget</a>. Conversely, all non-GUI aspects of the main container may be implemented by the programmer in the application's sources without reference to the form.</p>
<a name="working-with-uic3"></a>
<h2>Working with uic3</h2>
<p>Qt 4 comes with the tool <tt>uic3</tt> for working with old <tt>.ui</tt> files. It can be used in two ways:</p>
<ol class="1">
<li>To generate headers and source code for a widget to implement any custom signals and slots added using Qt Designer 3.</li>
<li>To generate a new UI file that can be used with Qt Designer 4.</li>
</ol>
<p>You can use both these methods in combination to obtain UI, header and source files that you can use as a starting point when porting your user interface to Qt 4.</p>
<p>The first method generates a Qt 3 style header and implementation which uses Qt 4 widgets (this includes the Qt 3 compatibility classes present in the <a href="qt3support.html">Qt3Support</a> library). This process should be familiar to anyone used to working with Qt Designer 3:</p>
<pre class="cpp"> uic3 myform.ui > myform.h
uic3 -impl myform.h myform.ui > myform.cpp</pre>
<p>The resulting files <tt>myform.h</tt> and <tt>myform.cpp</tt> implement the form in Qt 4 using a <a href="qwidget.html">QWidget</a> that will include custom signals, slots and connections specified in the UI file. However, see below for the <a href="#limitations-of-uic3">limitations</a> of this method.</p>
<p>The second method is to use <tt>uic3</tt> to convert a Qt Designer 3 <tt>.ui</tt> file to the Qt Designer 4 format:</p>
<pre class="cpp"> uic3 -convert myform3.ui > myform4.ui</pre>
<p>The resulting file <tt>myform4.ui</tt> can be edited in Qt Designer 4. The header file for the form is generated by Qt 4's <tt>uic</tt>. See the <a href="designer-using-a-ui-file.html">Using a Designer UI File in Your Application</a> chapter of the <a href="designer-manual.html">Qt Designer Manual</a> for information about the preferred ways to use forms created with Qt Designer 4.</p>
<p><tt>uic3</tt> tries very hard to map Qt 3 classes and their properties to Qt 4. However, the behavior of some classes changed significantly in Qt 4. To keep the form working, some Qt 3 classes are mapped to classes in the <a href="qt3support.html">Qt3Support</a> library. Table 1 shows a list of classes this applies to.</p>
<table class="generic">
<thead><tr class="qt-style"><th >Qt 3 class</th><th >Qt 4 class</th></tr></thead>
<tr valign="top" class="odd"><td ><tt>QButtonGroup</tt></td><td ><a href="q3buttongroup.html" class="compat">Q3ButtonGroup</a></td></tr>
<tr valign="top" class="even"><td ><tt>QDateEdit</tt></td><td ><a href="q3dateedit.html" class="compat">Q3DateEdit</a></td></tr>
<tr valign="top" class="odd"><td ><tt>QDateTimeEdit</tt></td><td ><a href="q3datetimeedit.html" class="compat">Q3DateTimeEdit</a></td></tr>
<tr valign="top" class="even"><td ><tt>QGroupBox</tt></td><td ><a href="q3groupbox.html" class="compat">Q3GroupBox</a></td></tr>
<tr valign="top" class="odd"><td ><tt>QListBox</tt></td><td ><a href="q3listbox.html" class="compat">Q3ListBox</a></td></tr>
<tr valign="top" class="even"><td ><tt>QListView</tt></td><td ><a href="q3listview.html" class="compat">Q3ListView</a></td></tr>
<tr valign="top" class="odd"><td ><tt>QMainWindow</tt></td><td ><a href="q3mainwindow.html" class="compat">Q3MainWindow</a></td></tr>
<tr valign="top" class="even"><td ><tt>QTextEdit</tt></td><td ><a href="q3textedit.html" class="compat">Q3TextEdit</a></td></tr>
<tr valign="top" class="odd"><td ><tt>QTextView</tt></td><td ><a href="q3textview.html" class="compat">Q3TextView</a></td></tr>
<tr valign="top" class="even"><td ><tt>QTimeEdit</tt></td><td ><a href="q3timeedit.html" class="compat">Q3TimeEdit</a></td></tr>
<tr valign="top" class="odd"><td ><tt>QWidgetStack</tt></td><td ><a href="q3widgetstack.html" class="compat">Q3WidgetStack</a></td></tr>
<tr valign="top" class="even"><td ><tt>QWizard</tt></td><td ><a href="q3wizard.html" class="compat">Q3Wizard</a></td></tr>
</table>
<a name="limitations-of-uic3"></a>
<h2>Limitations of uic3</h2>
<p>Converting Qt 3 UI files to Qt 4 has some limitations. The most noticeable limitation is the fact that since <tt>uic</tt> no longer generates a <a href="qobject.html">QObject</a>, it's not possible to define custom signals or slots for the form. Instead, the programmer must define these signals and slots in the main container and connect them to the widgets in the form after calling <tt>setupUi()</tt>. For example:</p>
<pre class="cpp"> <span class="keyword">class</span> HelloWorldWidget : <span class="keyword">public</span> <span class="type"><a href="qwidget.html">QWidget</a></span><span class="operator">,</span> <span class="keyword">public</span> Ui<span class="operator">::</span>HelloWorld
{
Q_OBJECT
<span class="keyword">public</span>:
HelloWorldWidget(<span class="type"><a href="qwidget.html">QWidget</a></span> <span class="operator">*</span>parent <span class="operator">=</span> <span class="number">0</span>);
<span class="keyword">public</span> <span class="keyword">slots</span>:
<span class="type">void</span> mySlot();
};
HelloWorldWidget<span class="operator">::</span>HelloWorldWidget(<span class="type"><a href="qwidget.html">QWidget</a></span> <span class="operator">*</span>parent)
: <span class="type"><a href="qwidget.html">QWidget</a></span>(parent)
{
setupUi(<span class="keyword">this</span>);
<span class="type"><a href="qobject.html">QObject</a></span><span class="operator">::</span>connect(pushButton<span class="operator">,</span> SIGNAL(clicked())<span class="operator">,</span>
<span class="keyword">this</span><span class="operator">,</span> SLOT(mySlot()));
}
<span class="type">void</span> HelloWorldWidget<span class="operator">::</span>mySlot()
{
<span class="operator">.</span><span class="operator">.</span><span class="operator">.</span>
}</pre>
<p>A quick and dirty way to port forms containing custom signals and slots is to generate the code using <tt>uic3</tt>, rather than <tt>uic</tt>. Since <tt>uic3</tt> does generate a <a href="qwidget.html">QWidget</a>, it will populate it with custom signals, slots and connections specified in the UI file. However, <tt>uic3</tt> can only generate code from Qt 3 UI files, which implies that the UI files never get translated and need to be edited using Qt Designer 3.</p>
<p>Note also that it is possible to create implicit connections between the widgets in a form and the main container. After <tt>setupUi()</tt> populates the main container with child widgets it scans the main container's list of slots for names with the form <tt>on_<i>objectName</i><a href="index.html">_</a><i>signalName</i>().</tt></p>
<p>If the form contains a widget whose object name is <tt><i>objectName</i></tt>, and if that widget has a signal called <tt><i>signalName</i></tt>, then this signal will be connected to the main container's slot. For example:</p>
<pre class="cpp"> <span class="keyword">class</span> HelloWorldWidget : <span class="keyword">public</span> <span class="type"><a href="qwidget.html">QWidget</a></span><span class="operator">,</span> <span class="keyword">public</span> Ui<span class="operator">::</span>HelloWorld
{
Q_OBJECT
<span class="keyword">public</span>:
HelloWorldWidget(<span class="type"><a href="qwidget.html">QWidget</a></span> <span class="operator">*</span>parent <span class="operator">=</span> <span class="number">0</span>);
<span class="keyword">public</span> <span class="keyword">slots</span>:
<span class="type">void</span> on_pushButton_clicked();
};
HelloWorldWidget<span class="operator">::</span>HelloWorldWidget(<span class="type"><a href="qwidget.html">QWidget</a></span> <span class="operator">*</span>parent)
: <span class="type"><a href="qwidget.html">QWidget</a></span>(parent)
{
setupUi(<span class="keyword">this</span>);
}
<span class="type">void</span> HelloWorldWidget<span class="operator">::</span>on_pushButton_clicked()
{
<span class="operator">.</span><span class="operator">.</span><span class="operator">.</span>
}</pre>
<p>Because of the naming convention, <tt>setupUi()</tt> automatically connects <tt>pushButton</tt>'s <tt>clicked()</tt> signal to <tt>HelloWorldWidget</tt>'s <tt>on_pushButton_clicked()</tt> slot.</p>
<a name="icons"></a>
<h2>Icons</h2>
<p>In Qt 3, the binary data for the icons used by a form was stored in the UI file. In Qt 4 icons and any other external files can be compiled into the application by listing them in a <a href="resources.html">resource file</a> (<tt>.qrc</tt>). This file is translated into a C++ source file using Qt's resource compiler (<tt>rcc</tt>). The data in the files is then available to any Qt class which takes a file name argument.</p>
<p>Imagine that we have two icons, <tt>yes.png</tt> and <tt>no.png</tt>. We create a resource file called <tt>icons.qrc</tt> with the following contents:</p>
<pre class="cpp"> <RCC version="1.0">
<qresource prefix="/icons">
<file>yes.png</file>
<file>no.png</file>
</qresource>
</RCC></pre>
<p>Next, we add the resource file to our <tt>.pro</tt> file:</p>
<pre class="cpp"> RESOURCES += icons.qrc</pre>
<p>When <tt>qmake</tt> is run, it will create the appropriate Makefile rules to call <tt>rcc</tt> on the resource file, and compile and link the result into the application. The icons may be accessed as follows:</p>
<pre class="cpp"> <span class="type"><a href="qfile.html">QFile</a></span> file(<span class="string">":/icons/yes.png"</span>);
<span class="type"><a href="qicon.html">QIcon</a></span> icon(<span class="string">":/icons/no.png"</span>);
<span class="type"><a href="qpixmap.html">QPixmap</a></span> pixmap(<span class="string">":/icons/no.png"</span>);</pre>
<p>In each case, the leading colon tells Qt to look for the file in the virtual file tree defined by the set of resource files compiled into the application instead of the file system.</p>
<p>In the <tt>.qrc</tt> file, the <tt>qresource</tt> tag's <tt>prefix</tt> attribute is used to arrange the files into categories and set a virtual path where the files will be accessed.</p>
<p>Caveat: If the resource file was not linked directly into the application, but instead into a dynamic or static library that was later linked with the application, its virtual file tree will not be available to <a href="qfile.html">QFile</a> and friends until the <a href="qdir.html#Q_INIT_RESOURCE">Q_INIT_RESOURCE</a>() macro is called. This macro takes one argument, which is the name of the <tt>.qrc</tt> file, without the path or the file extension. A convenient place to initialize resources is at the top of the application's <tt>main()</tt> function.</p>
<p>In Qt Designer 4, we can associate any number of resource files with a form using the resource editor tool. The widgets in the form can access all icons specified in its associated resource files.</p>
<p>In short, porting of icons from a Qt 3 to a Qt 4 form involves the following steps:</p>
<ol class="1">
<li>Use <tt>uic3 -convert</tt> to obtain a UI file understood by Qt Designer 4.</li>
<li>Create a <tt>.qrc</tt> file with a list of all the icon files.</li>
<li>Add the resource file to the <tt>.pro</tt> file.</li>
<li>Open the form in Qt Designer 4 and add the resource file to the form's resource editor.</li>
<li>Set the icon properties for the appropriate widgets.</li>
</ol>
<a name="custom-widgets"></a>
<h2>Custom Widgets</h2>
<p>Qt Designer 3 supported defining custom widgets by specifying their name, header file and methods. In Qt Designer 4, a custom widget is always created by "promoting" an existing Qt widget to a custom class. Qt Designer 4 assumes that the custom widget will inherit from the widget that has been promoted. In the form editor, the custom widget will retain the looks, behavior, properties, signals and slots of the base widget. It is not currently possible to tell Qt Designer 4 that the custom widget will have additional signals or slots.</p>
<p><tt>uic3 -convert</tt> handles the conversion of custom widgets to the new <tt>.ui</tt> format, however all custom signals and slots are lost. Furthermore, since Qt Designer 3 never knew the base widget class of a custom widget, it is taken to be <a href="qwidget.html">QWidget</a>. This is often sufficient. If not, the custom widgets have to be inserted manually into the form.</p>
<p>Custom widget plugins, which contain custom widgets to be used in Qt Designer, must themselves be ported before they can be used in forms ported with <tt>uic3</tt>. The <a href="porting4.html">Porting to Qt 4</a> document contains information about general porting issues that may apply to the custom widget code itself, and the <a href="designer-creating-custom-widgets.html">Creating Custom Widgets for Qt Designer</a> chapter of the <a href="designer-manual.html">Qt Designer Manual</a> describes how the ported widget should be built in order to work in Qt Designer 4.</p>
</div>
<!-- @@@porting4-designer.html -->
<p class="naviNextPrevious footerNavi">
<a class="prevPage" href="porting4-dnd.html">Porting to Qt 4 - Drag and Drop</a>
<a class="nextPage" href="graphicsview-porting.html">Porting to Graphics View</a>
</p>
</div>
</div>
</div>
<div class="ft">
<span></span>
</div>
</div>
<div class="footer">
<p>
<acronym title="Copyright">©</acronym> 2013 Digia Plc and/or its
subsidiaries. Documentation contributions included herein are the copyrights of
their respective owners.</p>
<br />
<p>
The documentation provided herein is licensed under the terms of the
<a href="http://www.gnu.org/licenses/fdl.html">GNU Free Documentation
License version 1.3</a> as published by the Free Software Foundation.</p>
<p>
Documentation sources may be obtained from <a href="http://www.qt-project.org">
www.qt-project.org</a>.</p>
<br />
<p>
Digia, Qt and their respective logos are trademarks of Digia Plc
in Finland and/or other countries worldwide. All other trademarks are property
of their respective owners. <a title="Privacy Policy"
href="http://en.gitorious.org/privacy_policy/">Privacy Policy</a></p>
</div>
<script src="scripts/functions.js" type="text/javascript"></script>
</body>
</html>
