Getting Started - QML Apps

From WebOS-Ports
Jump to: navigation, search

Setting up a development environment

We have various apps and components written in QML. By using stub data you'll be able to use most of them on a desktop for agile development :)

What you will need:

Dependencies

Qt and Qt Creator

To run the LuneOS QML apps, you need Qt 5.5 or up and Qt Creator. Qt Creator is included with Qt. We highly recommend using Qt downloaded from the Qt website, which can be downloaded from http://www.qt.io/download-open-source/

Windows

Just download the latest QtCreator.
However, if you want to use system packages instead, here are per-distro instructions:

Ubuntu <16.04 (Xenial Xerus)/Debian < Stretch
You will need to download the version direct from Qt at http://www.qt.io/download-open-source/ The versions included in the system repositories are too old. The default Qt packages it selects should be all you need, and you can install this version of Qt in a directory within your home directory if you don't want to install it system-wide or replace the system packages. You will also need to run:
sudo apt-get install g++ cmake
You will need to change your default Qt version for the Qt Creator build environment, but instructions for that are included further down in these instructions.
Ubuntu >=16.04 (Xenial Xerus)/Debian >= Stretch (tested on Debian, but untested on Ubuntu and may need to be changed a bit)
We strongly recommend you use the Qt version from the Qt website instead of system packages. The system packages may or may not contain all of the components you will need to run all of the apps, such as QtWebEngine for the Browser app, which is not included on Debian. However, if you want to try it, you can install most of the dependencies with this:
sudo apt-get install qtcreator qtdeclarative5-dev cmake gcc g++ qmlscene qml-module-qtqml-models2 qt5-default qtdeclarative5-private-dev qtbase5-private-dev qml-module-qtmultimedia qml-module-qtgraphicaleffects # Due to the way Qt is packaged, we also need to install some dependencies.
Fedora (this one is also untested and may be too old)
yum install qt-creator
Gentoo (untested)
Unmask a version of Qt >= 5.5 (needed at the time of writing), then run:
emerge dev-qt/qt-creator

luna-next-cardshell

This acts as both the system shell and a library of components, so you will need it to run the LuneOS QML apps.

git clone https://github.com/webOS-ports/luna-next-cardshell.git

luneos-components

This is our shared library of components used across various QML apps. It is another dependency you will need.

git clone https://github.com/webOS-ports/luneos-components.git

Configure your build environment

  1. Open the luneos-components.pro file in Qt Creator. You could choose another project, but this one gives us a consistent starting point for directions.
  2. Under Projects (on the left side), go to the Build tab (should be the default) and change the following settings:
    1. Deactivate Shadow Build.
    2. For the qmake build steps, click on Details to expand the edit area.
    3. Set Additional Arguments to:
      CONFIG+=desktop
  3. Now, under the Run tab at the top:
    1. Set Executable to
      qmlscene
    2. Set Additional Arguments to
      -l modules -l test/imports examples/gallery/main.qml
    3. Under Run Environment, click Details to expand the settings.
    4. Add a setting called
      QT_QUICK_CONTROLS_STYLE
      and give it a value of
      LuneOS
  4. To make sure that you're using Qt 5.5 (in case you have multiple versions installed):
    1. Go to Tools->Options and under the Build & Run section, go to the Kits tab and find the Desktop (default) kit.
    2. Click on the Desktop (default) kit and resize the window so you can see the settings below the kit selector area.
    3. Make sure your Qt version setting is set to one of the Qt 5.5 options. If you do not have a Qt 5.5 option, you may not have Qt installed correctly. If you have more than one, try and use one of the (System) ones instead of the (qt5) one. If you run into compilation problems, try a different one.

Apps

luna-next-cardshell

This is the main launcher for LuneOS.

  1. Open luna-next-cardshell/qml/luna-next-qml.qmlproject in Qt Creator.
  2. Click the top green Play button near the bottom left corner of the Qt Creator window.

FirstUse

  1. Within the same directory you cloned the other git repos into, run this command to download the FirstUse app:
    git clone https://github.com/webOS-ports/org.webosports.app.firstuse.git
  2. Open org.webosports.app.firstuse/firstuse.qmlproject in Qt Creator.
  3. Click the top green Play button near the bottom left corner of the Qt Creator window.

Browser

  1. If you are a distro which does not have QtWebEngine available (such as Debian, which has chosen not to distribute QtWebEngine at the time of writing), you will not be able to run the Browser app on the desktop using system Qt packages. Before continuing, please ensure that you have QtWebEngine installed.
  2. Within the same directory you cloned the other git repos into, run this command to download the Browser app:
    git clone https://github.com/webOS-ports/org.webosports.app.browser.git
  3. Open org.webosports.app.browser/browser.qmlproject in Qt Creator.
  4. Click the top green Play button near the bottom left corner of the Qt Creator window. (Not fully tested.)

Phone

  1. Within the same directory you cloned the other git repos into, run this command to download the Phone app:
    git clone https://github.com/webOS-ports/org.webosports.app.phone.git
  2. Within the same directory you cloned the other git repos into, run this command to download the loadable-frameworks needed by the Phone app:
    git clone https://github.com/webOS-ports/loadable-frameworks.git
  3. Open org.webosports.app.phone/phoneapp.qmlproject in Qt Creator.
  4. Click the top green Play button near the bottom left corner of the Qt Creator window.

webos-keyboard

If you want to run the keyboard standalone, you will need the Maliit framework installed. This should be available as a package on Ubuntu (should be called maliit-framework). maliit-framework should also be available on Fedora. At the time of writing, this does not appear to be available on Debian outside of the experimental branch. However, these instructions are for running the keyboard test app which you can run without Maliit.

  1. Within the same directory you cloned the other git repos into, run this command to download the Keyboard app:
    git clone https://github.com/webOS-ports/webos-keyboard.git
  2. Open Project webos-keyboard/tests/keyboard-test/keyboard-test.qmlproject in Qt Creator.
  3. Click the top green Play button near the bottom left corner of the Qt Creator window.
  4. Generic layouts and keys can be found in webos-keyboard/qml/ Each type of keyboard layout (numeric, symbols, telephone) has a separate QML file. The same applies for different kind of keys.
  5. Language specific files can be found at webos-keyboard/plugins/