Getting involved with Plasma Mobile application environment is a perfect opportunity to familiarize with a set of important technologies:

Kirigami, a set of QtQuick components, facilitating the easy creation of applications that look and feel great on mobile as well as on desktop devices, following the KDE Human Interface Guidelines.

CMake, the cross-platform set of tools designed to build, test and package software, using a compiler-independent method.

Qt Quick, the standard library of types and functionality for QML. It includes, among many others, visual types, interactive types, animations, models and views. A QML application developer can get access this functionality with a single import statement.

QML, the UI specification and programming language that allows designers and developers to create applications with fluid transitions and effects, which are quite popular in mobile devices. QML is a declarative language offering a highly readable, declarative, JSON-like syntax with support for imperative JavaScript expressions.

Qt, the cross-platform application framework for creating applications that run on various software and hardware platforms with little or no change in the underlying codebase

In this section you will find a set of technical resources that will accompany you during your journey as a Plasma Mobile developer. If you are just starting out with Qt, QML and CMake, you will find here enough detail so as to feel comfortable with the technologies related to Plasma Mobile development. If you are an experienced Qt developer, you can find here valuable resources so as to comply with best practices.

Edit the files to fit your naming and needs. In each command, replace “io.you.newapp” and “newapp” with the id and name you want to use.

Your new application should now appear on the homescreen.

Now your app is exported into app.flatpak. You can copy the file to the phone using scp:

Make sure your system supports qemu user emulation. If not, you can find help for example here.

If you can see this image:

You can now run your application in the SDK environment. Later hellokirigami needs to be replaced with the name you chose for your application.

The app template uses the cmake build system, which we can use to generate the necessary files needed to build the application. This step works almost like building without the KDE flatpak SDK, except for the addition of flatpak build ${FLATPAK_BUILD_DIRECTORY} .

Now that dependencies are installed, you can build your app using the KDE SDK. KDE applications typically require an out-of-source build, so let’s create a build dependency first.

The following command installs the required dependencies into the flatpak-build-desktop directory. It needs to be run each time you change dependencies in your json manifest.

This repository can be used as a template to develop Plasma Mobile applications. It already includes templates for the qml ui, a c++ part, app metadata and flatpak packaging.

Before starting, please ensure that your system is already set up as described here .

If you prefer to set up the environment yourself instead of using the SDK, see the KDE Community wiki .

To install flatpak on your workstation, follow the official instructions provided here .

We will use the KDE flatpak SDK to develop and package the app, so all that is required is a working flatpak and flatpak-builder installation.

You can now submit the patch on Phabricator . Once accepted, your app will be automatically built, published and made available in Discover (if the KDE flatpak repository is enabled on the device).

After setting up git with the recommended KDE settings , you can create a new file io.you.newapp.remoteapp in the flatpak-kde-applications repository.

Once your application is working and is usable, you can submit a patch to include it into the KDE flatpak repository.

Create a Kirigami application¶

In this tutorial we will use some of the technologies already presented in the application development section. Before starting, you should follow the instructions in that page since the hellokirigami prototype will be used as a skeleton for our development.

Rename the prototype¶ At first, we will change the name used in the plasma-mobile-app-template from hellokirigami to kirigami-tutorial: sed -i 's/org.kde.hellokirigami/org.kde.kirigami-tutorial/g;s/[Hh]ello[Kk]irigami/kirigami-tutorial/g' $( find . -name "CMakeLists.txt" -or -name "*.desktop" -or -name "*.xml" -or -name "*.json" -or -name *.cpp ) for file in $( find . -name "org.kde.hellokirigami*" ) ; do mv $file $( echo $file | sed 's/org.kde.hellokirigami/org.kde.kirigami-tutorial/g' ) ; done

Objective¶ Our goal is to create a simple prototype of an address book. We need to display a grid of cards that will show the contacts of our phone. Each card should display the name of the contact, her/his mobile phone and the email address.

Kirigami Gallery¶ Now that the requirements of our project have been defined we need to find out the technologies that will help us to create the prototype. In this task Kirigami Gallery will be our friend. Kirigami Gallery is an application which uses the features of Kirigami, provides links to the source code, tips on how to use the components as well as links to the corresponding HIG pages. Tip Before continuing please install Kirigami Gallery. It should already be in the repository of your GNU Linux distribution.

Find a card grid¶ Navigating through the Kirigami Gallery application, we will stumble upon the “Grid view of cards” gallery component. This is a good candidate that serves our purpose; to display a grid of contact cards. After selecting the “Grid view of cards” gallery component, we will click to the bottom action and we will get some useful information about the Card and Abstract Card types. In this information dialog we will also find a link to the source code of the Cards Grid View. Let’s navigate to this page.