feedc0de/qt-creator
1
0
Fork 0
forked from qt-creator/qt-creator
Code Pull Requests Activity

Doc: Update tutorials

Browse Source 
- Use \ingroup creator-tutorials to group tutorials
- Use \annotatedlist to automatically generate tables that list tutorials
- Add \brief commands to add descriptions to the tables
- Remove some leftover descriptions from the Qt Quick Application
  wizard template docs
- Fix references to UI text
- Write "you" instead of "we"
- Use curly braces to define alt text for images
- Some language fixes

Task-number: QTCREATORBUG-28996
Change-Id: I4b611319b6867cae11d613e0a4d075923cdb037e
Reviewed-by: Eike Ziller <eike.ziller@qt.io>
Reviewed-by: <github-actions-qt-creator@cristianadam.eu>
This commit is contained in:
Leena Miettinen
2023-06-30 13:06:51 +02:00
parent 6235d9b8cc
commit a0f0f9c69b
6 changed files with 98 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
doc/qtcreator/src/widgets/qtdesigner-app-tutorial.qdoc
View File

@@ -1,19 +1,17 @@
// Copyright (C) 2023 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
// **********************************************************************
// NOTE: the sections are not ordered by their logical order to avoid
// reshuffling the file each time the index order changes (i.e., often).
// Run the fixnavi.pl script to adjust the links to the index order.
// **********************************************************************
/*!
\previouspage {Creating a Qt Quick Application}
\page creator-writing-program.html
\nextpage {Creating a Mobile Application}
\previouspage creator-tutorials.html
\nextpage creator-project-managing.html
\ingroup creator-tutorials
\title Creating a Qt Widget Based Application
\brief How to use the integrated \QD to create a Qt widget based application
for the desktop.
This tutorial describes how to use \QC to create a small Qt application,
Text Finder. It is a simplified version of the Qt UI Tools \l{Text Finder}
example. You'll use \QD to construct the application user interface from
@@ -29,11 +27,11 @@
\uicontrol {Application (Qt)} > \uicontrol {Qt Widgets Application}
> \uicontrol Choose.
\image qtcreator-new-qt-gui-application.png "New Project dialog"
\image qtcreator-new-qt-gui-application.png {New Project dialog}
The \uicontrol{Introduction and Project Location} dialog opens.
The \uicontrol{Project Location} dialog opens.
\image qtcreator-intro-and-location-qt-gui.png "Introduction and Project Location dialog"
\image qtcreator-intro-and-location-qt-gui.png {Project Location dialog}
\li In the \uicontrol{Name} field, type \b {TextFinder}.
@@ -44,7 +42,7 @@
\uicontrol Continue (on \macos) to open the
\uicontrol {Define Build System} dialog.
\image qtcreator-new-project-build-system-qt-gui.png "Define Build System dialog"
\image qtcreator-new-project-build-system-qt-gui.png {Define Build System dialog}
\li In the \uicontrol {Build system} field, select \l {Setting Up CMake}
{CMake} as the build system to use for building the project.
@@ -52,7 +50,7 @@
\li Select \uicontrol Next or \uicontrol Continue to open the
\uicontrol{Class Information} dialog.
\image qtcreator-class-info-qt-gui.png "Class Information dialog"
\image qtcreator-class-info-qt-gui.png {Class Information dialog}
\li In the \uicontrol{Class name} field, type \b {TextFinder} as the class
name.
@@ -66,7 +64,7 @@
\li Select \uicontrol Next or \uicontrol Continue to open the
\uicontrol {Translation File} dialog.
\image qtcreator-new-qt-gui-application-translationfile.png "Translation File dialog"
\image qtcreator-new-qt-gui-application-translationfile.png {Translation File dialog}
\li In the \uicontrol Language field, you can select a language that you
plan to \l {Using Qt Linguist}{translate} the application to. This
@@ -76,7 +74,7 @@
\li Select \uicontrol Next or \uicontrol Continue to open the
\uicontrol {Kit Selection} dialog.
\image qtcreator-new-project-qt-versions-qt-gui.png "Kit Selection dialog"
\image qtcreator-new-project-qt-versions-qt-gui.png {Kit Selection dialog}
\li Select build and run \l{glossary-buildandrun-kit}{kits} for your
project.
@@ -84,7 +82,7 @@
\li Select \uicontrol Next or \uicontrol Continue to open the
\uicontrol {Project Management} dialog.
\image qtcreator-new-project-summary-qt-gui.png "Project Management dialog"
\image qtcreator-new-project-summary-qt-gui.png {Project Management dialog}
\li Review the project settings, and select \uicontrol{Finish} (on Windows and
Linux) or \uicontrol Done (on \macos) to create the project.
@@ -106,7 +104,7 @@
\endlist
\image qtcreator-textfinder-contents.png "TextFinder project contents"
\image qtcreator-textfinder-contents.png {TextFinder project contents}
The .h and .cpp files come with the necessary boiler plate code.
@@ -120,14 +118,14 @@
\section2 Designing the User Interface
\image qtcreator-textfinder-ui.png "Text Finder UI"
\image qtcreator-textfinder-ui.png {Text Finder UI}
\list 1
\li In the \uicontrol{Editor} mode, double-click the textfinder.ui file in the
\uicontrol{Projects} view to launch the integrated \QD.
\li Drag and drop the following widgets to the form:
\li Drag the following widgets to the form:
\list
@@ -137,13 +135,13 @@
\endlist
\image qtcreator-textfinder-ui-widgets.png "Adding widgets to Text Finder UI"
\image qtcreator-textfinder-ui-widgets.png {Adding widgets to Text Finder UI}
\note To easily locate the widgets, use the search box at the top of the
\uicontrol Sidebar. For example, to find the \uicontrol Label widget, start typing
the word \b label.
\image qtcreator-textfinder-filter.png "Filter field"
\image qtcreator-textfinder-filter.png {Filter field}
\li Double-click the \uicontrol{Label} widget and enter the text
\b{Keyword}.
@@ -154,21 +152,21 @@
\li In the \uicontrol Properties view, change the \uicontrol objectName to
\b findButton.
\image qtcreator-textfinder-objectname.png "Changing object names"
\image qtcreator-textfinder-objectname.png {Changing object names}
\li Press \key {Ctrl+A} (or \key {Cmd+A}) to select the widgets and
select \uicontrol{Lay out Horizontally} (or press \key {Ctrl+H} on Linux or
Windows or \key {Ctrl+Shift+H} on \macos) to apply a horizontal
layout (QHBoxLayout).
\image qtcreator-textfinder-ui-horizontal-layout.png "Applying horizontal layout"
\image qtcreator-textfinder-ui-horizontal-layout.png {Applying horizontal layout}
\li Drag and drop a \uicontrol{Text Edit} widget (QTextEdit) to the form.
\li Drag a \uicontrol{Text Edit} widget (QTextEdit) to the form.
\li Select the screen area, and then select \uicontrol{Lay out Vertically}
(or press \key {Ctrl+L}) to apply a vertical layout (QVBoxLayout).
\image qtcreator-textfinder-ui.png "Text Finder UI"
\image qtcreator-textfinder-ui.png {Text Finder UI}
Applying the horizontal and vertical layouts ensures that the
application UI scales to different screen sizes.
@@ -274,11 +272,11 @@
\li Select \uicontrol File > \uicontrol {New File} >
\uicontrol Qt > \uicontrol {Qt Resource File} > \uicontrol Choose.
\image qtcreator-add-resource-wizard.png "New File dialog"
\image qtcreator-add-resource-wizard.png {New File dialog}
The \uicontrol {Choose the Location} dialog opens.
\image qtcreator-add-resource-wizard2.png "Choose the Location dialog"
\image qtcreator-add-resource-wizard2.png {Choose the Location dialog}
\li In the \uicontrol{Name} field, enter \b{textfinder}.
@@ -287,7 +285,7 @@
The \uicontrol{Project Management} dialog opens.
\image qtcreator-add-resource-wizard3.png "Project Management dialog"
\image qtcreator-add-resource-wizard3.png {Project Management dialog}
\li In the \uicontrol{Add to project} field, select \b{TextFinder}
@@ -302,7 +300,7 @@
\li Select \uicontrol Add > \uicontrol {Add Files}, to locate and add
input.txt.
\image qtcreator-add-resource.png "Editing resource files"
\image qtcreator-add-resource.png {Editing resource files}
\endlist
@@ -320,6 +318,6 @@
Now that you have all the necessary files, select the
\inlineimage icons/run_small.png
button to compile and run your Application.
button to compile and run your application.
*/