×
Namespaces

Variants
Actions
(Difference between revisions)

Archived:Getting started with Qt

From Nokia Developer Wiki
Jump to: navigation, search
hamishwillee (Talk | contribs)
m (Hamishwillee - Bot change of template (Template:CodeSnippet) - now using Template:ArticleMetaData)
teemup (Talk | contribs)
(Teemup -)
Line 1: Line 1:
 
[[Category:Qt]][[Category:Symbian]]
 
[[Category:Qt]][[Category:Symbian]]
{{ArticleNeedsUpdate|timestamp=20110420010156|user=[[User:Hamishwillee|Hamishwillee]]|This article uses legacy SDKs and Carbide.c++. It has been partially updated to refer to the [[Nokia Qt SDK]] but it needs to refer to the  Qt Creator IDE instead of Carbide.c++.}}
 
 
{{FeaturedArticle|timestamp=20090104 }}
 
{{ReviewerApproved|timestamp=20090904}}
 
 
{{ArticleMetaData
 
|id=
 
|platform=S60 3rd Edition, S60 5th Edition
 
|devices=Emulator
 
|category=Qt
 
|subcategory= Getting started
 
|creationdate=29 December 2008
 
|keywords=PushButton, TextLabel, Signal and Slot
 
 
|sourcecode= <!-- Link to example source code (e.g. [[Media:The Code Example ZIP.zip]]) -->
 
|installfile= <!-- Link to installation file (e.g. [[Media:The Installation File.sis]]) -->
 
|sdk=<!-- SDK(s) built and tested against (e.g. [http://linktosdkdownload/ Nokia Qt SDK 1.1]) -->
 
|devicecompatability=<!-- Compatible devices (e.g.: All* (must have GPS) ) -->
 
|signing=<!-- Empty or one of Self-Signed, DevCert, Manufacturer -->
 
|capabilities=<!-- Capabilities required (e.g. Location, NetworkServices. -->)
 
|author=[[User:James1980]]
 
}}
 
 
 
 
== Introduction ==
 
== Introduction ==
  
This article is for beginners who want to start development in [[Qt for Symbian]]. Before following the steps given here please make sure that [http://www.developer.nokia.com/Resources/Tools_and_downloads/Other/Carbide.c++/ Carbide.c++], S60 [[SDK]] and [[Qt for Symbian]] are properly installed.
+
This article is for beginners who want to start development in [[Qt for Symbian]].  
  
 
== Prerequisite==
 
== Prerequisite==
 
* Download and install the [[Qt SDK]]
 
 
 
* Carbide.c++ 2.0 does not automatically locate your Qt installation, so you need to tell it where Qt is installed. This is done through the following settings:
 
  '''Carbide.c++ preferences: Window > Preferences > Qt > Add...'''
 
[[Image:Qt_Preference.PNG]]
 
<br>
 
In the above screen you will need to use the directory path for <br>
 
the current version e.g. <b>c:\Qt\4.6.0\bin and c:\Qt\4.6.0\include</b>
 
 
== First Step ==
 
Open the Carbide IDE and click File > New > Qt Project.
 
 
[[Image:step1.jpg]]
 
 
 
== Second Step ==
 
A new window will open on the screen. This will show the application types that can be created. Click Qt GUI Widget and then click Next.
 
 
[[Image:Step2.jpg]]
 
 
 
== Third Step ==
 
Enter a name for the project and click Next.
 
 
[[Image:Step3.jpg]]
 
 
 
== Fourth Step ==
 
Select the SDK to create the project for and click Next.
 
 
[[Image:Step4.jpg]]
 
 
 
== Fifth Step ==
 
Select the module(s) and click Next. For our example, click Next without selecting any extra modules.
 
 
[[Image:Step5.jpg]]
 
 
 
== Sixth Step ==
 
The class name is required. By default it is the application name. Click Finish to proceed.
 
 
[[Image:Step6.jpg]]
 
 
After finishing these steps, the project is ready. Several files are created automatically as shown in the following screenshot.
 
 
[[Image:Step7.jpg]]
 
 
If you have more than one version of [[Qt for Symbian]] installed on your machine, choose the correct version as shown here:
 
 
[[Image:Properties.JPG]]
 
 
 
== Include Qt Views ==
 
* Include views for Qt from:
 
  '''Carbide.c++ > Windows > Show View > Other... > Qt'''
 
[[Image:QtView.png]]
 
* View selection depends on the application. However, at least the following views must be selected:
 
# Qt C++ Widget Box
 
# Qt C++ Property Editor
 
# Qt C++ Signal Slot Editor
 
 
== Adding controls ==
 
* Open '''<tt>Hello.ui</tt>''' and place the control from the '''Qt C++ Widget Box'''.
 
[[Image:QtWidgetBox.png]]
 
* In this example, two push buttons and one text label will be added.
 
* The display text of an object can be changed by right clicking on object > Change text...
 
* The name of an object can be changed as shown in the following screenshots.
 
 
=== Text label ===
 
[[Image:TextLabel.png]]
 
 
=== Hello push button ===
 
[[Image:HelloButton.png]]
 
 
=== Exit push button ===
 
[[Image:ExitButton.png]]
 
 
 
== Implementing Signal and Slot mechanism for Exit push button==
 
* Open '''<tt>Hello.ui</tt>'''.
 
* Open the '''Qt C++ Signal Slot Editor''' view.
 
[[Image:QtSignalSlotView.png]]
 
* Click  [[Image:QtSignalPlus.png]] to add an entry for handling events on control.
 
* In this example, we will handle events on the Exit push button
 
* The application will terminate when the user clicks the Exit push button
 
=== Sender ===
 
* exitButton is the sender of the signal.
 
[[Image:QtSender.png]]
 
 
=== Signal ===
 
* Select the signal clicked() to be sent by exitButton.
 
[[Image:QtSignal.png]]
 
 
=== Receiver ===
 
* <tt>HelloClass</tt> is the receiver of this event handling mechanism.
 
[[Image:QtReceiver.png]]
 
 
=== Slot ===
 
* Slot is the action performed when exitButton is clicked(). To exit from the application, select close().
 
[[Image:QtSlot.png]]
 
 
 
== Implementing the Hello push button ==
 
* In this example, we implement the Hello button event by coding in the files Hello.h and Hello.cpp.
 
===Header file ===
 
<code cpp>
 
#ifndef HELLO_H
 
#define HELLO_H
 
 
#include <QtGui/QWidget>
 
#include "ui_Hello.h"
 
 
class Hello : public QWidget
 
{
 
    Q_OBJECT
 
 
public:
 
    Hello(QWidget *parent = 0);
 
    ~Hello();
 
 
public slots: //We have added this section to handle "clicked()" event on "helloButton"
 
    void ShowHelloText(); // Fill the label text on clicking "Hello" button
 
 
private:
 
    Ui::HelloClass ui;
 
};
 
 
#endif // HELLO_H
 
</code>
 
 
=== Source file ===
 
<code cpp>
 
#include "Hello.h"
 
 
Hello::Hello(QWidget *parent)
 
    : QWidget(parent)
 
{
 
ui.setupUi(this);
 
 
        // Signal and slot mechanism for "helloButton"
 
QObject::connect(ui.helloButton, SIGNAL(clicked()), this, SLOT(ShowHelloText()));
 
}
 
 
Hello::~Hello()
 
{
 
 
}
 
 
//We have implemented the following function to display "HelloWorld!!!" text in TextLabel
 
void Hello::ShowHelloText()
 
{
 
ui.label->setText("HelloWorld!!!");
 
}
 
</code>
 
 
 
== Output ==
 
=== Initial state ===
 
[[Image:InitialStateEmulator.png]]
 
 
=== Hello button pressed state ===
 
[[Image:HelloPressedEmulator.png]]
 
 
 
== Example application ==
 
* Extract this example application: [[Media:Hello.zip|Hello.zip]]
 
* Import the .pro file from the previously extracted application in your Carbide.c++ IDE.
 
  '''Carbide.c++ >> Import >> Qt >> Qt Project >> Hello.pro'''
 
 
== Feedback ==
 
* If you encounter any problems in creating your HelloWorld application in Qt, please enter your feedback in the  <u>[[Talk:Getting started with Qt for Symbian|Comment page]]</u> of this article.
 
 
* Raise any other [[Qt for Symbian]] related questions on the [http://www.developer.nokia.com/Community/Discussion/forumdisplay.php?196-Qt-for-Symbian Qt for Symbian Discussion Boards].
 

Revision as of 12:27, 23 September 2011

Introduction

This article is for beginners who want to start development in Qt for Symbian.

Prerequisite

303 page views in the last 30 days.
×