Viadeo Twitter Google Bookmarks ! Facebook Digg del.icio.us MySpace Yahoo MyWeb Blinklist Netvouz Reddit Simpy StumbleUpon Bookmarks Windows Live Favorites 
Logo Documentation Qt ·  Page d'accueil  ·  Toutes les classes  ·  Toutes les fonctions  ·  Vues d'ensemble  · 

Creating a Qt Widget Based Application

This tutorial describes how to use Qt Creator to create a small Qt application, Text Finder. It is a simplified version of the QtUiTools Text Finder example. The application user interface is constructed from Qt widgets by using Qt Designer. The application logic is written in C++ by using the code editor.

Creating the Text Finder Project

Note: Create the project with two instances of Qt Creator open and the Help mode active in one of them so that you can follow these instructions while you work.

  1. Select File > New File or Project > Qt Widget Project > Qt Gui Application > Choose.

    "New File or Project dialog"

    The Introduction and Project Location dialog opens.

    "Introduction and Project Location dialog"

  2. In the Name field, type TextFinder.
  3. In the Create in field, enter the path for the project files. For example, C:\Qt\examples, and then click Next.

    The Target Setup dialog opens.

    "Target Setup dialog"

  4. Select the Qt versions to use as build targets for your project, and click Next.

    Note: If you have only one Qt version installed, this dialog is skipped.

    The Class Information dialog opens.

    "Class Information dialog"

  5. In the Class name field, type TextFinder as the class name.
  6. In the Base class list, select QWidget as the base class type.

    Note: The Header file, Source file and Form file fields are automatically updated to match the name of the class.

  7. Click Next.

    The Project Management dialog opens.

    "Project Management dialog"

  8. Review the project settings, and click Finish to create the project.

The TextFinder project now contains the following files:

  • textfinder.h
  • textfinder.cpp
  • main.cpp
  • textfinder.ui
  • textfinder.pro

"TextFinder project contents"

The .h and .cpp files come with the necessary boiler plate code. The .pro file is complete.

Filling in the Missing Pieces

Begin by designing the user interface and then move on to filling in the missing code. Finally, add the find functionality.

Designing the User Interface

"Text Finder UI"

  1. In the Editor mode, double-click the textfinder.ui file in the Projects view to launch the integrated Qt Designer.
  2. Drag and drop the following widgets to the form:

    "Adding widgets to Text Finder UI"

    Note: To easily locate the widgets, use the search box at the top of the Sidebar. For example, to find the Label widget, start typing the word label.

    "Filter field"

  3. Double-click the Label widget and enter the text Keyword.
  4. Double-click the Push Button widget and enter the text Find.
  5. In the Properties pane, change the objectName to findButton.

    "Changing object names"

  6. Press Ctrl+A to select the widgets and click Lay out Horizontally (or press Ctrl+H) to apply a horizontal layout (QHBoxLayout).

    "Applying horizontal layout"

  7. Drag and drop a Text Edit widget (QTextEdit) to the form.
  8. Select the screen area and click Lay out Vertically (or press Ctrl+L) to apply a vertical layout (QVBoxLayout).

    "Text Finder UI"

    Applying the horizontal and vertical layouts ensures that the application UI scales to different screen sizes.

  9. To call a find function when users press the Find button, you use the Qt signals and slots mechanism. A signal is emitted when a particular event occurs and a slot is a function that is called in response to a particular signal. Qt widgets have predefined signals and slots that you can use directly from Qt Designer. To add a slot for the find function:
    • Right-click the Find button to open a context-menu.
    • Select Go to Slot > clicked(), and then select OK.

      A private slot, on_findButton_clicked(), is added to the header file, textfinder.h and a private function, TextFinder::on_findButton_clicked(), is added to the source file, textfinder.cpp.

  10. Press Ctrl+S to save your changes.

For more information about designing forms with Qt Designer, see the Qt Designer Manual.

Completing the Header File

The textfinder.h file already has the necessary #includes, a constructor, a destructor, and the Ui object. You need to add a private function, loadTextFile(), to read and display the contents of the input text file in the QTextEdit.

  1. In the Projects pane in the Edit view, double-click the textfinder.h file to open it for editing.
  2. Add a private function to the private section, after the Ui::TextFinder pointer, as illustrated by the following code snippet:
     private slots:
     void on_findButton_clicked();

 private:
     Ui::TextFinder *ui;
     void loadTextFile();

Completing the Source File

Now that the header file is complete, move on to the source file, textfinder.cpp.

  1. In the Projects pane in the Edit view, double-click the textfinder.cpp file to open it for editing.
  2. Add code to load a text file using QFile, read it with QTextStream, and then display it on textEdit with setPlainText(). This is illustrated by the following code snippet:
     void TextFinder::loadTextFile()
 {
     QFile inputFile(":/input.txt");
     inputFile.open(QIODevice::ReadOnly);

     QTextStream in(&inputFile);
     QString line = in.readAll();
     inputFile.close();

     ui->textEdit->setPlainText(line);
     QTextCursor cursor = ui->textEdit->textCursor();
     cursor.movePosition(QTextCursor::Start, QTextCursor::MoveAnchor, 1);
 }
  3. To use QFile and QTextStream, add the following #includes to textfinder.cpp:
     #include <QtCore/QFile>
 #include <QtCore/QTextStream>
  4. For the on_findButton_clicked() slot, add code to extract the search string and use the find() function to look for the search string within the text file. This is illustrated by the following code snippet:
     void TextFinder::on_findButton_clicked()
 {
     QString searchString = ui->lineEdit->text();
     ui->textEdit->find(searchString, QTextDocument::FindWholeWords);
 }
  5. Once both of these functions are complete, add a line to call loadTextFile() in the constructor, as illustrated by the following code snippet:
     TextFinder::TextFinder(QWidget *parent)
     : QWidget(parent), ui(new Ui::TextFinder)
 {
     ui->setupUi(this);
     loadTextFile();
 }

