====== 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. # Default rules for deployment. target.path = $${TARGET}/bin INSTALLS += target {{ :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]].