Android. Java vs Qt QML - Tutorial 001. Hallo Welt

Qt, JAVA, Android, QML

Aus Neugier habe ich beschlossen, zwei Optionen zum Schreiben von Anwendungen für Android zu vergleichen. Früher habe ich angefangen, für Android in Java zu programmieren, aber im Laufe der Zeit bin ich auf die Entwicklung von Desktop-Anwendungen auf Qt QML umgestiegen. Aber jetzt habe ich wieder beschlossen, einige Aspekte aufzufrischen, um sicherzustellen, dass ich Qt QML mehr mag.

Ich werde sofort das Ergebnis von zwei Hallo Welten geben. Sie werden sicherlich nicht zu 100 Prozent identisch sein, aber sie sollten ähnlich sein. Als einfaches Beispiel nehme ich eine leere Aktivität, die in Android Studio erstellt wird.

Das erste Beispiel ist Hello World in Java

Das zweite Beispiel ist Hello World in Qt QML

Im Allgemeinen sind die Anwendungen ähnlich, das Erscheinungsbild unterscheidet sich geringfügig in der Textwiedergabe und in zusätzlichen Effekten. Im Übrigen sind die Anwendungen gleich.

Beginnen wir zunächst mit einer Java-Anwendung.

Erstellen Sie ein Java-Projekt

Schritt 1 - Wählen Sie das Element aus, um ein neues Projekt zu erstellen

Schritt 2 - Geben Sie dem Projekt einen Namen

Schritt 3 - Wählen Sie das minimale Projekt-SDK aus

Schritt 4 - Projekttyp auswählen - Leere Aktivität

Schritt 5 - Einrichten der Aktivität

Dadurch wird das Projekt erstellt und konfiguriert. Sie können es sofort zusammenbauen und auf Ihrem Smartphone ausführen. Ich habe die Größe von apk , eingebaut im Debug -Modus, war ein Beispiel von 170 kB.

Programmcode

Und nun schauen wir uns an, wie der Programmcode der Anwendung aussieht.

Anwendungen für Android in Java bestehen aus zwei Softwareschichten:

1. XML-Layout der Anwendung, das ist die Anwendungsschnittstelle, ihr Erscheinungsbild. Und eigentlich ohne Programmlogik.
2. Java-Anwendungslogik, die für die gesamte Geschäftslogik usw. verantwortlich ist. usw.

XML-Version

Um ehrlich zu sein... es sieht ziemlich umständlich aus, alle Eigenschaften des Erscheinungsbildes der Anwendung in XML darzustellen, obwohl es keine Möglichkeit gibt, irgendeine programmatische Logik zu verwenden, um die Eigenschaften oder den Text der Elemente zu ändern. Diese Komplexität wird besonders deutlich, wenn man ziemlich komplexe Schnittstellen beschreiben muss.

Aber sehen wir uns den XML-Code an.

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.evileg.javahelloworld.MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

Hier sehen Sie, dass das Feld selbst mit dem Text Hello World beschrieben wird, aber das Aussehen der ToolBar, die in der Aktivität vorhanden ist, wird nicht beschrieben. Das Vorhandensein einer ToolBar wird durch den Kontext der Aktivität bestimmt, die in diesem Fall verwendet wird.

Aber in QML müssen Sie leider dieselbe ToolBar selbst schreiben.

Java-Code

Der Java-Code selbst wird klein sein, da Sie nur die Erstellungsmethode Aktivität überschreiben müssen, um das XML-Layout darauf festzulegen. Und wir definieren, welche Aktivität in AndroidManifest.xml gestartet werden soll.

package com.evileg.javahelloworld;

import android.app.Activity;
import android.os.Bundle;

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
}

Erstellen Sie ein Qt QML-Projekt

Schritt 1 - Lassen Sie uns eine leere Qt Quick-Anwendung erstellen

Schritt 2 - Wählen Sie einen Projektstandort

Schritt 3 - Wählen Sie ein Build-System

Sie können nach Ihrem Geschmack wählen:

• qmake
• cmake
  *qbs

Sie wissen nicht, was Sie wählen sollen, wählen Sie qmake

Schritt 4 - Auswählen der Version der Qt-Bibliothek

Wählen Sie die neueste stabile Version (Sie muss installiert sein)

Schritt 5 – Auswählen eines Bausatzes

