Bureaucrats, dave_user, Administrators
8,186
edits
Changes
m
= Setting up Qt Creator to build for XELK =
{{ImportantMessage|text=Note: The version of Qt Creator may differ from images below. The version provided from XELK 4.0.0 release is 4.5.2}}
Select <code>Devices</code> and click Choose the '''Add'Generic Linux device'':
Choose Insert the IP address of your device, ''Generic Linux deviceroot''as username and leave password empty (this is the default configuration of DESK-MX6-L root file systems). Make sure that the device is connected to the network and your virtual machine networking is correctly configured (see [[VirtualBox Network Configuration|this]] article for more details).
[[FileThen click '''Next''':QtCreator XELK 3 0 0 23.png|400px|border|center]]
Insert the IP address of your [[File:QtCreator-4.4.1_devices-linux-device, ''root'' as username and leave password empty (this is the default configuration of XELK root file systems)-EVK. Make sure that the device is connected to the network and your virtual machine networking is correctly configured (see [[VirtualBox Network Configurationpng|600px|border|thiscenter]] article for more details).
Then click '''Next'''.The device will be created and the connectivity will be tested:
U0007 moved page XELK-AN-004: Getting Started With QT Creator to DESK-MX-L-AN-0007: Getting Started With QT Creator
{{InfoBoxTop}}
{{AppliesToAxel}}{{AppliesToAxelEsatta}}{{AppliesToAxelLite}}{{Applies To YoctoAppliesToAXEL Lite AN}}
{{InfoBoxBottom}}
{{WarningMessage|text=This application note was validated against specific versions of the kit only. It may not work with other versions. Supported versions are listed in the ''History'' section.}}
{| class="wikitable" border="1"
!VersionPage version
!Date
!XELK version
|First release
|-
|1{{oldid|8847|2.0.0}}
|August 2019
|[[Axel_Embedded_Linux_Kit_(XELK)#XELK_software_components|XELK 4.0.0]]
|Updated XELK version
|-
|3.0.0
|August 2022
|{{pageoldid|DESK-MX6-L|15794|DESK-MX6-L 1.0.0}}
|DESK-MX6-L version
|}
= Introduction =
This application note details QT Creator setup and configuration in [[Axel_Embedded_Linux_Kit_(XELK)DESK-MX6-L|XELKDESK-MX6-L]] [[Managed Virtual Machine (MVM)|MVM]] = Setting up Qt Creator to build for DESK-MX6-L ={{ImportantMessage|text=Note: The version of Qt Creator may differ from images below. The version used is the release is 4.4.1 which can be downloaded form [https://download.qt.io/archive/qtcreator/4.4/4.4.1/ Qt archive server]}}
== Qt Creator Installation ==
<pre>
dvdk@vagrant-ubuntu-trusty-64:~$ cd axeldesk-mx-l/
</pre>
<pre>
dvdk@vagrant-ubuntu-trusty-64:~/axeldesk-mx-l$ ./qt-creator-opensource-linux-x86_64-4.4.1.run
</pre>
An installation wizard will appear. Clik '''Next''' to proced with the installation.
[[File:QtCreator XELK 3 0 0 01-4.4.1_setup.png|400px|border|center]]
Select '''Skip'''.
[[File:QtCreator XELK 3 0 0 02-4.4.1_skip.png|400px|border|center]]
Select '''Next'''.
[[File:QtCreator XELK 3 0 0 03-4.4.1_next.png|400px|border|center]]
Select the install directory or click '''Next'''.
[[File:QtCreator XELK 3 0 0 04-4.4.1_folder.png|400px|border|center]]
Select '''Next'''.
[[File:QtCreator XELK 3 0 0 05-4.4.1_components.png|400px|border|center]]
Click '''Next''' again.
[[File:QtCreator XELK 3 0 0 06-4.4.1_license.png|400px|border|center]]
And then click '''Install''' and complete the installation.
[[File:QtCreator XELK 3 0 0 07-4.4.1_install.png|400px|border|center]]
Then '''Finish''' to exit the setup wizard.
[[File:QtCreator XELK 3 0 0 08.png|400px|border|center]]<!--== Automatic configuration == Now it is necessary to add the definition of your board before developing and compiling your applications4. In order to add the device information automatically, DAVE provides a simple setup script4. <!-- User just need to run the following commands inside your terminal emulator: <pre>dvdk@vagrant-ubuntu-trusty-64:~$ cd axel/dvdk@vagrant-ubuntu-trusty-64:~/axel$ ./qt-post-install.sh</pre> If the installation process complete successfully, you should see inside the <code>Tools -> Options -> Kits</code> a ''kit'' named XELK, as in the following screenshot: [[File:QtCreator XELK 3 0 0 09.png|400px|border|center]] Select the Kits tab and make sure that your configurations matches the one displayed below: [[File:QtCreator XELK 3 0 0 101_finish.png|400px|border|center]] -->
== Manual configuration ==
=== Devices ===
Go to <code>Tools -> Options</code> menu : [[File:QtCreator-4.4.1_tools-options.png|1000px|border|center]] Select <code>Devices</code> and click '''Add''':
[[File:QtCreator XELK 3 0 0 09-4.4.1_devices-add.png|400px700px|border|center]]
[[File:QtCreator XELK 3 0 0 22-4.4.1_devices-linux-device.png|400px500px|border|center]]
[[File:QtCreator XELK 3 0 0 24-4.4.1_devices-linux-device-EVK-connect.png|400px600px|border|center]]
If everything went ok you should see a dialog like the image below.
[[File:QtCreator XELK 3 0 0 25-4.4.1_devices-linux-device-EVK-test.png|400px500px|border|center]]
And finally , this is how what the <code>Devices</code> window should look like.
[[File:QtCreator XELK 3 0 0 26-4.4.1_devices-linux-device-EVK-configured.png|400px800px|border|center]]
=== GCC & Cross Compilation ===
Next you need to configure the cross compilation tool inside <code>Build & Run -> Compiler</code>.
[[File:QtCreator XELK 3 0 0 27-4.4.1_devices-linux-build-and-run.png|400px800px|border|center]]
Click <code>Add -> GCC</code> and add the compiler path.
<pre>
/home/dvdk/axeldesk-mx-l/sdk/latestlatest_desk-mx6-l/sysroots/x86_64-pokysdk-linux/usr/bin/arm-poky-linux-gnueabi/arm-poky-linux-gnueabi-gcc
</pre>
And click '''Apply'''.
[[File:QtCreator XELK 3 0 0 29-4.4.1_devices-linux-build-and-run-gcc.png|400px1200px|border|center]]
Do the same for the C++ cross compilation tool.
<pre>
/home/dvdk/axeldesk-mx-l/sdk/latestlatest_desk-mx6-l/sysroots/x86_64-pokysdk-linux/usr/bin/arm-poky-linux-gnueabi/arm-poky-linux-gnueabi-g++
</pre>
[[File:QtCreator XELK 3 0 0 28-4.4.1_devices-linux-build-and-run-g++.png|400px1200px|border|center]]
=== Debugger GDB ===
Now it is necessary to add a debugger. In order to do this go to the <code>Debuggers</code> tab and click '''Add''' [[File:QtCreator XELK 3 0 0 30.png|400px|border|center]] And and then select the GDB debugger at the location
<pre>
/home/dvdk/axeldesk-mx-l/sdk/latestlatest_desk-mx6-l/sysroots/x86_64-pokysdk-linux/usr/bin/arm-poky-linux-gnueabi/arm-poky-linux-gnueabi-gdb
</pre>
and click '''Apply'''.
[[File:QtCreator XELK 3 0 0 31-4.4.1_devices-linux-build-and-run-gdb.png|400px1200px|border|center]]
=== Qt Version ===
<pre>
/home/dvdk/axeldesk-mx-l/sdk/latestlatest_desk-mx6-l/sysroots/x86_64-pokysdk-linux/usr/bin/qt5/qmake
</pre>
[[File:QtCreator XELK 3 0 0 32-4.4.1_devices-linux-build-and-run-qmake.png|400px1200px|border|center]]
=== Kits ===
The last step is to add a new kit. Go to <code>Kits</code> and click '''Add''' and complete the information as shown below. [[File:QtCreator XELK 3 0 0 33.png|400px|border|center]] Pay attention that in <code>Qt mkspec</code> you need to write
<pre>
</pre>
[[File:QtCreator XELK 3 0 0 34-4.4.1_devices-linux-build-and-run-EVK.png|400px1200px|border|center]]
After this your setup is complete and you can proceed and create your Qt applications.
<pre>
dvdk@vagrant:~/desk-ubuntu-trustymx-64:~l$ source envdesk-mx6-l-1.0.0_env.sh
</pre>
<pre>
dvdk@vagrant-ubuntu-trusty-64:~$ ./qtcreator-4.54.21/bin/qtcreator
</pre>
{{ImportantMessage|text=It is important to repeat the previous two step steps every time you start QTCreator}}
Now click on <code>New Project</code>
[[File:QtCreator XELK 3 0 0 11-4.4.1_project.png|400px1200px|border|center]]
Select Application Qt Widgets Application and click '''Choose...'''
[[File:QtCreator XELK 3 0 0 12-4.4.1_new-project.png|400px800px|border|center]]
Now call the Project ''Test'' and press '''Next'''.
[[File:QtCreator XELK 3 0 0 13-4.4.1_new-project-test.png|400px800px|border|center]]
Select the ''XELK KitSBC AXEL EVK'' and click '''Next'''.
[[File:QtCreator XELK 3 0 0 14-4.4.1_new-project-SBC-AXEL-EVK.png|400px800px|border|center]]
Choose the ''class'' name for your application.
[[File:QtCreator XELK 3 0 0 15-4.4.1_new-project-SBC-AXEL-EVK-class.png|400px800px|border|center]]
Click '''Finish''' to conclude the setup.
[[File:QtCreator XELK 3 0 0 16-4.4.1_new-project-SBC-AXEL-EVK-finish.png|400px800px|border|center]]
To add a clickable button to your application, select the <code>Edit</code> window and select <code>Test -> Forms -> mainwindow.ui</code>
[[File:QtCreator XELK 3 0 0 17-4.4.1_project-Test-MainWindow.png|400px1200px|border|center]]
Click on Push Button in the Buttons tab and drag it to the main window view. In order to edit the text displayed by the label, double click it and write ''"Hello World!"''.
[[File:QtCreator XELK 3 0 0 18-4.4.1_project-Test-MainWindow-Pushbutton.png|400px1200px|border|center]]
After that, you need to insert the following two line inside the ''Test.pro'' file
<pre>
target.path = /tmphome/root/Test # path on device
</pre>
<pre>
</pre>
Where <code>/temphome/root/Test</code> is the path in which your application will be downloaded inside the device.
[[File:QtCreator XELK 3 0 0 19-4.4.1_project-Test-MainWindow-TestPro.png|1200px|border|center]] Build the project in order to complete the configuration and set the overall vars: [[File:QtCreator-4.4.1_project-Test-MainWindow-Build.png|400px1200px|border|center]]
The last step before running the application inside the device is to configure Qt backend into application command line arguments: open the <code>Project</code> window and select the <code>Run</code> configuration, then type <code>-platform eglfs</code> into <code>Arguments</code>
[[File:QtCreator XELK 3 0 0 20-4.4.1_project-Test-MainWindow-eglfs.png|400px1200px|border|center]]
After these changes you are ready to debug your application inside your board with the <code>Run/Debug</code> command [[File:QtCreator XELK 3 0 0 35.png|30px]]
[[File:QtCreator XELK 3 0 0 21-4.4.1_project-Test-MainWindow-debug.png|1200px|border|center]] The debugger (via <code>gdb server</code>) will be activated and the debug window will be ready: [[File:QtCreator-4.4.1_project-Test-MainWindow-debug-running.png|400px1200px|border|center]]