COMFILE Technology's Documentation Library

This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.
====== Creating a New Qt Project with Qt Creator ======

This demonstration will illustrate how to create a new project from scratch for the ComfilePi.  In this demonstration Qt Quick will be used over Qt Widgets.  Qt Quick is a better choice for more modern GUIs.

===== Using the "New Project" Wizard =====

  - Select //File-->New File or Project...// from the menu.\\ {{ :comfilepi:create_a_new_project:new_project_1.png?nolink |}} \\ 
  - The following Window will appear.  //Select Application-->Qt Quick Application// and verify the //Supported Platforms// reads //Generic Linux Device//.  Then press the //Choose...// button.\\ {{ :comfilepi:create_a_new_project:new_project_2.png?nolink& |}} \\ 
  - Specify the name an location of the project. \\ {{ :comfilepi:create_a_new_project:new_project_3.png?nolink |}} \\ 
  - For the //Minimal required Qt version// option, just keep the default at //Qt5.7//.  For unknown reasons, selecting //Qt5.8// will not locate the ComfilePi Kit, so use //Qt5.7// for now, and deselect the //With ui.qml file// option. \\ {{ :comfilepi:create_a_new_project:new_project_4.png?nolink |}} \\ 
  - Select the //ComfilePi// kit. \\ {{ :comfilepi:create_a_new_project:new_project_5.png?nolink |}} \\ 
  - Don't add any version control. \\ {{ :comfilepi:create_a_new_project:new_project_6.png?nolink |}} \\ 
  - And finally, the project will open to the //main.qml// file \\ {{ :comfilepi:create_a_new_project:new_project_7.png?nolink |}} \\ Ignore the //Project ERROR// message about not being able to find //arm-linux-gnueabihf-g++//. It is benign.

===== Editing the Project =====

  - Select the //Design// icon on the left toolbar
  - Delete all of the //Window//'s child nodes
  - Change with dimensions of the Window to 800x480
  - Change the background color to all black (#000000)
  - Save \\ \\ {{ :comfilepi:create_a_new_project:edit_project_1.png?direct |}}\\ 
  - Add Additional imports to have add more UI features \\ \\ {{ :comfilepi:create_a_new_project:edit_project_2.png?nolink |}} \\ 
  - Drag and drop UI widgets to the design surface

{{ :comfilepi:create_a_new_project:edit_project_3.mp4?885x466 |}}

===== Deploy to the ComfilePi and Debug =====

Open the project file, //QtQuickDemo.pro//, and edit the ''target.path'' as shown below to change the deploy location to the user's home directory.

<code>
# Default rules for deployment.
target.path = $${TARGET}/bin
INSTALLS += target
</code>

{{ :comfilepi:create_a_new_project:edit_project_4.png |}}

Then select the debug icon from the left toobar to deploy the project, execute it, and begin a debugging session.

{{ :comfilepi:create_a_new_project:edit_project_5.png |}}

===== Additional Information =====
To learn more about Qt Quick development, see [[http://doc.qt.io/qt-5/qtquick-index.html|Qt's official documentation]].