Enkonduko al Kirigami Addons
Kirigami Addons estas plia aro de vidaj komponantoj, kiuj bone funkcias ĉe poŝtelefono kaj labortablo kaj estas garantiitaj esti transplatformaj. Ĝi uzas Kirigami sub la kapuĉo por krei siajn komponentojn.
Ĉi tie vi starigos vian novan Kirigami Addons-projekton kaj estos prezentita al kelkaj utilaj komponantoj.
Ĉi tiuj komponantoj uzas la lokalizinstalaĵojn de KDE, do antaŭ ol ni ekuzi ĉi tiujn, ni devos agordi etan projekton kiu uzas KLocalizedContext .
Agordi vian projekton
La komenca projektstrukturo aspektos tiel:
addonsexample/
├── CMakeLists.txt
├── main.cpp
├── resources.qrc
└── contents/
└── ui/
└── main.qml
Konsileto
Vi povas rapide krei ĉi tiun dosierstrukturon per:
mkdir -p addonsexample/contents/ui
touch addonsexample/{CMakeLists.txt,main.cpp,resources.qrc}
touch addonsexample/contents/ui/main.qml
Ni komencas uzante tre norman CMakeLists.txt:
cmake_minimum_required(VERSION 3.20)
project(FormCardTutorial)
find_package(ECM REQUIRED NO_MODULE)
set(CMAKE_MODULE_PATH ${ECM_MODULE_PATH})
include(KDEInstallDirs)
include(KDECompilerSettings)
include(KDECMakeSettings)
find_package(Qt${QT_MAJOR_VERSION} REQUIRED COMPONENTS
Widgets # For QApplication
Quick # For QML
QuickControls2 # For QQuickStyle
)
find_package(KF${QT_MAJOR_VERSION} REQUIRED COMPONENTS
CoreAddons # For KAboutData
I18n # For KLocalizedContext
)
add_executable(addonsexample)
target_sources(addonsexample PRIVATE main.cpp resources.qrc)
target_link_libraries(addonsexample PRIVATE
Qt::Widgets
Qt::Quick
Qt::QuickControls2
KF${QT_MAJOR_VERSION}::CoreAddons
KF${QT_MAJOR_VERSION}::I18n
)
install(TARGETS addonsexample DESTINATION ${KDE_INSTALL_BINDIR})
Norma resources.qrc:
<!DOCTYPE RCC>
<RCC version="1.0">
<qresource prefix="/">
<file alias="main.qml">contents/ui/main.qml</file>
</qresource>
</RCC>
La interesa parto estos la main.cpp:
#include <QtQml>
#include <QApplication>
#include <QQmlApplicationEngine>
#include <QIcon>
#include <QQuickStyle>
#include <KAboutData>
#include <KLocalizedContext>
#include <KLocalizedString>
int main(int argCount, char* argVector[])
{
QApplication app(argCount, argVector);
KLocalizedString::setApplicationDomain("org.kde.addonsexample");
KAboutData aboutData(
QStringLiteral("addonsexample"),
i18n("Addons Example"),
QStringLiteral("1.0"),
i18n("This program shows how to use Kirigami Addons"),
KAboutLicense::GPL_V3,
QStringLiteral("(C) 2023"),
i18n("Optional text shown in the About"),
QStringLiteral("https://kde.org"));
aboutData.addAuthor(i18nc("@info:credit", "John Doe"),
i18nc("@info:credit", "Maintainer"));
KAboutData::setApplicationData(aboutData);
if (qEnvironmentVariableIsEmpty("QT_QUICK_CONTROLS_STYLE")) {
QQuickStyle::setStyle(QStringLiteral("org.kde.desktop"));
}
QApplication::setWindowIcon(QIcon::fromTheme(QStringLiteral("kde")));
qmlRegisterSingletonType(
"org.kde.about",
1, 0, "About",
[](QQmlEngine *engine, QJSEngine *) -> QJSValue {
return engine->toScriptValue(KAboutData::applicationData());
}
);
QQmlApplicationEngine engine;
engine.rootContext()->setContextObject(new KLocalizedContext(&engine));
engine.load(QStringLiteral("qrc:/main.qml"));
app.exec();
}
Se vi legis nian KXmlGui-lerniilon aŭ la lastan Kirigami-lerniilon sur la Kirigami Pri paĝo, granda parto de ĉi tio estos ŝajnas al vi konata.
Ni kreas nian aplikaĵon kaj uzas KAboutData's defaŭltan konstrukciilon por aldoni la metadatenojn de nia aplikaĵo, aldonas nin kiel aŭtoron, kaj poste uzas setApplicationData() por fini la procezon. Por poste, ni ankaŭ starigis aplikaĵpiktogramon kiu venas de la sistemetoso.
Ni tiam uzas lambda en qmlRegisterSingletonType por rekte sendi la metadatenojn de nia aplikaĵo al la QML-flanko, elmontrante ĝiajn ecojn.
Ni tiam kreas nian QML-motoron, kaj agordas ĝian kuntekston por uzi la KLocalizedContext de KDE, uzatan por integri tradukitajn ĉenojn, pasante la ĵus kreitan motoron kiel parametron.
Ni simple ŝargas nian QML-dosieron el la rimeda dosiero, kaj nun ni nur bezonas zorgi pri nia komenca QML-dosiero.
FormCard kaj FormButtonDelegate
La ideo por nia programo estas desegni nian propran Kirigami Addons-galerion, montrante plurajn komponantojn, unu po paĝo. La ĉefpaĝo enhavos simplan liston de butonoj en ColumnLayout, ĉiu malfermante apartan paĝon.
Komence, nia contents/ui/main.qml devus aspekti jene:
| |
Ni uzas nian oportunan pageStack por agordi la komencan paĝon al Kirigami.ScrollablePage .
Dum ni povus uzi FormLayout kune kun QtQuick Controls components por atingi nian celon, ĉi tie vi estos prezentita al [FormCard](https ://api.kde.org/frameworks/kirigami-addons/html/classFormCard.html).
La ĉefa celo de FormCard estas servi kiel ujo por aliaj komponantoj sekvante diferencan koloron de la fono, en simila maniero al Kirigami.Card , sed por agordaj fenestroj. Vi povas havi plurajn FormCards en via aplikaĵo por indiki malsamajn sekciojn. Via FormCard ankaŭ estas atendita esti rekta infano de ColumnLayout.
Importi org.kde.kirigamiaddons.formcard disponigas ĉiujn komponantojn de FormCard al via QML-dosiero.
Ni havos nur unu sekcion en nia ĉefa paĝo, do ni aldonas ununuran FormCard:
| |
La bonega afero pri FormCard estas, ke ĝi faras aŭtomatan aranĝon por vi. Alivorte, nur la ordo de ĝiaj komponantoj sufiĉas por indiki ilian pozicion ene de la FormCard, neniu Layout attached properties estas necesaj kaj vi atendas ne uzi ankrojn aŭ [poziciigilojn](https://doc.qt.io /qt-6/qtquick-positioning-layouts.html).
Ni povas simple aldoni kelkajn butonojn ene de nia FormCard:
| |
Jen ĝi! La butonoj ankoraŭ ne estas uzeblaj, sed ni nun estas aranĝitaj por ludi kun niaj Pri paĝoj!
Ni tiam konstruas kaj rulas ĝin tiel:
cmake -B build/ -DCMAKE_INSTALL_PREFIX=~/kde5/usr
cmake --build build/
cmake --install build/
aboutexample
Por vidi aliajn manierojn konstrui vian aplikaĵon (ekzemple en Vindozo), vidu la paĝon Komenco kun Kirigami.
