JavaScript powered QML Engine
This project aims at bringing the power of QML to the web browser. Here's a sample of how QML looks like:
import QtQuick 2.0 Rectangle { width: 500; height: 200 color: "lightgray" Text { id: helloText text: "Hello world!" anchors.verticalCenter: parent.verticalCenter anchors.horizontalCenter: parent.horizontalCenter font.pointSize: 24; font.bold: true }}
How to use
Add the library to your web page
Using one of the methods below, install the qmlweb JavaScript library:
- npm —
npm install qmlweb
- Bower —
bower install qmlweb
- GitHub releases —
tar -xaf v0.2.0.tar.gz
- Manually (recommended if you cloned from git) —
npm install && npm run build
Next, simply add lib/qt.js
to the list of other JavaScript files in your app's
HTML file:
<script type="text/javascript" src="/lib/qt.js"></script>
Auto-load
You may then modify the <body>
element to specify what QML file to load when
the page is opened.
QML Auto-load Example
How to use with Gulp
See gulp-qmlweb package.
How to extend
See Extending.