Toast/kirigami-testing
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Extract components to different files

Browse source
This commit is contained in:
Toast 2025-03-27 02:38:18 +01:00
parent 92359188c0
commit 0d0f9d9bfd
5 changed files with 135 additions and 107 deletions
Download patch file Download diff file Expand all files Collapse all files

3
src/CMakeLists.txt
View file

@ -25,6 +25,9 @@ target_link_libraries(kirigami-testing
KF6::I18n
KF6::CoreAddons
KF6::IconThemes
kirigami-testing-components
)
install(TARGETS kirigami-testing ${KDE_INSTALL_TARGETS_DEFAULT_ARGS})
add_subdirectory(components)

110
src/Main.qml
View file

@ -3,6 +3,7 @@ import QtQuick
import QtQuick.Layouts
import QtQuick.Controls as Controls
import org.kde.kirigami as Kirigami
import xyz.toast003.kirigamiTesting.components
// Provides basic features needed for all kirigami applications
Kirigami.ApplicationWindow {
@ -44,7 +45,7 @@ Kirigami.ApplicationWindow {
Kirigami.CardsListView {
id: cardsView
model: countdownModel
delegate: countdownDelegate
delegate: CountdownDelegate {}
}
}
@ -52,112 +53,7 @@ Kirigami.ApplicationWindow {
id: countdownModel
}
Component {
id: countdownDelegate
Kirigami.AbstractCard {
contentItem: Item {
implicitWidth: delegateLayout.implicitWidth
implicitHeight: delegateLayout.implicitHeight
GridLayout {
id: delegateLayout
anchors {
left: parent.left
top: parent.top
right: parent.right
}
rowSpacing: Kirigami.Units.largeSpacing
columnSpacing: Kirigami.Units.largeSpacing
columns: root.wideScreen ? 4 : 2
Kirigami.Heading {
level: 1
text: i18n("%1 days", Math.round((date-Date.now())/86400000))
}
ColumnLayout {
Kirigami.Heading {
Layout.fillWidth: true
level: 2
text: name
}
Kirigami.Separator {
Layout.fillWidth: true
visible: description.length > 0
}
Controls.Label {
Layout.fillWidth: true
wrapMode: Text.WordWrap
text: description
visible: description.length > 0
}
}
Controls.Button {
Layout.alignment: Qt.AlignRight
Layout.columnSpan: 2
text: i18n("Edit")
}
}
}
}
}
Kirigami.Dialog {
AddDialog {
id: addDialog
title: i18nc("@title:window", "Add countdown")
standardButtons: Kirigami.Dialog.Ok | Kirigami.Dialog.Cancel
padding: Kirigami.Units.largeSpacing
preferredWidth: Kirigami.Units.gridUnit * 20
Kirigami.FormLayout {
Controls.TextField {
id: nameField
Kirigami.FormData.label: i18nc("@label:textbox", "Name*:")
onAccepted: descriptionField.forceActiveFocus()
}
Controls.TextField {
id: descriptionField
Kirigami.FormData.label: i18nc("@label:textbox", "Description:")
placeholderText: i18n("Optional")
onAccepted: dateField.forceActiveFocus()
}
Controls.TextField {
id: dateField
Kirigami.FormData.label: i18nc("@label:textbox", "ISO Date*:")
inputMask: "D999-99-99"
onAccepted: addDialog.onAccepted()
}
Controls.Label {
text: "* = required fields"
}
}
Component.onCompleted: {
const button = standardButton(Kirigami.Dialog.Ok);
button.enabled = Qt.binding(() => requiredFieldsFilled());
}
function requiredFieldsFilled() {
return (nameField.text !== "" && dateField.acceptableInput);
}
function appendDataToModel() {
countdownModel.append({
name: nameField.text,
description: descriptionField.text,
date: new Date(dateField.text)
});
}
function clearFieldsAndClose() {
nameField.text = "";
descriptionField.text = "";
dateField.text = "";
addDialog.close();
}
onAccepted: {
if (!addDialog.requiredFieldsFilled())
return;
appendDataToModel();
clearFieldsAndClose();
}
}
}

64
src/components/AddDialog.qml Normal file
View file

@ -0,0 +1,64 @@
import QtQuick
import QtQuick.Controls as Controls
import org.kde.kirigami as Kirigami
Kirigami.Dialog {
id: addDialog
title: i18nc("@title:window", "Add countdown")
standardButtons: Kirigami.Dialog.Ok | Kirigami.Dialog.Cancel
padding: Kirigami.Units.largeSpacing
preferredWidth: Kirigami.Units.gridUnit * 20
Kirigami.FormLayout {
Controls.TextField {
id: nameField
Kirigami.FormData.label: i18nc("@label:textbox", "Name*:")
onAccepted: descriptionField.forceActiveFocus()
}
Controls.TextField {
id: descriptionField
Kirigami.FormData.label: i18nc("@label:textbox", "Description:")
placeholderText: i18n("Optional")
onAccepted: dateField.forceActiveFocus()
}
Controls.TextField {
id: dateField
Kirigami.FormData.label: i18nc("@label:textbox", "ISO Date*:")
inputMask: "D999-99-99"
onAccepted: addDialog.onAccepted()
}
Controls.Label {
text: "* = required fields"
}
}
Component.onCompleted: {
const button = standardButton(Kirigami.Dialog.Ok);
button.enabled = Qt.binding(() => requiredFieldsFilled());
}
function requiredFieldsFilled() {
return (nameField.text !== "" && dateField.acceptableInput);
}
function appendDataToModel() {
countdownModel.append({
name: nameField.text,
description: descriptionField.text,
date: new Date(dateField.text)
});
}
function clearFieldsAndClose() {
nameField.text = "";
descriptionField.text = "";
dateField.text = "";
addDialog.close();
}
onAccepted: {
if (!addDialog.requiredFieldsFilled())
return;
appendDataToModel();
clearFieldsAndClose();
}
}

16
src/components/CMakeLists.txt Normal file
View file

@ -0,0 +1,16 @@
add_library(kirigami-testing-components)
ecm_add_qml_module(kirigami-testing-components
URI "xyz.toast003.kirigamiTesting.components"
GENERATE_PLUGIN_SOURCE
)
ecm_target_qml_sources(kirigami-testing-components
SOURCES
AddDialog.qml
CountdownDelegate.qml
)
ecm_finalize_qml_module(kirigami-testing-components)
install(TARGETS kirigami-testing-components ${KDE_INSTALL_TARGETS_DEFAULT_ARGS})

49
src/components/CountdownDelegate.qml Normal file
View file

@ -0,0 +1,49 @@
import QtQuick
import QtQuick.Layouts
import QtQuick.Controls as Controls
import org.kde.kirigami as Kirigami
Kirigami.AbstractCard {
contentItem: Item {
implicitWidth: delegateLayout.implicitWidth
implicitHeight: delegateLayout.implicitHeight
GridLayout {
id: delegateLayout
anchors {
left: parent.left
top: parent.top
right: parent.right
}
rowSpacing: Kirigami.Units.largeSpacing
columnSpacing: Kirigami.Units.largeSpacing
columns: root.wideScreen ? 4 : 2
Kirigami.Heading {
level: 1
text: i18n("%1 days", Math.round((date - Date.now()) / 86400000))
}
ColumnLayout {
Kirigami.Heading {
Layout.fillWidth: true
level: 2
text: name
}
Kirigami.Separator {
Layout.fillWidth: true
visible: description.length > 0
}
Controls.Label {
Layout.fillWidth: true
wrapMode: Text.WordWrap
text: description
visible: description.length > 0
}
}
Controls.Button {
Layout.alignment: Qt.AlignRight
Layout.columnSpan: 2
text: i18n("Edit")
}
}
}
}