Was mir an Qt gefällt, ist, dass QML-Anwendungen sowohl für Desktop- als auch für Android-Geräte erstellt werden können. Das heißt, wenn Sie keine plattformspezifischen Funktionen testen, können Sie sicher für den Desktop entwickeln und alle Tests auf Ihrem PC durchführen und nur regelmäßig überprüfen, wie die Anwendung auf einem Android-Gerät funktioniert.

Schritt 6 - Auswählen eines Quellcodeverwaltungssystems

Für Hello World brauchen wir kein Versionskontrollsystem.

Programmcode

Projekte auf Qt QML bestehen in der Regel aus zwei Softwareschichten, wie es bei Java der Fall ist.

• C++-Schicht - die Hauptgeschäftslogik, komplexe Berechnungen, Netzwerke usw. können darauf geschrieben werden.
• QML-Schicht – implementiert das Erscheinungsbild der Anwendung sowie einige Logik, jedoch hindert nichts die Implementierung der gesamten Geschäftslogik in QML, wenn die Anwendung und die Funktionen dies zulassen. QML unterstützt auch recht gut JavaScript, auf dem diese Logik implementiert wird.

Das heißt, in einigen Fällen hindert Sie nichts daran, C++ überhaupt nicht zu verwenden.

main.cpp

Diese Datei wird standardmäßig erstellt. In diesem Fall starten wir die QML-Engine und rendern den Inhalt der Datei main.qml.

#include <QGuiApplication>
#include <QQmlApplicationEngine>

int main(int argc, char *argv[])
{
    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);

    QGuiApplication app(argc, argv);

    QQmlApplicationEngine engine;
    engine.load(QUrl(QStringLiteral("qrc:/main.qml")));
    if (engine.rootObjects().isEmpty())
        return -1;

    return app.exec();
}

QMLHelloWorld.pro

Die Qt-Projektdatei, sie enthält alle Ressourcen sowie die Quelldateien des Projekts mit den Build-Einstellungen. Sie wird hier neben der Datei AndroidManifest.xml ebenfalls benötigt

QT += quick
CONFIG += c++11

# The following define makes your compiler emit warnings if you use
# any feature of Qt which as been marked deprecated (the exact warnings
# depend on your compiler). Please consult the documentation of the
# deprecated API in order to know how to port your code away from it.
DEFINES += QT_DEPRECATED_WARNINGS

# You can also make your code fail to compile if you use deprecated APIs.
# In order to do so, uncomment the following line.
# You can also select to disable deprecated APIs only up to a certain version of Qt.
#DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000    # disables all the APIs deprecated before Qt 6.0.0

SOURCES += main.cpp

RESOURCES += qml.qrc \
    images.qrc

# Additional import path used to resolve QML modules in Qt Creator's code model
QML_IMPORT_PATH =

# Additional import path used to resolve QML modules just for Qt Quick Designer
QML_DESIGNER_IMPORT_PATH =

# Default rules for deployment.
qnx: target.path = /tmp/$${TARGET}/bin
else: unix:!android: target.path = /opt/$${TARGET}/bin
!isEmpty(target.path): INSTALLS += target

DISTFILES += \
    android/AndroidManifest.xml \
    android/gradle/wrapper/gradle-wrapper.jar \
    android/gradlew \
    android/res/values/libs.xml \
    android/build.gradle \
    android/gradle/wrapper/gradle-wrapper.properties \
    android/gradlew.bat

ANDROID_PACKAGE_SOURCE_DIR = $$PWD/android

main.qml

Und hier ist das Interessanteste. In dieser Datei müssen Sie nicht nur den Text HelloWorld erstellen, sondern auch eine Symbolleiste mit einem Symbol und dem Namen des Programms erstellen. Ich habe das Symbol aus dem Java-Projekt genommen und es den Qt-QML-Projektressourcen hinzugefügt.

import QtQuick 2.10
import QtQuick.Window 2.10
import QtQuick.Layouts 1.3
import QtQuick.Controls 2.3
import QtQuick.Controls.Material 2.1

