Doc: Convert Qt Widgets tutorial to use CMake as build system

- Describe adding resource file to CMakeLists.txt
- Update screenshots

Fixes: QTCREATORBUG-26686
Change-Id: I2b06a9753ee73b736982923e3b2a5bb6b4dd8861
Reviewed-by: Cristian Adam <cristian.adam@qt.io>

doc/qtcreator/examples/textfinder/CMakeLists.txt

@@ -0,0 +1,71 @@
+cmake_minimum_required(VERSION 3.5)
+
+project(TextFinder VERSION 0.1 LANGUAGES CXX)
+
+set(CMAKE_INCLUDE_CURRENT_DIR ON)
+
+set(CMAKE_AUTOUIC ON)
+set(CMAKE_AUTOMOC ON)
+set(CMAKE_AUTORCC ON)
+
+set(CMAKE_CXX_STANDARD 17)
+set(CMAKE_CXX_STANDARD_REQUIRED ON)
+
+find_package(QT NAMES Qt6 Qt5 REQUIRED COMPONENTS Widgets LinguistTools)
+find_package(Qt${QT_VERSION_MAJOR} REQUIRED COMPONENTS Widgets LinguistTools)
+
+set(TS_FILES TextFinder_de_DE.ts)
+
+set(PROJECT_SOURCES
+        main.cpp
+        textfinder.cpp
+        textfinder.h
+        textfinder.ui
+        ${TS_FILES}
+        textfinder.qrc
+)
+
+if(${QT_VERSION_MAJOR} GREATER_EQUAL 6)
+    qt_add_executable(TextFinder
+        MANUAL_FINALIZATION
+        ${PROJECT_SOURCES}
+    )
+# Define target properties for Android with Qt 6 as:
+#    set_property(TARGET TextFinder APPEND PROPERTY QT_ANDROID_PACKAGE_SOURCE_DIR
+#                 ${CMAKE_CURRENT_SOURCE_DIR}/android)
+# For more information, see https://doc.qt.io/qt-6/qt-add-executable.html#target-creation
+
+    qt_create_translation(QM_FILES ${CMAKE_SOURCE_DIR} ${TS_FILES})
+else()
+    if(ANDROID)
+        add_library(TextFinder SHARED
+            ${PROJECT_SOURCES}
+        )
+# Define properties for Android with Qt 5 after find_package() calls as:
+#    set(ANDROID_PACKAGE_SOURCE_DIR "${CMAKE_CURRENT_SOURCE_DIR}/android")
+    else()
+        add_executable(TextFinder
+            ${PROJECT_SOURCES}
+        )
+    endif()
+
+    qt5_create_translation(QM_FILES ${CMAKE_SOURCE_DIR} ${TS_FILES})
+endif()
+
+target_link_libraries(TextFinder PRIVATE Qt${QT_VERSION_MAJOR}::Widgets)
+
+set_target_properties(TextFinder PROPERTIES
+    MACOSX_BUNDLE_GUI_IDENTIFIER my.example.com
+    MACOSX_BUNDLE_BUNDLE_VERSION ${PROJECT_VERSION}
+    MACOSX_BUNDLE_SHORT_VERSION_STRING ${PROJECT_VERSION_MAJOR}.${PROJECT_VERSION_MINOR}
+    MACOSX_BUNDLE TRUE
+    WIN32_EXECUTABLE TRUE
+)
+
+install(TARGETS TextFinder
+    BUNDLE DESTINATION .
+    LIBRARY DESTINATION ${CMAKE_INSTALL_LIBDIR})
+
+if(QT_VERSION_MAJOR EQUAL 6)
+    qt_finalize_executable(TextFinder)
+endif()

doc/qtcreator/examples/textfinder/TextFinder_de_DE.ts

@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE TS>
+<TS version="2.1" language="de_DE">
+<context>
+    <name>TextFinder</name>
+    <message>
+        <location filename="textfinder.ui" line="14"/>
+        <source>TextFinder</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="textfinder.ui" line="22"/>
+        <source>Keyword</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="textfinder.ui" line="32"/>
+        <source>Find</source>
+        <translation type="unfinished"></translation>
+    </message>
+</context>
+</TS>

doc/qtcreator/examples/textfinder/main.cpp

@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2016 The Qt Company Ltd.
+** Copyright (C) 2022 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of Qt Creator
@@ -47,15 +47,25 @@
 ** $QT_END_LICENSE$
 **
 ****************************************************************************/
-
 #include "textfinder.h"
 
 #include <QApplication>
