Create a "Hello World" Qt Quick application and run it in the remote target.

To run the Qt Quick Application in this guide you need a rootfs image that includes the qtquickcontrols2 and qtquickcontrols2-qmlplugins packages. The default Digi Embedded Yocto X11 images do not include such packages.

See Update firmware for instructions.

1. Create the application

To create a "Hello World" application, first create an empty Qt Quick Application project and then add code to the project.

1.1. Create an Empty Qt Quick Application project

Follow these steps to create a new empty Qt Quick application project:

  1. Click File > New Project.

  2. Select Application (Qt) from the Projects list at the left.

  3. Select Qt Quick Application.

  4. Click Choose to start the project creation wizard.

  5. Fill the Project Location page fields:

    1. Enter a name for the new project, for example ccimx6ul_QtQ_HelloWorld.

    2. Set the location of the directory that will hold new project, for example /home/<user>/workspace.

      The selected directory must already exist.

  6. Click Next to continue.

  7. In the Build System page select qmake and click Next to continue:

  8. In the Details page, set the Minimum required Qt version to the version you configured in the Configure DEY Qt Compiler step.

  9. Click Next to continue.

  10. Leave Translation page default configuration and click Next.

  11. In the Kits page, check the previously created Kit configuration.

  12. Click Next to continue.

  13. In the Summary page, click Finish to end the wizard. The new project is created and displayed in the projects view.

1.2. Add code to the project

Follow these steps to add code to the project:

  1. Copy the following block of code and paste it inside the Window section of the main.qml file:

    Text {
    anchors.centerIn: parent
    text: "Hello, World!"
}

    The piece of code above creates a new text label in the center of the application window displaying the text "Hello, World!"

  2. Save the file (Ctrl+S or File > Save All)

2. Build the project

Follow these steps to build the project:

  1. Click Build > Build All Projects or Build > Build Project ccimx6ul_QtQ_HelloWorld.

  2. The build process starts and the output is shown in the Compile Output console.

If you receive an error similar to the following while building your project, you have not sourced the toolchain environment setup script correctly before executing Qt Creator. See Start Qt Creator from a configured toolchain shell for more information.

make: c: Command not found
make: o: Command not found

3. Launch the application

3.1. Configure the application run environment

Follow these steps to ensure the remote application is executed within a clean environment and the correct display is selected when it is launched:

  1. Click the Projects icon on the left bar.

  2. Under Build & Run, select Run. The right pane displays Run Settings.

  3. Scroll down the right pane until the Environment section is displayed. Click Details.

  4. Select Clean Environment in Base environment for this run configuration setting to ensure the application uses a clean environment when it is launched.

  5. Click the Add button next to the environment variables list.

    1. Set the following values to select the correct display when the application launches:

      Variable name Variable value

      DISPLAY

      :0.0

3.2. Launch the application in the remote device

Follow these steps to launch the application in the remote device:

  1. In the left vertical toolbar, click the Run button (green play icon).

  2. The application is automatically transferred and launched in the remote device, displaying a window with the "Hello, World!" text.

4. Debug the application

Follow these steps to debug the "Hello world" application:

  1. Click Edit > Preferences.

  2. Select Debugger from the list.

  3. In the right pane, select the GDB tab.

  4. Add the following line to the Additional Startup Commands text box:

    handle SIGILL pass nostop noprint
    This is only needed if you see the "SIGILL" signal error message when running the app.

    This keeps the sigkill signal from causing the debugged application to finish on startup before reaching the main() loop.

    This step is only required once. For subsequent debug sessions, skip this step and go directly to step 6.

  5. Click OK to save the changes and close the Options dialog.

  6. Double click the main.cpp file inside the Sources folder of the project.

  7. Once the file opens, right-click the following line:

    return app.exec();

    Select Set Breakpoint at Line X (where X is the line number) to add a breakpoint in the application before displaying the "Hello World" window.

  8. In the left vertical toolbar, click the Start Debugger button (green play icon with small bug) to start the debug session.

  9. The debug process starts and the session stops at the established breakpoint.

Default Digi Embedded Yocto images only include very basic Qt packages and plugins. To run more advanced Qt applications and plugins you need to include additional Qt packages from meta-qt5 layer to your Digi Embedded Yocto rootfs images. To do so, add such packages to your conf/local.conf project file. For example, to include Qt quikcontrols and QML plugins:

conf/local.conf
# Required Qt packages for Qt Quick Application
IMAGE_INSTALL:append:pn-dey-image-qt = " qtquickcontrols2 qtquickcontrols2-qmlplugins"

See Create and build projects for more information on how to build rootfs images.

If you want to use QT6 instead of QT5, replace the source code to point to meta-qt6 by editing your project’s conf/bblayers.conf configuration file as:

conf/bblayers.conf
/usr/local/dey-4.0/sources/meta-openembedded/meta-networking \
/usr/local/dey-4.0/sources/meta-openembedded/meta-webserver \
- /usr/local/dey-4.0/sources/meta-qt5 \
+ /usr/local/dey-4.0/sources/meta-qt6 \
/usr/local/dey-4.0/sources/meta-swupdate \