Difference between revisions of "Getting Started With Qt Creator"

From wiki.emacinc.com
Jump to: navigation, search
Line 26: Line 26:
 
{{:Templateimpl:geninfo | initials=BS | title=Getting Started with Qt Creator | desc=The following page can be used to get familiarized with EMAC Qt Creator. | project=OE 5.0 }}
 
{{:Templateimpl:geninfo | initials=BS | title=Getting Started with Qt Creator | desc=The following page can be used to get familiarized with EMAC Qt Creator. | project=OE 5.0 }}
 
=== Tools Required ===
 
=== Tools Required ===
 +
These tools should already be installed if you installed the EMAC SDK using the automatic installer.
 
* [[Getting_Started_with_the_EMAC_OE_SDK | EMAC OE 5.X SDK]]
 
* [[Getting_Started_with_the_EMAC_OE_SDK | EMAC OE 5.X SDK]]
 
* EMAC Qt Creator
 
* EMAC Qt Creator
Line 38: Line 39:
 
{{:Templateimpl:using | initials=BS | title=Getting Started with Qt Creator | desc=The following page can be used to get familiarized with EMAC Qt Creator. | project=OE 5.0 }}
 
{{:Templateimpl:using | initials=BS | title=Getting Started with Qt Creator | desc=The following page can be used to get familiarized with EMAC Qt Creator. | project=OE 5.0 }}
  
After installing the EMAC SDK, launch Qt Creator using the EMAC Qt Creator desktop icon.
+
1. Launch Qt Creator using one of the following methods:
 +
* Click the Qt Creator icon on the the desktop
 +
* In the terminal, execute the following commands:
 +
{{cli | username=developer | hostname=ldc | cd ~/EMAC-SDK/emac-QtCreator/bin }}
 +
{{cli | username=developer | hostname=ldc | pwd=~/EMAC-SDK/emac-QtCreator/bin | ./qtcreator.sh }}
  
1. Press the Start key or Alt + F2 and search for Qt Creator EMAC
 
  
2. Put the Qt Creator EMAC icon on the Launcher for easy access.
+
2. To generate a new project from Qt Creator, select '''New Project''' on the opening splash window. The examples being used are all written in the <code>C programming</code> language.
  
[[File:EMAC_Qt_Creator_Icon.png|600px|left|thumb|Figure 1: Qt Creator Launcher Icon]]
+
[[File:QtCreatorGUInew.png|600px|left|thumb|Figure 1: Qt Creator GUI]]
 
<br clear=all>
 
<br clear=all>
  
3. To generate a new project from Qt Creator, select '''New Project''' on the opening splash window. The examples being used are all written in the <code>C programming</code> language.
+
3. After selecting '''New Project''' a new window will pop up. To run a <code>C programming</code> example using EMAC hardware, select '''EMAC Project''' under the Projects tab. Then select '''EMAC C Project (CMake Build)'''. Click the '''Choose''' button on the bottom right of the window to continue to the next page as shown in Figure 3.
  
[[File:Qtcreator_gui.png|600px|left|thumb|Figure 2: Qt Creator GUI]]
+
[[File:EMAC_C_Project.png|600px|left|thumb|Figure 2: Qt Creator EMAC Project]]
 
<br clear=all>
 
<br clear=all>
  
4. After selecting '''New Project''' a new window will pop up. To run a <code>C programming</code> example using EMAC hardware, select '''EMAC Project''' under the Projects tab. Then select '''EMAC C Project (CMake Build)'''. Click the '''Choose''' button on the bottom right of the window to continue to the next page as shown in Figure 3.
+
4. The next page will be '''Introduction and Project Location'''. Select a name for the <code> C </code> project. Once the project name is given, choose a directory to store the project. Note: It is highly recommended to store your project somewhere other than the default location. For this example, we used <code>/home/developer/Projects</code>.
  
