Create Qt Quick UI Prototypes | Qt Creator Documentation

- Qt Creator Documentation
- Create Qt Quick UI Prototypes
- Qt Creator 19.0.1

Create Qt Quick Applications ◦ Design 2D UIs

# Create Qt Quick UI Prototypes

Qt Quick UI Prototype projects are useful for testing or prototyping user interfaces, or for setting up a separate project just for QML editing, for example. You cannot use them for application development because they do not have:

- C++ code
- Resource files (`.qrc`)
- Code needed for deploying applications to devices

For more information about how to turn Qt Quick UI Prototype projects into Qt Quick Application projects, see Convert UI projects to applications.

To create a Qt Quick UI Prototype project:

1. Go to File > New Project > Other Project > Qt Quick UI Prototype.
2. Select Choose to open the Project Location dialog.
3. In Name, enter a name for the application.
4. In Create in, enter the path for the project files. Select Use as default project location to create new projects in this folder by default.
5. Select Next (or Continue on macOS) to open the Define Project Details dialog.
6. Select Create a project that you can open in Qt Quick Designer to make the project compatible with Qt Quick Designer.
7. Select Use Qt Virtual Keyboard to add support for Qt Virtual Keyboard to the application.

   Note: If you have not installed the Qt Virtual Keyboard module when you installed Qt, an error message will appear when you try to open `main.qml`.

8. Select Next to open the Kit Selection dialog.
9. Select kits for the platforms that you want to build the application for.

   Note: Kits are listed if they have been specified in Preferences > Kits.

10. Select Next to open the Project Management dialog.
11. Review the project settings, and select Finish (on Windows and Linux) or Done (on macOS) to create the project.

Qt Creator creates the following files:

- `.qmlproject` project file defines that all QML, JavaScript, and image files in the project folder belong to the project. Therefore, you do not need to individually list all the files in the project.
- `.qml` file defines a UI item, such as a component or the whole application UI.
- `Screen01.ui.qml` file defines a custom QML type using instances of a Rectangle type that forms the background, a Button, and a Text component that displays some text. This file is created if you select Create a project that you can open in Qt Quick Designer.

To use JavaScript and image files in the application, copy them to the project folder.

See also Creating projects, How to: Design Qt Quick UIs, How to: Manage kits, Designing Qt Quick UIs, Qt Quick UI design, and Specify Qt Quick UI Prototype run settings.

Create Qt Quick Applications ◦ Design 2D UIs