About page

Informações sobre a sua aplicação

A página Kirigami.AboutPage permite-lhe ter uma página que mostra as notas de direitos de cópia da aplicação, em conjunto com os colaboradores e algumas informações sobre a plataforma em que está a ser executado.

Primeiro, vamos editar o nosso ficheiro main.cpp dos tutoriais anteriores.

main.cpp

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
#include <QApplication>
#include <QQmlApplicationEngine>
#include <QtQml>
#include <QUrl>
#include <KAboutData>
#include <KLocalizedContext>
#include <KLocalizedString>

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

    QApplication app(argc, argv);

    KLocalizedString::setApplicationDomain("helloworld");
    QCoreApplication::setOrganizationName(QStringLiteral("KDE"));
    QCoreApplication::setOrganizationDomain(QStringLiteral("kde.org"));
    QCoreApplication::setApplicationName(QStringLiteral("Hello World"));

    if (qEnvironmentVariableIsEmpty("QT_QUICK_CONTROLS_STYLE")) {
        QQuickStyle::setStyle(QStringLiteral("org.kde.desktop"));
    }

    KAboutData aboutData(
        QStringLiteral("helloworld"),
        i18nc("@title", "Hello World"),
        QStringLiteral("1.0"),
        i18n("Hello world application"),
        KAboutLicense::GPL,
        i18n("(c) 2021"));

    aboutData.addAuthor(
        i18nc("@info:credit", "Your name"),
        i18nc("@info:credit", "Author Role"),
        QStringLiteral("your@email.com"),
        QStringLiteral("https://yourwebsite.com"));

    // Set aboutData as information about the app
    KAboutData::setApplicationData(aboutData);

    // Register a singleton that will be accessible from QML.
    qmlRegisterSingletonType(
        "org.kde.example", // How the import statement should look like
        1, 0, // Major and minor versions of the import
        "About", // The name of the QML object
        [](QQmlEngine* engine, QJSEngine *) -> QJSValue {
            // Here we retrieve our aboutData and give it to the QML engine
            // to turn it into a QML type
            return engine->toScriptValue(KAboutData::applicationData());
        }
    );

    // Load an application from a QML file
    QQmlApplicationEngine engine;

    engine.rootContext()->setContextObject(new KLocalizedContext(&engine));
    engine.load(QUrl(QStringLiteral("qrc:/main.qml")));

    if (engine.rootObjects().isEmpty()) {
        return -1;
    }

    return app.exec();
}

No ficheiro main.cpp, incluímos o KAboutData , um componente das Plataformas do KDE de base que guarda informações sobre uma aplicação, as quais poderão ser reutilizadas por muitos componentes das Plataformas do KDE. Iremos instanciar um novo objecto aboutData com o seu construtor predefinido e relativamente completo, e depois adicionar a informação do autor.

Depois de ter sido definida toda a informação necessária, invocamos o KAboutData::setApplicationData para inicializar as propriedades do objecto QApplication .

Iremos criar então um qmlRegisterSingletonType() . Este é usado para nos permitir importar o código em C++ como um módulo no nosso main.qml com o import org.kde.example 1.0.

O seu primeiro argumento é o URI que será usado para a importação, sendo os segundo e terceiro argumentos as versões principais e secundárias, respectivamente, o quarto o nome do tipo - o nome que iremos invocar ao aceder ao nosso tipo About e o último é uma referência ao objecto em C++ que está exposto no QML. No caso do último, iremos usar uma função lambda para instanciar o aboutData da nossa aplicação no local.

main.qml

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
import QtQuick 2.15
import QtQuick.Controls 2.15 as Controls
import QtQuick.Layouts 1.15
import org.kde.kirigami 2.20 as Kirigami

import org.kde.example 1.0

Kirigami.ApplicationWindow {
    id: root

    title: i18nc("@title:window", "Day Kountdown")

    globalDrawer: Kirigami.GlobalDrawer {
        isMenu: true
        actions: [
            Kirigami.Action {
                text: i18n("Quit")
                icon.name: "gtk-quit"
                shortcut: StandardKey.Quit
                onTriggered: Qt.quit()
            },

            Kirigami.Action { // <==== Action to open About page
                text: i18n("About")
                icon.name: "help-about"
                onTriggered: pageStack.layers.push(aboutPage)
            }
        ]
    }

    Component { // <==== Component that instantiates the Kirigami.AboutPage
        id: aboutPage

        Kirigami.AboutPage {
            aboutData: About
        }
    }

    ListModel {
        id: kountdownModel
    }

    AddEditSheet {
        id: addEditSheet
        onAdded: kountdownModel.append({
            "name": name,
            "description": description,
            "date": Date.parse(kdate)
        });
        onEdited: kountdownModel.set(index, {
            "name": name,
            "description": description,
            "date": Date.parse(kdate)
        });
        onRemoved: kountdownModel.remove(index, 1)
    }

    function openPopulatedSheet(mode, index = -1, listName = "", listDesc = "", listDate = "") {
        addEditSheet.mode = mode
        addEditSheet.index = index;
        addEditSheet.name = listName
        addEditSheet.description = listDesc
        addEditSheet.kdate = listDate

        addEditSheet.open()
    }


    pageStack.initialPage: Kirigami.ScrollablePage {
        title: i18nc("@title", "Kountdown")

        actions.main: Kirigami.Action {
            id: addAction
            icon.name: "list-add"
            text: i18nc("@action:button", "Add kountdown")
            onTriggered: openPopulatedSheet("add")
        }

        Kirigami.CardsListView {
            id: layout
            model: kountdownModel
            delegate: KountdownDelegate {}
        }
    }
}

Primeiro, usamos a importação que definimos no ficheiro main.cpp, nomeadamente a org.kde.example. Depois adicionamos uma Kirigami.Action à nossa área global , que nos enviará para a página Acerca, e criamos um componente com uma Kirigami.AboutPage nele, a qual está à espera de um objecto KAboutData::applicationData() . Nós expomos precisamente isso no nosso main.cpp e chamámos-lhe About, pelo que o podemos passar aqui.

CMakeLists

No ficheiro CMakeLists.txt da nossa pasta de topo, certifique-se que tem o CoreAddons na nossa chamada find_package(). É necessária por causa do KAboutData .

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
add_executable(helloworld)

target_sources(helloworld PRIVATE
    main.cpp
    resources.qrc
)

target_link_libraries(helloworld
    Qt${QT_MAJOR_VERSION}::Quick
    Qt${QT_MAJOR_VERSION}::Qml
    Qt${QT_MAJOR_VERSION}::Gui
    Qt${QT_MAJOR_VERSION}::QuickControls2
    Qt${QT_MAJOR_VERSION}::Widgets
    KF${QT_MAJOR_VERSION}::Kirigami2
    KF${QT_MAJOR_VERSION}::I18n
    KF${QT_MAJOR_VERSION}::CoreAddons
)

No ficheiro CMakeLists.txt da pasta src/, não é necessário nada, dado que instanciámos o aboutData no local.

Executar a aplicação

Agora, se executar a sua aplicação e invocar a acção "Acerca" na área global, deverá ver a nossa página 'Acerca'.

Imagem da página Acerca do Kirigami