ApplicationWindow {
    visible: true
    width: 360
    height: 520
    title: qsTr("Hello World")

    header: ToolBar {
        height: 48

        Rectangle {
            anchors.fill: parent
            color: "#080808"

            Image {
                id: ico
                height: 36
                width: 36
                anchors {
                    left: parent.left
                    leftMargin: 10
                    top: parent.top
                    topMargin: 6
                }
                source: "qrc:/images/ic_launcher.png"
            }


            Text {
                anchors {
                    verticalCenter: parent.verticalCenter
                    left: ico.right
                    leftMargin: 4
                }

                text: qsTr("QmlHelloWorld")
                font.pixelSize: 18
                color: "white"
            }
        }
    }

    Label {
        anchors.centerIn: parent
        text: qsTr("Hello World!")
        font.pixelSize: 14
    }
}

Der Code war definitiv mehr als in der XML-Layoutdatei für eine Java-Anwendung. Aber lass es uns herausfinden. Dies geschah, weil es in Qt QML zunächst keine Aktivitäten gibt. Im Allgemeinen findet die Arbeit der gesamten Anwendung in einer einzigen Aktivität statt, und es muss nicht zwischen diesen Aktivitäten gewechselt werden. Sie können das Verhalten des Programms mit Loader, StackView, SwipeView und vielen anderen Komponenten ähnlich dem Ändern der Aktivität gestalten. Und hier wird die Fensterkomponente verwendet, die einen Platz zum Platzieren der ToolBar hat, Sie müssen nur das Layout dieser ToolBar schreiben

Wenn also eine solche ToolBar anfangs vorhanden wäre, würde sich das Schreiben des Hallo-Welt-Textes als weniger umständlich herausstellen als bei Java. Das heißt, es wäre

import QtQuick 2.10
import QtQuick.Window 2.10
import QtQuick.Controls 2.3
import QtQuick.Controls.Material 2.1

ApplicationWindow {
    visible: true
    width: 360
    height: 520

    Label {
        anchors.centerIn: parent
        text: qsTr("Hello World!")
        font.pixelSize: 14
    }
}

Dagegen in XML

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.evileg.javahelloworld.MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

Und um ehrlich zu sein, sieht die QML-Version besser lesbar aus.

Build-System und AndroidManifest.xml

Das Build-System verwendete in beiden Fällen Gradle.

Wie bei AndroidManifest.xml wurden im Fall von Java keine zusätzlichen Manipulationen durchgeführt. Während im Fall von Qt Startsymbole hinzugefügt werden mussten. Weitere Informationen zum Arbeiten mit AndroidManifest.xml in Qt finden Sie in diesem Artikel .

Fazit

In beiden Fällen können Sie zwei identische Anwendungen erhalten, aber in den Nuancen der Entwicklung können Sie entscheiden, was und wer bequemer ist.

Beide Optionen bieten die Möglichkeit, in zwei Schichten zu arbeiten

• Java + XML
• QML + C++

Aber im Fall von QML / C ++ kann die gesamte Logik nur in QML geschrieben werden, und im ersten Fall kann nur das Layout in XML geschrieben werden.

Das anfängliche Hello World wird ziemlich schnell in Java geschrieben sein. Es reicht aus, nur ein Projekt zu erstellen, und um ein ähnliches Ergebnis in Qt QML zu erhalten, müssen Sie etwas mehr Code schreiben. In einigen Fällen müssen Sie jedoch in QML viel weniger Code schreiben als in Java / XML.

Von den Minuspunkten von Qt würde ich sofort bemerken, dass es plattformabhängige Momente gibt, die noch durch Java gelöst werden müssen, zum Beispiel Ereignisse aus dem Android-Betriebssystem. Allerdings ... werden auch einige problematische Teile des Projekts durch C ++ in einem Java-Projekt gelöst, daher wird es hier mehr Parität geben.

Von den Pluspunkten von Qt möchte ich anmerken, dass sie in den neuesten Versionen Material Design unterstützen, was auch die Entwicklung einer Anwendung erleichtert, wenn es keinen Designer gibt solche im Projekt.

Die Größe der eingebauten APK, Java gewinnt hier sicherlich. Im Debug-Modus kam die Ausgabe-APK von Java nur 170 kB heraus, während die APK von Qt 10 MB herauskam, im Release-Build wird die Größe der Qt-APK etwa 5-6 MB betragen, aber ich würde es nicht nennen so kritisch, da viele große Anwendungen auf Google Play 40-60 MB wiegen und daher die Größen gleich sein werden.

Andere Aspekte werden in den folgenden Artikeln betrachtet.