Página acerca de FormCard

Aprenda a crear páginas «Acerca de» para mostrar los créditos de su aplicación.

Los complementos de Kirigami son un conjunto adicional de componentes visuales que funcionan bien en el móvil y en el escritorio, con la garantía de ser multiplataforma. Usan Kirigami internamente para crear sus componentes.

Algunos de estos componentes le permiten mostrar los créditos de su trabajo y del de los colaboradores de su proyecto, así como hacer mención de las infraestructuras que usa su aplicación: AboutKDE y AboutPage.

Acerca de KDE

Cada nuevo botón que creamos en el paso anterior debería abrir una nueva página. Se pueden añadir nuevas páginas instanciándolas como Components y usando posteriormente pageStack.layers.push() en cada botón para cargar la página en nuestro 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
import QtQuick
import QtQuick.Layouts

import org.kde.kirigami as Kirigami
import org.kde.kirigamiaddons.formcard as FormCard

import org.kde.about 1.0

Kirigami.ApplicationWindow {
    id: root
    width: 600
    height: 700

    Component {
        id: aboutkde
        FormCard.AboutKDE {}
    }

    pageStack.initialPage: Kirigami.ScrollablePage {
        ColumnLayout {
            FormCard.FormCard {
                FormCard.FormButtonDelegate {
                    id: aboutKDEButton
                    icon.name: "kde"
                    text: i18n("About KDE Page")
                    onClicked: root.pageStack.layers.push(aboutkde)
                }

                FormCard.FormButtonDelegate {
                    id: aboutPageButton
                    icon.name: "applications-utilities"
                    text: i18n("About Addons Example")
                }

                FormCard.FormButtonDelegate {
                    id: settingsButton
                    icon.name: "settings-configure"
                    text: i18n("Single Settings Page")
                }
            }
        }
    }
}

¡Eso es todo! Todo lo que se necesita es crear una instancia de FormCard.AboutKDE. Debería ver algo parecido a esto tras pulsar el botón «AboutKDE»:

Página acerca de

La página AboutPage de la aplicación es ligeramente más complicada, aunque sigue siendo muy sencilla de usar.

Para una sencilla página «acerca de» que usa los datos definidos por KAboutData::setApplicationData(aboutData); en main.cpp, añada lo siguiente a su 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
import QtQuick
import QtQuick.Layouts

import org.kde.kirigami as Kirigami
import org.kde.kirigamiaddons.formcard as FormCard

import org.kde.about 1.0

Kirigami.ApplicationWindow {
    id: root
    width: 600
    height: 700

    Component {
        id: aboutkde
        FormCard.AboutKDE {}
    }

    Component {
        id: aboutpage
        FormCard.AboutPage {}
    }

    pageStack.initialPage: Kirigami.ScrollablePage {
        ColumnLayout {
            FormCard.FormCard {
                FormCard.FormButtonDelegate {
                    id: aboutKDEButton
                    icon.name: "kde"
                    text: i18n("About KDE Page")
                    onClicked: root.pageStack.layers.push(aboutkde)
                }

                FormCard.FormButtonDelegate {
                    id: aboutPageButton
                    icon.name: "applications-utilities"
                    text: i18n("About Addons Example")
                    onClicked: root.pageStack.layers.push(aboutpage)
                }

                FormCard.FormButtonDelegate {
                    id: settingsButton
                    icon.name: "settings-configure"
                    text: i18n("Single Settings Page")
                }
            }
        }
    }
}

La página «Acerca de» de nuestra aplicación debería parecerse a esto:

Uso de JSON en lugar de KAboutData

En lugar de dejar que la página «acerca de» obtenga información de KAboutData, se puede pasar un objeto JSON directamente. Seguirá necesitando usar QApplication::setWindowIcon() en main.cpp para que se muestre el icono de la aplicación.

Cree un MyAboutPage.qml como este:

import org.kde.kirigamiaddons.formcard 1.0 as FormCard
import org.kde.about 1.0

FormCard.AboutPage {
    title: i18nc("@action:button", "About")
    aboutData: {
        "displayName" : "Addons Example",
        "productName" : "",
        "componentName" : "addonsexample",
        "shortDescription" : "This program shows how to use AboutKDE and AboutPage",
        "homepage" : "https://kde.org",
        "bugAddress" : "",
        "version" : "1.0",
        "otherText" : "Optional text shown in the About",
        "authors" : [
            {
                "name" : "John Doe",
                "task" : "Maintainer",
                "emailAddress" : "",
                "webAddress" : "",
                "ocsUsername" : ""
            }
        ],
        "credits" : [],
        "translators" : [],
        "licenses" : [
            {
                "name" : "GPL v3",
                "text" : "Long license text goes here",
                "spdx" : "GPL-3.0"
            }
        ],
        "copyrightStatement" : "© 2023",
        "desktopFileName" : ""
    }

}

Y luego ajuste Main.qml para que incluya la nueva página «acerca de»:

El objeto JSON principal contiene aquí las claves displayName, productName, homepage y demás. Las claves authors, translators y licenses se pueden pasar como array de objetos. Los objetos que se pasan a authors, credits y translators comparten las mismas claves, por lo que cada uno se puede mostrar en su propia sección, mientras que licenses incluye las claves name, text y spdx para cada licencia que se añada, ya que es común que un proyecto incluya múltiples licencias.

Estas claves son opcionales, aunque se espera una cantidad mínima de claves razonable para que la aplicación no tenga en blanco los campos displayName, version, description, homepage, copyrightStatement y authors. No obstante, se recomienda que se rellenen tantos como sea posible.

Introducción a los complementos de Kirigami

Delegados de Form en sus páginas de preferencias