<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<!-- /tmp/qt-4.3.4-qt-1203442408707/qt-x11-opensource-src-4.3.4/doc/src/examples/tutorial.qdoc -->
<head>
<title>Qt 4.3: Qt Tutorial 6 - Building Blocks Galore!</title>
<link rel="prev" href="tutorial-t5.html" />
<link rel="contents" href="tutorial.html" />
<link rel="next" href="tutorial-t7.html" />
<link href="classic.css" rel="stylesheet" type="text/css" />
</head>
<body>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="left" valign="top" width="32"><a href="http://www.trolltech.com/products/qt"><img src="images/qt-logo.png" align="left" width="32" height="32" border="0" /></a></td>
<td width="1"> </td><td class="postheader" valign="center"><a href="index.html"><font color="#004faf">Home</font></a> · <a href="classes.html"><font color="#004faf">All Classes</font></a> · <a href="mainclasses.html"><font color="#004faf">Main Classes</font></a> · <a href="groups.html"><font color="#004faf">Grouped Classes</font></a> · <a href="modules.html"><font color="#004faf">Modules</font></a> · <a href="functions.html"><font color="#004faf">Functions</font></a></td>
<td align="right" valign="top" width="230"><a href="http://www.trolltech.com"><img src="images/trolltech-logo.png" align="right" width="203" height="32" border="0" /></a></td></tr></table><p>
[Previous: <a href="tutorial-t5.html">Chapter 5</a>]
[<a href="tutorial.html">Qt Tutorial</a>]
[Next: <a href="tutorial-t7.html">Chapter 7</a>]
</p>
<h1 align="center">Qt Tutorial 6 - Building Blocks Galore!<br /><small></small></h1>
<p>Files:</p>
<ul>
<li><a href="tutorial-t6-main-cpp.html">tutorial/t6/main.cpp</a></li>
</ul>
<p align="center"><img src="images/t6.png" alt="Screenshot of Chapter 6" /></p><p>This example shows how to encapsulate two widgets into a new component and how easy it is to use many widgets. For the first time, we use a custom widget as a child widget.</p>
<pre> ** This file is provided AS IS with NO WARRANTY OF ANY KIND, INCLUDING THE
** WARRANTY OF DESIGN, MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE.
**
****************************************************************************/</span>
#include <QApplication>
#include <QFont>
#include <QGridLayout>
#include <QLCDNumber>
#include <QPushButton>
#include <QSlider>
#include <QVBoxLayout>
#include <QWidget>
class LCDRange : public QWidget
{
public:
LCDRange(QWidget *parent = 0);
};
LCDRange::LCDRange(QWidget *parent)
: QWidget(parent)
{
QLCDNumber *lcd = new QLCDNumber(2);
lcd->setSegmentStyle(QLCDNumber::Filled);
QSlider *slider = new QSlider(Qt::Horizontal);
slider->setRange(0, 99);
slider->setValue(0);
connect(slider, SIGNAL(valueChanged(int)),
lcd, SLOT(display(int)));
QVBoxLayout *layout = new QVBoxLayout;
layout->addWidget(lcd);
layout->addWidget(slider);
setLayout(layout);
}
class MyWidget : public QWidget
{
public:
MyWidget(QWidget *parent = 0);
};
MyWidget::MyWidget(QWidget *parent)
: QWidget(parent)
{
QPushButton *quit = new QPushButton(tr("Quit"));
quit->setFont(QFont("Times", 18, QFont::Bold));
connect(quit, SIGNAL(clicked()), qApp, SLOT(quit()));
QGridLayout *grid = new QGridLayout;
for (int row = 0; row < 3; ++row) {
for (int column = 0; column < 3; ++column) {
LCDRange *lcdRange = new LCDRange;
grid->addWidget(lcdRange, row, column);
}
}
QVBoxLayout *layout = new QVBoxLayout;
layout->addWidget(quit);
layout->addLayout(grid);
setLayout(layout);
}
int main(int argc, char *argv[])
{
QApplication app(argc, argv);
MyWidget widget;
widget.show();
return app.exec();
}</pre>
<a name="line-by-line-walkthrough"></a>
<h2>Line by Line Walkthrough</h2>
<pre> class LCDRange : public QWidget
{
public:
LCDRange(QWidget *parent = 0);
};</pre>
<p>The <tt>LCDRange</tt> widget is a widget without any API. It just has a constructor. This sort of widget is not very useful, so we'll add some API later.</p>
<pre> LCDRange::LCDRange(QWidget *parent)
: QWidget(parent)
{
QLCDNumber *lcd = new QLCDNumber(2);
lcd->setSegmentStyle(QLCDNumber::Filled);
QSlider *slider = new QSlider(Qt::Horizontal);
slider->setRange(0, 99);
slider->setValue(0);
connect(slider, SIGNAL(valueChanged(int)),
lcd, SLOT(display(int)));
QVBoxLayout *layout = new QVBoxLayout;
layout->addWidget(lcd);
layout->addWidget(slider);
setLayout(layout);
}</pre>
<p>This is lifted straight from the <tt>MyWidget</tt> constructor in Chapter 5. The only differences are that the <b>Quit</b> button is left out and the class is renamed.</p>
<pre> class MyWidget : public QWidget
{
public:
MyWidget(QWidget *parent = 0);
};</pre>
<p><tt>MyWidget</tt>, too, contains no API except a constructor.</p>
<pre> MyWidget::MyWidget(QWidget *parent)
: QWidget(parent)
{
QPushButton *quit = new QPushButton(tr("Quit"));
quit->setFont(QFont("Times", 18, QFont::Bold));
connect(quit, SIGNAL(clicked()), qApp, SLOT(quit()));</pre>
<p>The push button that used to be in what is now <tt>LCDRange</tt> has been separated so that we can have one <b>Quit</b> button and many <tt>LCDRange</tt> objects.</p>
<pre> QGridLayout *grid = new QGridLayout;</pre>
<p>We create a <a href="qwidget.html">QWidget</a> with a <a href="qgridlayout.html">QGridLayout</a> that will contain three columns.</p>
<p>The <a href="qgridlayout.html">QGridLayout</a> automatically arranges its widgets in rows and columns; you can specify the row and column numbers when adding widgets to the layout, and <a href="qgridlayout.html">QGridLayout</a> will fit them into the grid.</p>
<pre> for (int row = 0; row < 3; ++row) {
for (int column = 0; column < 3; ++column) {
LCDRange *lcdRange = new LCDRange;
grid->addWidget(lcdRange, row, column);
}
}</pre>
<p>We create nine <tt>LCDRange</tt> widgets, all of which are children of the grid object, and we arrange them in three rows and three columns.</p>
<pre> QVBoxLayout *layout = new QVBoxLayout;
layout->addWidget(quit);
layout->addLayout(grid);
setLayout(layout);
}</pre>
<p>Finally, we add the <b>Quit</b> button and the grid layout containing <tt>LCDRange</tt> widgets, to the main layout. The QWidget::addLayout() function is similar to the QWidget::addWidget() function, making the given layout a child og the main layout.</p>
<p>That's all.</p>
<a name="running-the-application"></a>
<h2>Running the Application</h2>
<p>This program shows how easy it is to use many widgets at a time. Each one behaves like the slider and LCD number in the previous chapter. Again, the difference lies in the implementation.</p>
<a name="exercises"></a>
<h2>Exercises</h2>
<p>Initialize each slider with a different/random value on startup.</p>
<p>
[Previous: <a href="tutorial-t5.html">Chapter 5</a>]
[<a href="tutorial.html">Qt Tutorial</a>]
[Next: <a href="tutorial-t7.html">Chapter 7</a>]
</p>
<p /><address><hr /><div align="center">
<table width="100%" cellspacing="0" border="0"><tr class="address">
<td width="30%">Copyright © 2008 <a href="trolltech.html">Trolltech</a></td>
<td width="40%" align="center"><a href="trademarks.html">Trademarks</a></td>
<td width="30%" align="right"><div align="right">Qt 4.3.4</div></td>
</tr></table></div></address></body>
</html>
distrib
>
Mandriva
>
2008.1
>
x86_64
>
media
>
main-release
>
by-pkgid
>
c5a68a1bfbb41dd7ab32131d8bbca747
>
files
>
3978
