qmlcore

PureQML :: QMLCORE: QML zum JavaScript -Übersetzer

QMLCORE ist eine einfache Reihe von Tools, die wir (ein kleines Team von QML -Befürwortern) seit Jahren verwenden, um die Entwicklung der HTML5 -UIS für mobile und Desktop -Geräte zu vereinfachen. Es wurde mit berücksichtigter originaler QML entworfen, während es nicht zu 100% kompatibel ist und in einigen Aspekten verbessert wurde. Die Hauptkonzepte sind jedoch gleich. Wenn Sie also mit dem ursprünglichen QML vertraut sind, können Sie sofort beginnen.

Verwendung

QMLCORE bietet eine Toolchain, die in Python mit Python-Future geschrieben wurde und es ermöglicht, über beide Python-Versionen zu laufen. Normalerweise müssen Sie sie nicht direkt verwenden. build bietet eine bequeme Wrapper um sie alle.

Voraussetzungen

Jeder moderne Python (2 oder 3) wird gut laufen. Jinja2 ist eine andere Option für die Vorlagen, falls Sie mehr als QML -Loader in Ihrer HTML -Datei wünschen, während sie für kleine Apps nicht erforderlich ist.

So installieren Sie die Anforderungen ausgeführt:

$ pip install - r requirements . txt 

Einfache Anleitungen

• Projektverzeichnis erstellen, cd <project-dir>
• Clone QMLCORE an IT: git clone [email protected]:pureqml/qmlcore.git
• Run ./qmlcore/build -boilerplate
• Schauen Sie sich ./src/app.qml
• Ausführen ./qmlcore/build Bitte finden Sie die resultierenden Dateien in Build.web/*

Wie es funktioniert

Der QML -Compiler scannt Quellenverzeichnisse für QML -Dateien und analysiert jeweils. Dateiname beginnend mit in Großbuchstaben betrachteter Komponente, die so instanziiert ist. Projektweite Optionen werden in der .manifest Datei gespeichert. Das Ergebnis der Kompilierung ist eine einzige JavaScript -Datei mit minimalen Abhängigkeiten (nur Modernizr), die in der mobilen und in der Desktop -Umgebung verwendet und von Probe .html Launcher begleitet wird.

Offensichtliche Optionen

Manifest ist eine Sammlung projektweiter Hacks, die wir verwendet haben, um verschiedene Projekte zu verpfuschen. Einige von ihnen können nützlich sein oder nicht.

• templater - Template Engine zu verwenden, werden im Moment nur "einfache" und "Jinja2" unterstützt
• web-prefix -Siehe Option -P unten, Geben Sie das CSS -Regeln an, das Präfix ist
• minify - False/True oder Compiler -Name als Zeichenfolge, nur 'GCC' und 'Uglify -Js' werden unterstützt. Der Compiler von Google Closure verlangt von Java.
• platforms verwenden zusätzliche Plattform/*/ Dateien, Standard und einzige Plattform sind für den Moment 'Web'
• path - Zusätzliche Verzeichnisse zur Suche nach Quellen für

Befehlszeilenoptionen für Tools erstellen

• -m, --minify Minify mit Standardoption ('Uglify-JS')
• -k, --keep Heep Original Quelle nach der Minifikation, nützlich für die Debugie von Minifikationswarnungen
• -d, --devel -Entwicklungsmodus, laufen Sie weiter und warten Sie auf Änderungen, erfordert das inotifizierte Modul
• -p, --web-prefix Web-Präfix, die Standard-CSS-Regeln entfernt, addiert 'QML-' Präfix für sie, sodass Sie HTML/QML austauschen können.
• -u, --update-translation Aktualisierung Übersetzungsdateien, angegeben in Manifest.languages
• -j, --jobs fassen parallel und parallel
• --boilerplate Initialisierte das minimale Mindestanschluss für einen schnelleren Anpfiff im aktuellen Verzeichnis.

Unterstützte Plattformen