[[File:EMAC_C_Project.png|600px|left|thumb|Figure 3: Qt Creator EMAC Project]]
+
[[File:Project_location1.png|600px|left|thumb|Figure 3: Qt Creator Project Location]]
 
<br clear=all>
 
<br clear=all>
  
5. The next page will be '''Introduction and Project Location'''. Select a name for the <code> C </code> project. Once the project name is given, choose a directory to store the project. Note: It is highly recommended to store your project somewhere other than the default location. For this example, we used <code>/home/developer/Projects</code>.
+
5. The next page summarizes the '''EMAC C Project'''. Click '''Finish''' to continue.
  
[[File:Project_location1.png|600px|left|thumb|Figure 4: Qt Creator Project Location]]
+
[[File:Project_summary1.png|600px|left|thumb|Figure 4: Qt Creator Project Summary]]
 
<br clear=all>
 
<br clear=all>
  
6. The next page summarizes the '''EMAC C Project'''. Click '''Finish''' to continue.
+
6. The next step is to set up the device you will be using for the Qt Creator examples. Click Tools -> Options
 
 
[[File:Project_summary1.png|600px|left|thumb|Figure 5: Qt Creator Project Summary]]
 
<br clear=all>
 
 
 
7. Next, it will prompt you to enter the '''CMake Wizard Build Location'''. Click '''Next''' to continue. Note: It is highly recommended to use the default build directory as stated below in Figure 6.
 
 
 
[[File:Build_location.png|600px|left|thumb|Figure 6: Qt Creator Build Location]]
 
<br clear=all>
 
 
 
8. The '''CMake Wizard''' will then prompt you to '''Run CMake'''. For setting up the Desktop Kit, click '''Run CMake'''; the output should be similar to Figure 7 below. Click '''Finish''' to start new project.
 
 
 
[[File:Run_cmake1.png|600px|left|thumb|Figure 7: Qt Creator Run CMake]]
 
<br clear=all>
 
 
 
9. The next step is to set up the device you will be using for the Qt Creator examples. Click Tools -> Options
 
 
{{note|The board used for this example is the iPac-9x25. The iPac-9x25 is a 32-bit ARM architecture. Make sure to connect power, Ethernet, and serial to the board.}}
 
{{note|The board used for this example is the iPac-9x25. The iPac-9x25 is a 32-bit ARM architecture. Make sure to connect power, Ethernet, and serial to the board.}}
  
10. Select '''Devices''' from the left pane.
+
7. Select '''Devices''' from the left pane.
  
[[File:Options_devices.png|600px|left|thumb|Figure 8: Qt Creator Device Option]]  
+
[[File:Options_devices.png|600px|left|thumb|Figure 5: Qt Creator Device Option]]  
 
<br clear=all>
 
<br clear=all>
  
11. Click the '''Add''' button  
+
8. Click the '''Add''' button  
  
12. Select Generic Linux Device, then click '''Start Wizard'''.
+
9. Select Generic Linux Device, then click '''Start Wizard'''.
  
[[File:Generic_linux.png|600px|left|thumb|Figure 9: Qt Creator Wizard Selection]]
+
[[File:Generic_linux.png|600px|left|thumb|Figure 6: Qt Creator Wizard Selection]]
 
<br clear=all>
 
<br clear=all>
  
13. Type in a name, the IP address, the user name, and the password for the device. Use the credentials below to sign in.
+
10. Type in a name, the IP address, the user name, and the password for the device. Use the credentials below to sign in.
  
 
{| class="wikitable"
 
{| class="wikitable"
Line 102: Line 91:
 
|}
 
|}
  
[[File:Device_connection.png|600px|left|thumb|Figure 10: Qt Creator Configuration Setup]]
+
[[File:Device_connection.png|600px|left|thumb|Figure 7: Qt Creator Configuration Setup]]
 
<br clear=all>
 
<br clear=all>
  
14. Click '''Next'''.
+
11. Click '''Next'''.
  
15. Click '''Finish'''.
+
12. Click '''Finish'''.
  
