Adding the main QML file

Next, you can add a QML file to define the UI for the application.

To define the main QML file for your HMI:
  1. Click the Edit icon on the left side, right-click the QtHmi folder in the Projects view, then choose Add New... in the popup menu.
  2. In the New File dialog, select Qt in the Files and Classes list, then QML File (Qt Quick 2) in the list of file types (shown in the middle), then click Choose...
  3. In the Location page of the New QML file dialog, name the file main, then click Next.
  4. In the Summary page, click Finish.

    Qt Creator adds main.qml to the project and opens this file in the editing area.

  5. Replace the contents of this file with the following:
    import QtQuick 2.0
    Rectangle {
        color: "black"
        Text {
            color: "white"
            text: qsTr("Awesome HMI goes here")
            anchors.centerIn: parent
  6. After saving the QML file, edit the file to add the following lines:
    # The Qt modules needed for this project
    QT += quick
    This informs Qt Creator that the project uses the quick module, which is needed to build QML-based UIs.