HelloQML

Let start our first QML application HelloQML:

- In Qt Creator, start a new project; click File -> New File or Project.

- Select Qt Quick Project - Qt QML Application, then click OK.


- Enter the name and location of you project.


- It's time to review your project setting, then click Finish.


- Double click on the generated .qml file to involve Qt Quick Design.
(In order to use the Qt Quick Design, you have to enable it; refer to the article Qt Quick Designer.)


- In Qt Quick Design, drag a Text and TextEdit to the panel.
Click to select Text(text1), chang the Text Property to "Who are you?"
Click to select TextEdit(textedit1), clear the Text Properties, and enable Cursor Visible under Text Input property.


- Then click on the Edit button on the left to involve the Editor.
Modify the code of text inside Text to
text: "Hello " + textedit1.text

import Qt 4.6

Rectangle {
  width: 200
  height: 200
  Text {
      x: 66
      y: 127
      text: "Hello " + textedit1.text
  }

  Text {
      id: text1
      x: 66
      y: 61
      width: 80
      height: 20
      text: "Who are you?"
  }

  TextEdit {
      id: textedit1
      x: 66
      y: 83
      width: 80
      height: 20
      text: ""
      cursorVisible: true
  }
}

- Click on the green arrow (Run) on the left to see the result.


- It's the first QML application, HelloQML.