+#include <QLocale>
+#include <QTranslator>
 
 int main(int argc, char *argv[])
 {
-    Q_INIT_RESOURCE(textfinder);
     QApplication a(argc, argv);
+
+    QTranslator translator;
+    const QStringList uiLanguages = QLocale::system().uiLanguages();
+    for (const QString &locale : uiLanguages) {
+        const QString baseName = "TextFinder_" + QLocale(locale).name();
+        if (translator.load(":/i18n/" + baseName)) {
+            a.installTranslator(&translator);
+            break;
+        }
+    }
     TextFinder w;
     w.show();
     return a.exec();

doc/qtcreator/examples/textfinder/textfinder.cpp

@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2016 The Qt Company Ltd.
+** Copyright (C) 2022 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of Qt Creator
@@ -47,18 +47,18 @@
 ** $QT_END_LICENSE$
 **
 ****************************************************************************/
-
 #include "textfinder.h"
 
 //! [1]
+#include "./ui_textfinder.h"
 #include <QFile>
 #include <QTextStream>
 //! [1]
-#include <QMessageBox>
 
 //! [3]
 TextFinder::TextFinder(QWidget *parent)
-    : QWidget(parent), ui(new Ui::TextFinder)
+    : QWidget(parent)
+    , ui(new Ui::TextFinder)
 {
     ui->setupUi(this);
     loadTextFile();

doc/qtcreator/examples/textfinder/textfinder.h

@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2016 The Qt Company Ltd.
+** Copyright (C) 2022 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of Qt Creator
@@ -47,24 +47,21 @@
 ** $QT_END_LICENSE$
 **
 ****************************************************************************/
-
-#pragma once
-
-#include "ui_textfinder.h"
+#ifndef TEXTFINDER_H
+#define TEXTFINDER_H
 
 #include <QWidget>
 
-namespace Ui
-{
-    class TextFinder;
-}
+QT_BEGIN_NAMESPACE
+namespace Ui { class TextFinder; }
+QT_END_NAMESPACE
 
 class TextFinder : public QWidget
 {
     Q_OBJECT
 
 public:
-    TextFinder(QWidget *parent = 0);
+    TextFinder(QWidget *parent = nullptr);
     ~TextFinder();
 
 //! [0]
@@ -76,3 +73,4 @@ private:
     void loadTextFile();
 //! [0]
 };
+#endif // TEXTFINDER_H

doc/qtcreator/examples/textfinder/textfinder.pro

@@ -1,13 +0,0 @@
-TARGET = TextFinder
-TEMPLATE = app
-
-QT += widgets
-
-SOURCES += main.cpp\
-        textfinder.cpp
-
-HEADERS  += textfinder.h
-
-FORMS    += textfinder.ui
-
-RESOURCES += textfinder.qrc

doc/qtcreator/examples/textfinder/textfinder.qrc

@@ -1,5 +1,5 @@
- <!DOCTYPE RCC><RCC version="1.0">
- <qresource>
-     <file>input.txt</file>
- </qresource>
- </RCC>
+<RCC>
+    <qresource prefix="/">
+        <file>input.txt</file>
+    </qresource>
+</RCC>

doc/qtcreator/examples/textfinder/textfinder.ui

@@ -6,33 +6,30 @@
    <rect>
     <x>0</x>
     <y>0</y>
-    <width>378</width>
-    <height>158</height>
+    <width>800</width>
+    <height>600</height>
    </rect>
   </property>
   <property name="windowTitle">
-   <string>Find Text</string>
+   <string>TextFinder</string>
   </property>
-  <layout class="QVBoxLayout">
+  <layout class="QVBoxLayout" name="verticalLayout">
    <item>
-    <layout class="QGridLayout">
-     <item row="0" column="1">
-      <widget class="QLineEdit" name="lineEdit"/>
-     </item>
-     <item row="0" column="0">
-      <widget class="QLabel" name="searchLabel">
+    <layout class="QHBoxLayout" name="horizontalLayout">
+     <item>
+      <widget class="QLabel" name="label">
        <property name="text">
-        <string>&amp;Keyword:</string>
-       </property>
-       <property name="buddy">
-        <cstring>lineEdit</cstring>
+        <string>Keyword</string>
        </property>
       </widget>
      </item>
-     <item row="0" column="2">
+     <item>
+      <widget class="QLineEdit" name="lineEdit"/>
+     </item>
+     <item>
       <widget class="QPushButton" name="findButton">
        <property name="text">
-        <string>&amp;Find</string>
+        <string>Find</string>
        </property>
       </widget>
      </item>
@@ -41,38 +38,8 @@
    <item>
     <widget class="QTextEdit" name="textEdit"/>
    </item>
-   <item>
-    <spacer>
-     <property name="orientation">
-      <enum>Qt::Vertical</enum>
-     </property>
-     <property name="sizeHint" stdset="0">
-      <size>
-       <width>20</width>
-       <height>16</height>
-      </size>
-     </property>
-    </spacer>
-   </item>
   </layout>
  </widget>
  <resources/>
- <connections>
-  <connection>
-   <sender>lineEdit</sender>
-   <signal>returnPressed()</signal>
-   <receiver>findButton</receiver>
-   <slot>animateClick()</slot>
-   <hints>
-    <hint type="sourcelabel">
-     <x>261</x>
-     <y>17</y>
-    </hint>
-    <hint type="destinationlabel">
-     <x>320</x>
-     <y>17</y>
-    </hint>
-   </hints>
-  </connection>
- </connections>
+ <connections/>
 </ui>

doc/qtcreator/src/widgets/qtdesigner-app-tutorial.qdoc

@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2021 The Qt Company Ltd.
+** Copyright (C) 2022 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the Qt Creator documentation.
@@ -68,9 +68,8 @@
 
             \image qtcreator-new-project-build-system-qt-gui.png "Define Build System dialog"
 
-        \li In the \uicontrol {Build system} field, select the build system to
-            use for building and running the project: \l qmake,
-            \l {Setting Up CMake}{CMake}, or \l {Setting Up Qbs}{Qbs}.
+        \li In the \uicontrol {Build system} field, select \l {Setting Up CMake}
+            {CMake} as the build system to use for building the project.
 
         \li Select \uicontrol Next or \uicontrol Continue to open the
             \uicontrol{Class Information} dialog.
@@ -117,8 +116,7 @@
     \note The project opens in the \uicontrol Edit mode, and these instructions are
     hidden. To return to these instructions, open the \uicontrol Help mode.
 
-    If you selected qmake as the build system, the TextFinder project now
-    contains the following files:
+    The TextFinder project now contains the following files:
 
     \list
 
@@ -126,14 +124,13 @@
         \li textfinder.h
         \li textfinder.cpp
         \li textfinder.ui
-        \li textfinder.pro
+        \li CMakeLists.txt
 
     \endlist
 
     \image qtcreator-textfinder-contents.png "TextFinder project contents"
 
     The .h and .cpp files come with the necessary boiler plate code.
-    The .pro file is complete.
 
     If you selected CMake as the build system, \QC created a CMakeLists.txt
     project file for you.
@@ -312,7 +309,7 @@
 
         \li In the \uicontrol{Name} field, enter \b{textfinder}.
 
-        \li In the \uicontrol{Path} field, enter \c{C:\Qt\examples\TextFinder},
+        \li In the \uicontrol{Path} field, enter the path to the project,
             and select \uicontrol Next or \uicontrol Continue.
 
             The \uicontrol{Project Management} dialog opens.
@@ -320,10 +317,16 @@
             \image qtcreator-add-resource-wizard3.png "Project Management dialog"
 
 
-        \li In the \uicontrol{Add to project} field, select \b{TextFinder.pro}
+        \li In the \uicontrol{Add to project} field, select \b{TextFinder}
             and select \uicontrol{Finish} or \uicontrol Done to open the file
             in the code editor.
 
+        \li In the \uicontrol Copy to Clipboard dialog, select \uicontrol Yes to
+            copy the path to the resource file to the clipboard for adding it
+            to the CMakeLists.txt file.
+
+            \image qtcreator-add-resource-wizard4.png "Copy to Clipboard dialog"
+
         \li Select \uicontrol Add > \uicontrol {Add Prefix}.
 
         \li In the \uicontrol{Prefix} field, replace the default prefix with a slash
@@ -336,10 +339,20 @@
 
     \endlist
 
-    \section1 Compiling and Running Your Program
+    \section1 Adding Resources to Project File
+
+    For the text file to appear when you run the application, you must specify
+    the resource file as a source file in the \e CMakeLists.txt file that the
+    wizard created for you:
+
+    \quotefromfile TextFinder/CMakeLists.txt
+    \skipto set(PROJECT_SOURCES
+    \printuntil )
+
+    \section1 Compiling and Running Your Application
 
     Now that you have all the necessary files, select the
     \inlineimage icons/run_small.png
-    button to compile and run your program.
+    button to compile and run your Application.
 
 */