The on_findButton_clicked() slot is called automatically in the uic generated ui_textfinder.h file by this line of code:

 QMetaObject::connectSlotsByName(TextFinder);

Creating a Resource File

You need a resource file (.qrc) within which you embed the input text file. The input file can be any .txt file with a paragraph of text. Create a text file called input.txt and store it in the textfinder folder.

To add a resource file:

  1. Select File > New File or Project > Qt > Qt Resource File > Choose.

    "New File or Project dialog"

    The Choose the Location dialog opens.

    "Choose the Location dialog"

  2. In the Name field, enter textfinder.
  3. In the Path field, enter C:\Qt\examples\TextFinder, and click Next.

    The Project Management dialog opens.

    "Project Management dialog"

  4. In the Add to project field, select TextFinder.pro and click Finish to open the file in the code editor.
  5. Select Add > Add Prefix.
  6. In the Prefix field, replace the default prefix with a slash (/).
  7. Select Add > Add Files, to locate and add input.txt.

    "Editing resource files"

Compiling and Running Your Program

Now that you have all the necessary files, click the button to compile and run your program.

[Previous: Creating a Qt Quick Application Using Qt Quick Components] [Next: Creating a Qt Widget Based Mobile Application]

© 2008-2011 Nokia Corporation and/or its subsidiaries. Nokia, Qt and their respective logos are trademarks of Nokia Corporation in Finland and/or other countries worldwide.

All other trademarks are property of their respective owners. Privacy Policy


Licensees holding valid Qt Commercial licenses may use this document in accordance with the Qt Commercial License Agreement provided with the Software or, alternatively, in accordance with the terms contained in a written agreement between you and Nokia.

Alternatively, this document may be used under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation.

X

Thank you for giving your feedback.

Make sure it is related to this specific page. For more general bugs and requests, please use the Qt Bug Tracker.

[0]; s.parentNode.insertBefore(ga, s); })();
Publicité

Best Of

Actualités les plus lues

Semaine
Mois
Année
  1. Microsoft ouvre aux autres compilateurs C++ AMP, la spécification pour la conception d'applications parallèles C++ utilisant le GPU 22
  2. Les développeurs ignorent-ils trop les failles découvertes dans leur code ? Prenez-vous en compte les remarques des autres ? 17
  3. RIM : « 13 % des développeurs ont gagné plus de 100 000 $ sur l'AppWord », Qt et open-source au menu du BlackBerry DevCon Europe 0
  4. BlackBerry 10 : premières images du prochain OS de RIM qui devrait intégrer des widgets et des tuiles inspirées de Windows Phone 0
  5. « Quelque chose ne va vraiment pas avec les développeurs "modernes" », un développeur à "l'ancienne" critique la multiplication des bibliothèques 10
  6. Adieu qmake, bienvenue qbs : Qt Building Suite, un outil déclaratif et extensible pour la compilation de projets Qt 17
  7. Quelles nouveautés de C++11 Visual C++ doit-il rapidement intégrer ? Donnez-nous votre avis 10
Page suivante

Le Qt Labs au hasard

Logo

La folie est de mettre en forme le même texte

Les Qt Labs sont les laboratoires des développeurs de Qt, où ils peuvent partager des impressions sur le framework, son utilisation, ce que pourrait être son futur. Lire l'article.

Communauté

Ressources

Liens utiles

Contact

  • Vous souhaitez rejoindre la rédaction ou proposer un tutoriel, une traduction, une question... ? Postez dans le forum Contribuez ou contactez-nous par MP ou par email (voir en bas de page).

Qt dans le magazine
Cette page est une traduction d'une page de la documentation de Qt, écrite par Nokia Corporation and/or its subsidiary(-ies). Les éventuels problèmes résultant d'une mauvaise traduction ne sont pas imputables à Nokia. Qt qtcreator-2.3
Copyright © 2012 Developpez LLC. Tous droits réservés Developpez LLC. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents et images sans l'autorisation expresse de Developpez LLC. Sinon, vous encourez selon la loi jusqu'à 3 ans de prison et jusqu'à 300 000 E de dommages et intérêts. Cette page est déposée à la SACD.
Vous avez déniché une erreur ? Un bug ? Une redirection cassée ? Ou tout autre problème, quel qu'il soit ? Ou bien vous désirez participer à ce projet de traduction ? N'hésitez pas à nous contacter ou par MP !
 
 
Developpez.com

Nous contacter

Participez

Informations légales

 
Services

Forum Qt

Blogs

Hébergement

 
Partenaires

Hébergement Web