Wir unterstützen viele verschiedene Plattformen und Videointegrationsvarianten.

Die meisten bemerkenswerten Plattformen sind:

• HTML5 -Webbrowser (offensichtlich) mit verschiedenen Addons:
  • Shaka
  • Dash.js
  • Video.js Web -Erweiterung
• Elektronen
• Android (einheimischer Motor und Cordova)
• IOS (Cordova)
• SmartTV Platorms:
  • Jeder Android -Fernseher über native Android -Unterstützung.
  • LG (Netcast und Webos)
  • Samsung SmartTV (Orsay und Tizen)
  • Operatv
• Viele STB -Plattformen (privat)
• Native C ++ -Motor mit minimalen Anforderungen (EGL oder Linuxfb) (privat)

Die vollständige Liste der unterstützten Plattform finden Sie hier und hier. Oder fragen Sie uns alternativ einfach.

Native Android Support

Hauptrepo für die native Android-Implementierung von PureQML ist https://github.com/pureqml/qmlcore-android.

Um eine native Android -App zu erstellen, müssen Sie:

• Installieren Sie Android SDK und setzen Sie die Umgebungsvariable ANDROID_HOME
• Run ./qmlcore/platform/pure.femto/build-android-native.sh Skript.

Lokalisierung

QMLCORE verwendet QT-Ansatz zur Lokalisierung. Sie schreiben den Code in Ihre Standardsprache, generieren/aktualisieren (Build -U) .ts Übersetzungsdateien, übersetzen sie mit QT -Linguist und kompilieren Sie Ihr Projekt. QMLCORE erkennt TR, Qstr, Qstranslate -Funktion sowie qt_tr_noop/qt_translate_noop macros.

Kontrolliert Bibliothek

QMLCORE enthält ein minimales Minimum an Plattformsteuerungen: Bilder, Texte, Rechtecke und Modell-View-Delegate-Klassen. Verschiedene Kontrollen, die nützlich sein könnten, befinden sich in einem separaten Repository. Klonen Sie es einfach über git clone [email protected]:pureqml/controls.git in Ihrem Projekt und das war's!

QML -Unterschiede

Grammatik

Wir benötigen nach jeder Erklärung ein Semikolon. Dies kann in Zukunft verändert werden.

Fokus

Die größte Diskrepanz bei der ursprünglichen QML ist, wie der Fokus implementiert wird. Wir wollen überall einen "immer konsistenten" Fokus haben. Sie müssen jede fokusfähige Komponente mit focus: true; Eigentum und der Rest sollte ohne Änderung funktionieren. Wir bieten mehrere bequeme Eigenschaften, um den Fokus mit Leichtigkeit zu bewältigen:

• ActiveFocus - Dieses Element hat den aktuellen Fokus und hat zuerst alle Benutzereingaben erhalten
• Fokussiert - Dieser Artikel hat den aktuellen Schwerpunkt bei seinem Elternteil, aber nicht unbedingt weltweit konzentriert

Zufällige Anpassungshinweise

Hinzufügen von Modernizr -Funktionen

Bitte verwenden Sie den folgenden Befehl, um die benutzerdefinierte Modernizr -Build -Seite zu erhalten: head -n2 dist/modernizr-custom.js | tail -n1 oder nur die zweite Zeile von Modernizr -custom.js -Datei

Danke

Modernizr -Projekt

Modernizr erzählt Ihnen, was HTML, CSS und JavaScript den Browser des Benutzers zu bieten haben. https://modernizr.com/

SDL Game Controller -Datenbank

Eine Community -Sourced -Datenbank mit Spielcontroller -Mappings https://github.com/gabomdq/sdl_gamecontrollerdbbbb

Apache Cordova -Projekt

Apache Cordova ist ein Open-Source-Rahmen für mobile Entwicklung. Sie können Standard -Web -Technologien verwenden - HTML5, CSS3 und JavaScript für die plattformübergreifende Entwicklung. https://cordova.apache.org