16. A connection will be established with the target device.
+
13. A connection will be established with the target device.
  
[[File:Device_test.png|600px|left|thumb|Figure 11: Qt Creator Device Test]]
+
[[File:Device_test.png|600px|left|thumb|Figure 8: Qt Creator Device Test]]
 
<br clear=all>
 
<br clear=all>
  
17. Click '''Close'''.
+
14. Click '''Close'''.
 
 
18. Click '''Apply'''.
 
  
19. Navigate to '''Add Kit''' in the '''Projects''' tab. Under '''Add Kit''', select the architecture for the board being used. Click '''EMAC OE 5.X arm'''.
+
15. Click '''Apply'''.
  
 +
16. Navigate to the '''Projects''' tab. Here, Qt Creator will ask you to select which kits you will be using with the project. For this example,  we made sure the '''arm''' kit was selected. Then click '''Configure Project'''.
  
[[File:Add_kit_arm.jpg|600px|left|thumb|Figure 12: Qt Creator Add Kit]]
+
[[File:Configproject.png|600px|left|thumb|Figure 9: Configureing Qt Project]]
 
<br clear=all>
 
<br clear=all>
  
20. As previously stated in step 7, it will prompt you to enter the '''CMake Wizard Build Location'''. Click '''Next''' to continue. Note: It is highly recommended to use the default build directory as stated below in Figure 13.
+
17. Now, on the left side of Qt Creator, you will see the project icon, which looks like a monitor. Click this and make sure '''Arm''' is selected under '''Kit''', '''Default''' is selected under '''Build''', and the project is set to be run on the remote device under '''Run'''.
  
[[File:Add_arm.png|600px|left|thumb|Figure 13: Qt Creator Add Kit Build Location]]
+
[[File:Kitselection.png|600px|left|thumb|Figure 10: Selecting Qt Kit]]
 
<br clear=all>
 
<br clear=all>
  
21. The '''CMake Wizard''' will then prompt you to '''Run CMake'''. For setting up the iPac-9x25 ARM kit, click the box next to '''Arguments'''. Copy and paste the string below: 
+
18. Now, simply press the green play button. The program should run on the target device and yield an output.
''-DARCH:STRING=arm''
 
