Qt Quick Examples and Tutorials | Qt Quick 5.12.8

- Qt 5.12
- Qt Quick
- Qt Quick Examples and Tutorials
- Qt 5.12.8 Reference Documentation

# Qt Quick Examples and Tutorials

This page lists the Qt QML and Qt Quick examples, however, many other Qt modules contain examples related to their QML API.

## Running the Examples and Demos

The examples are packaged with the Qt installers and are accessed through Qt Creator. For more information about running examples in Qt Creator, visit the Building and Running an Example page.

Open and run examples within Qt Creator's Welcome mode. Most of the examples run on various platforms and to search for platform-specific examples, type the platform name (or any keywords) in the search field. For example, typing `mobile` in the search field lists the examples that are fully compatible with the mobile platforms.

To view other examples and tutorials, visit the Qt Examples And Tutorials page.

## Qt Quick Demos

Here is a list of fully-functional demo applications. They are full applications that show how a deployable Qt application is built and structured. Many of the demos are deployable to mobile and desktop platforms.

Qt Quick Demo - Calqlatr | A QML app designed for portrait devices that uses custom components, animated with AnimationController, and JavaScript for the application logic
Qt Quick Demo - Clocks | A QML clock application that demonstrates using a ListView type to display data generated by a ListModel and a SpringAnimation type to animate images
Qt Quick Demo - Maroon in Trouble | A Qt Quick game for touch devices that uses SpriteSequence, ParticleSystem, Emitter, and Wander types to animate objects and the SoundEffect type to play sound effects
Qt Quick Demo - Photo Surface | A QML app for touch devices that uses a Repeater with a FolderListModel to access content in a folder, and a PinchArea that contains a MouseArea to handle pinch gestures on the fetched content
Qt Quick Demo - Photo Viewer | A QML photo viewer that that uses XmlListModel and XmlRole to download Flickr feeds, and Package to display the photos in different views
Qt Quick Demo - RSS News | A QML RSS news reader that uses XmlListModel and XmlRole to download XML data, ListModel and ListElement to create a category list, and ListView to display the data
Qt Quick Demo - Same Game | A QML implementation of the popular puzzle game by Kuniaki Moribe
Qt Quick Demo - StocQt | A configurable stock chart for the NASDAQ-100
Qt Quick Demo - Tweet Search | A Twitter search client with 3D effects

## Developing Qt Quick Applications

The following pages show how to develop Qt applications using Qt Creator and Qt Quick. The pages demonstrate various steps such as use cases and introductory material. For more information about Qt Quick Applications and related modules, visit the QML Applications page.

Development Environment

- Creating Qt Quick Projects
- Creating Components
- Exporting Designs from Graphics Software
- Using QML Modules with Plugins

Beginning with QML and Qt Quick

- First Steps with QML
- Qt Quick Text Editor
- SameGame

Use Cases

- Visual types in QML
- Responding to User Input in QML
- Animations in QML
- Displaying Text in QML
- Layouts in QML
- Style and Theme Support
- Integrating JavaScript in QML

### Extending QML

The following tutorials show how a QML-based application can be combined with C++ code using the Qt QML module. For information about extending QML, visit the Integrating QML and C++ page.

Extending QML - Adding Types Example | Exporting C++ Classes
Extending QML - Attached Properties Example | Attached Properties
Extending QML - Binding Example | Binding
Extending QML - Default Property Example | Default Property
Extending QML - Extension Objects Example | Extension Objects
Extending QML - Grouped Properties Example | Grouped Properties
Extending QML - Inheritance and Coercion Example | C++ Inheritance and Coercion
Extending QML - Methods Example | Methods Support
Extending QML - Object and List Property Types Example | Exporting C++ Properties
Extending QML - Property Value Source Example | Property Value Source
Extending QML - Signal Support Example | Signal Support

## Examples

Examples are small applications which show how to implement various Qt Quick features. The examples run on various platforms and are opened from within Qt Creator.

QML Types and Controls

- Controls Gallery
- Dialog Examples
- Calendar Example
- TableView
- Text and Fonts
- Custom Toggle Switch

Layouts and Views

- Qt Quick Layouts - Basic Example
- Positioners
- Views
- Windows and Screen
- Right-to-Left and Text Layout

Image and Graphics

- Image Elements
- Animation
- Canvas API
- Shader Effects

Keyboard, Focus, and Touch

- Key Interaction
- MouseArea

System and Events

- Threading
- Accessibility
- External Drag and Drop
- Drag and Drop

Scene Graph

- OpenGL Under QML
- Painted Item
- Custom Geometry
- Graph
- Simple Material
- Rendering FBOs
- Rendering FBOs in a thread