{{note|By default, CMake will build the project using the Debug build configuration. If a Release build is needed, see [[Creating_a_New_EMAC_OE_SDK_Project_with_CMake#Debug_Build_Types | this page.]]}}
 
  
[[File:Arm_argument_string.png|600px|left|thumb|Figure 14: Qt Creator Argument String]]  
+
[[File:Qtoutput.png|900px|left|thumb|Figure 11: Successfully running Qt Project]]
 
<br clear=all>
 
<br clear=all>
  
The EMAC SDK provides another architecture kit for x86 hardware. If using an x86 architecture, copy and paste the argument string below into the '''Arguments''' box. 
 
''-DARCH:STRING=x86'' 
 
 
22. Once the arguments string is pasted into the box, click '''Run CMake''', and the output should be similar to Figure 15 below. Click '''Finish''' to add the kit to the current project.
 
 
[[File:Run_arm_cmake.png|600px|left|thumb|Figure 15: Qt Creator Run CMake]]
 
<br clear=all>
 
 
23. To confirm the kit installed correctly, click on the '''Kit Selector''' tab (Monitor symbol) on the left hand side of the Qt Creator window as shown in Figure 16. Both '''Desktop''' and '''OE 5.X arm''' kit should be present.
 
 
[[File:Arm_kit.jpg|600px|left|thumb|Figure 16: Qt Creator Kits Installed]]
 
<br clear=all>
 
 
24. To run the example project on the target board remotely, you will need to add it to the '''Run Configuration'''. Click on '''Projects'''.
 
 
25. Select '''Run''' under the '''OE 5.X arm''' tab.
 
 
26. To '''Run Configuration''', click on '''Add''' and select your project name (on Remote Generic Linux Host). In this case, our project name is Prime_Numbers (on Remote Generic Linux Host).
 
 
[[File:Run_config.jpg|600px|left|thumb|Figure 17: Qt Creator Run Configuration]]
 
<br clear=all>
 
 
You are now ready to run the examples below using Qt Creator.
 
<!-- /*********************************************************************************************************/ -->
 
<!-- /*****************************************      Examples        *****************************************/ -->
 
<!-- /*********************************************************************************************************/ -->
 
{{:Templateimpl:examples | initials=BS | title=Getting Started with Qt Creator | desc=The following page can be used to get familiarized with EMAC Qt Creator. | project=OE 5.0 }}
 
This section will show how to run <code>C programming</code> examples through the Qt Creator IDE.  The example board will be the iPac-9x25.
 
 
The first example is a basic <i> hello c </i> example project.
 
 
1. After creating a new project and installing the necessary kits for the target board, navigate to the '''Edit''' tab on Qt Creator. Qt Creator will automatically have the <i> hello c </i> example uploaded as shown in Figure 18.
 
 
<syntaxhighlight lang="c">
 
#include <stdio.h>
 
#include <stdlib.h>
 
 
int main(int argc, char * argv[])
 
{
 
    printf("Hello EMAC OE!\n");
 
 
 
    exit(EXIT_SUCCESS);
 
}
 
</syntaxhighlight>
 
 
[[File:Edit_window.png|600px|left|thumb|Figure 18: Qt Creator Edit Window]]
 
<br clear=all>
 
 
2. Before executing the example, you must build the program. Click on the build icon (hammer symbol) on the bottom left of Qt Creator. If the build was successful, a green progress bar will fill on the bottom right of the window.
 
 
3. Once the program successfully builds, you may run the program. Click on the run icon (green arrow symbol) on the left hand side of Qt Creator. The program prints <code> Hello EMAC OE! </code> in the '''Application Output''' terminal.
 
 
[[File:Final_output.png|600px|left|thumb|Figure 19: Qt Creator Edit Window]]
 
<br clear=all>
 
 
The second example will show how to run a ''C programming'' project on a target board. This example will show all prime numbers from 1 through 100 on the Qt Creator remote terminal.
 
 
1. Create a new project and install the necessary kits for the target board as shown before. Call this project <code> Prime_Numbers </code>. Then, navigate to the '''Edit''' tab on Qt Creator. Copy and paste the following code (below) to the Qt Creator terminal:
 
 
<syntaxhighlight lang="c">
 
#include <stdio.h>
 
#include <stdlib.h>
 
 
int main(int argc, char * argv[])
 
{
 
  int i;
 
  int j;
 
 
  for (i = 2; i <= 100; i++)
 
  {
 
    for (j = 2; j <= i; j++)
 
    {
 
      if (i%j==0)
 
      {
 
        break;
 
      }
 
    }
 
    if (i == j)
 
    {
 
      printf ("%d is a prime number. \n", i);
 
    }
 
  }
 
  return 0;
 
}
 
</syntaxhighlight>
 
 
[[File:Prime_Numbers_edit.png|600px|left|thumb|Figure 210: Qt Creator Edit Window]]
 
<br clear=all>
 
 
2. Click on the build icon (hammer symbol) on the bottom left of the Qt Creator window. If the build was successful, a green progress bar will be full on the bottom right of the Qt Creator window.
 
 
3. Click on the run icon (green arrow symbol) on the left hand side of Qt Creator. The program prints all prime numbers from 1 through 100 in the '''Application Output''' terminal.
 
 
[[File:Final_Prime_Numbers.png|600px|left|thumb|Figure 21: Qt Creator Edit Window]]
 
<br clear=all>
 
 
<!-- /*********************************************************************************************************/ -->
 
<!-- /*********************************************************************************************************/ -->
 
<!-- /******************************************    Conclusion      ******************************************/ -->  
 
<!-- /******************************************    Conclusion      ******************************************/ -->  

Revision as of 12:41, 6 June 2017

TODO: {{#todo: Complete (02.03.2015-10:42->BS+);(06.18.2015-14:25->BS+);(06.18.2015-15:48->KY+);(11.16.2015-11:35->MD+);(11.16.2015-12:15->MG+);(11.16.2015-12:20->KY+)|Brian Serrano|OE 5.0,BS,KY,MD,MG,Complete}}

The following page demonstrates the process of getting familiar with EMAC Qt Creator and running it on the target machine.

Background

Qt Creator is a cross-platform Open Source Integrated Development Environment (IDE) that can be used to develop software for many different languages. It includes a visual debugger and an integrated GUI layout and forms designer.

For more information visit the Qt Project site http://qt-project.org/wiki/Category:Tools::QtCreator.

General Information

Tools Required

These tools should already be installed if you installed the EMAC SDK using the automatic installer.

Setup

  1. Make sure the system has the EMAC OE 5.X SDK and tools installed.
  2. Launch EMAC Qt Creator.

Getting Started with Qt Creator

1. Launch Qt Creator using one of the following methods:

  • Click the Qt Creator icon on the the desktop
  • In the terminal, execute the following commands:
developer@ldc:~# cd ~/EMAC-SDK/emac-QtCreator/bin
developer@ldc:~/EMAC-SDK/emac-QtCreator/bin# ./qtcreator.sh


2. To generate a new project from Qt Creator, select New Project on the opening splash window. The examples being used are all written in the C programming language.

File:QtCreatorGUInew.png
Figure 1: Qt Creator GUI


3. After selecting New Project a new window will pop up. To run a C programming example using EMAC hardware, select EMAC Project under the Projects tab. Then select EMAC C Project (CMake Build). Click the Choose button on the bottom right of the window to continue to the next page as shown in Figure 3.

Figure 2: Qt Creator EMAC Project


4. The next page will be Introduction and Project Location. Select a name for the C project. Once the project name is given, choose a directory to store the project. Note: It is highly recommended to store your project somewhere other than the default location. For this example, we used /home/developer/Projects.

Figure 3: Qt Creator Project Location


5. The next page summarizes the EMAC C Project. Click Finish to continue.

Figure 4: Qt Creator Project Summary


6. The next step is to set up the device you will be using for the Qt Creator examples. Click Tools -> Options



NOTE
The board used for this example is the iPac-9x25. The iPac-9x25 is a 32-bit ARM architecture. Make sure to connect power, Ethernet, and serial to the board.


7. Select Devices from the left pane.

Figure 5: Qt Creator Device Option


8. Click the Add button

9. Select Generic Linux Device, then click Start Wizard.

Figure 6: Qt Creator Wizard Selection


10. Type in a name, the IP address, the user name, and the password for the device. Use the credentials below to sign in.

Table 4: Default Login Credentials
Username Password
root emac_inc
Figure 7: Qt Creator Configuration Setup


11. Click Next.

12. Click Finish.

13. A connection will be established with the target device.

Figure 8: Qt Creator Device Test


14. Click Close.

15. Click Apply.

16. Navigate to the Projects tab. Here, Qt Creator will ask you to select which kits you will be using with the project. For this example, we made sure the arm kit was selected. Then click Configure Project.

Figure 9: Configureing Qt Project


17. Now, on the left side of Qt Creator, you will see the project icon, which looks like a monitor. Click this and make sure Arm is selected under Kit, Default is selected under Build, and the project is set to be run on the remote device under Run.

Figure 10: Selecting Qt Kit


18. Now, simply press the green play button. The program should run on the target device and yield an output.

Figure 11: Successfully running Qt Project


Conclusion

This page is a quick getting started tutorial on how to use EMAC Qt Creator for the first time. It shows you how to create an EMAC C Project, how to set up the necessary kits for your target board, how to set up your target board, and how to build and run example projects.


Pages with Related Content