From 0d7bcb5dd2beb76df8d7ea7a2bab69c78ae79ffc Mon Sep 17 00:00:00 2001 From: Sander van Grieken Date: Fri, 12 Aug 2022 11:08:17 +0200 Subject: [PATCH] qml: refactor HistoryItemDelegate into separate file --- electrum/gui/qml/components/History.qml | 166 ++---------------- .../controls/HistoryItemDelegate.qml | 137 +++++++++++++++ 2 files changed, 150 insertions(+), 153 deletions(-) create mode 100644 electrum/gui/qml/components/controls/HistoryItemDelegate.qml diff --git a/electrum/gui/qml/components/History.qml b/electrum/gui/qml/components/History.qml index 5c1c5a8b9..565d11847 100644 --- a/electrum/gui/qml/components/History.qml +++ b/electrum/gui/qml/components/History.qml @@ -6,6 +6,8 @@ import QtQml.Models 2.2 import org.electrum 1.0 +import "controls" + Pane { id: rootItem visible: Daemon.currentWallet !== undefined @@ -18,21 +20,21 @@ Pane { model: visualModel + readonly property variant sectionLabels: { + 'today': qsTr('Today'), + 'yesterday': qsTr('Yesterday'), + 'lastweek': qsTr('Last week'), + 'lastmonth': qsTr('Last month'), + 'older': qsTr('Older') + } + section.property: 'section' section.criteria: ViewSection.FullString section.delegate: RowLayout { width: ListView.view.width required property string section Label { - text: section == 'today' - ? qsTr('Today') - : section == 'yesterday' - ? qsTr('Yesterday') - : section == 'lastweek' - ? qsTr('Last week') - : section == 'lastmonth' - ? qsTr('Last month') - : qsTr('Older') + text: listview.sectionLabels[section] Layout.alignment: Qt.AlignHCenter Layout.topMargin: constants.paddingLarge font.pixelSize: constants.fontSizeLarge @@ -52,150 +54,8 @@ Pane { DelegateModelGroup { name: 'older'; includeByDefault: false } ] - delegate: Item { - id: delegate - width: ListView.view.width - height: delegateLayout.height - - ColumnLayout { - id: delegateLayout - width: parent.width - spacing: 0 - - ItemDelegate { - Layout.fillWidth: true - Layout.preferredHeight: txinfo.height - - onClicked: { - if (model.lightning) { - var page = app.stack.push(Qt.resolvedUrl('LightningPaymentDetails.qml'), {'key': model.key}) - page.detailsChanged.connect(function() { - // update listmodel when details change - visualModel.model.update_tx_label(model.key, page.label) - }) - } else { - var page = app.stack.push(Qt.resolvedUrl('TxDetails.qml'), {'txid': model.key}) - page.detailsChanged.connect(function() { - // update listmodel when details change - visualModel.model.update_tx_label(model.key, page.label) - }) - } - } - - GridLayout { - id: txinfo - columns: 3 - - x: constants.paddingSmall - width: delegate.width - 2*constants.paddingSmall - - Item { Layout.columnSpan: 3; Layout.preferredWidth: 1; Layout.preferredHeight: 1} - - Image { - readonly property variant tx_icons : [ - "../../../gui/icons/unconfirmed.png", - "../../../gui/icons/clock1.png", - "../../../gui/icons/clock2.png", - "../../../gui/icons/clock3.png", - "../../../gui/icons/clock4.png", - "../../../gui/icons/clock5.png", - "../../../gui/icons/confirmed_bw.png" - ] - - Layout.preferredWidth: constants.iconSizeLarge - Layout.preferredHeight: constants.iconSizeLarge - Layout.alignment: Qt.AlignVCenter - Layout.rowSpan: 2 - source: model.lightning ? "../../../gui/icons/lightning.png" : tx_icons[Math.min(6,model.confirmations)] - } - - Label { - Layout.fillWidth: true - font.pixelSize: model.label !== '' ? constants.fontSizeLarge : constants.fontSizeMedium - text: model.label !== '' ? model.label : '' - color: model.label !== '' ? Material.foreground : constants.mutedForeground - wrapMode: Text.Wrap - maximumLineCount: 2 - elide: Text.ElideRight - } - Label { - id: valueLabel - font.family: FixedFont - font.pixelSize: constants.fontSizeMedium - Layout.alignment: Qt.AlignRight - font.bold: true - color: model.incoming ? constants.colorCredit : constants.colorDebit - - function updateText() { - text = Config.formatSats(model.value) - } - Component.onCompleted: updateText() - } - Label { - font.pixelSize: constants.fontSizeSmall - text: model.date - color: constants.mutedForeground - } - Label { - id: fiatLabel - font.pixelSize: constants.fontSizeSmall - Layout.alignment: Qt.AlignRight - color: constants.mutedForeground - - function updateText() { - if (!Daemon.fx.enabled) { - text = '' - } else if (Daemon.fx.historicRates) { - text = Daemon.fx.fiatValueHistoric(model.value, model.timestamp) + ' ' + Daemon.fx.fiatCurrency - } else { - text = Daemon.fx.fiatValue(model.value, false) + ' ' + Daemon.fx.fiatCurrency - } - } - Component.onCompleted: updateText() - } - Item { Layout.columnSpan: 3; Layout.preferredWidth: 1; Layout.preferredHeight: 1 } - } - } - - Rectangle { - visible: delegate.ListView.section == delegate.ListView.nextSection - Layout.fillWidth: true - Layout.preferredHeight: constants.paddingTiny - color: Qt.rgba(0,0,0,0.10) - } - - } - // as the items in the model are not bindings to QObjects, - // hook up events that might change the appearance - Connections { - target: Config - function onBaseUnitChanged() { valueLabel.updateText() } - function onThousandsSeparatorChanged() { valueLabel.updateText() } - } - - Connections { - target: Daemon.fx - function onHistoricRatesChanged() { fiatLabel.updateText() } - function onQuotesUpdated() { fiatLabel.updateText() } - function onHistoryUpdated() { fiatLabel.updateText() } - function onEnabledUpdated() { fiatLabel.updateText() } - } - - Component.onCompleted: { - if (model.section == 'today') { - delegate.DelegateModel.inToday = true - } else if (model.section == 'yesterday') { - delegate.DelegateModel.inYesterday = true - } else if (model.section == 'lastweek') { - delegate.DelegateModel.inLastweek = true - } else if (model.section == 'lastmonth') { - delegate.DelegateModel.inLastmonth = true - } else if (model.section == 'older') { - delegate.DelegateModel.inOlder = true - } - } - - } // delegate + delegate: HistoryItemDelegate { + } } ScrollIndicator.vertical: ScrollIndicator { } diff --git a/electrum/gui/qml/components/controls/HistoryItemDelegate.qml b/electrum/gui/qml/components/controls/HistoryItemDelegate.qml new file mode 100644 index 000000000..4d8abe2c3 --- /dev/null +++ b/electrum/gui/qml/components/controls/HistoryItemDelegate.qml @@ -0,0 +1,137 @@ +import QtQuick 2.6 +import QtQuick.Layouts 1.0 +import QtQuick.Controls 2.0 +import QtQuick.Controls.Material 2.0 + +import org.electrum 1.0 + +Item { + id: delegate + width: ListView.view.width + height: delegateLayout.height + + ColumnLayout { + id: delegateLayout + width: parent.width + spacing: 0 + + ItemDelegate { + Layout.fillWidth: true + Layout.preferredHeight: txinfo.height + + onClicked: { + if (model.lightning) { + var page = app.stack.push(Qt.resolvedUrl('../LightningPaymentDetails.qml'), {'key': model.key}) + page.detailsChanged.connect(function() { + // update listmodel when details change + visualModel.model.update_tx_label(model.key, page.label) + }) + } else { + var page = app.stack.push(Qt.resolvedUrl('../TxDetails.qml'), {'txid': model.key}) + page.detailsChanged.connect(function() { + // update listmodel when details change + visualModel.model.update_tx_label(model.key, page.label) + }) + } + } + + GridLayout { + id: txinfo + columns: 3 + + x: constants.paddingSmall + width: delegate.width - 2*constants.paddingSmall + + Item { Layout.columnSpan: 3; Layout.preferredWidth: 1; Layout.preferredHeight: 1} + + Image { + readonly property variant tx_icons : [ + "../../../icons/unconfirmed.png", + "../../../icons/clock1.png", + "../../../icons/clock2.png", + "../../../icons/clock3.png", + "../../../icons/clock4.png", + "../../../icons/clock5.png", + "../../../icons/confirmed_bw.png" + ] + + Layout.preferredWidth: constants.iconSizeLarge + Layout.preferredHeight: constants.iconSizeLarge + Layout.alignment: Qt.AlignVCenter + Layout.rowSpan: 2 + source: model.lightning ? "../../../icons/lightning.png" : tx_icons[Math.min(6,model.confirmations)] + } + + Label { + Layout.fillWidth: true + font.pixelSize: model.label !== '' ? constants.fontSizeLarge : constants.fontSizeMedium + text: model.label !== '' ? model.label : '' + color: model.label !== '' ? Material.foreground : constants.mutedForeground + wrapMode: Text.Wrap + maximumLineCount: 2 + elide: Text.ElideRight + } + Label { + id: valueLabel + font.family: FixedFont + font.pixelSize: constants.fontSizeMedium + Layout.alignment: Qt.AlignRight + font.bold: true + color: model.incoming ? constants.colorCredit : constants.colorDebit + + function updateText() { + text = Config.formatSats(model.value) + } + Component.onCompleted: updateText() + } + Label { + font.pixelSize: constants.fontSizeSmall + text: model.date + color: constants.mutedForeground + } + Label { + id: fiatLabel + font.pixelSize: constants.fontSizeSmall + Layout.alignment: Qt.AlignRight + color: constants.mutedForeground + + function updateText() { + if (!Daemon.fx.enabled) { + text = '' + } else if (Daemon.fx.historicRates) { + text = Daemon.fx.fiatValueHistoric(model.value, model.timestamp) + ' ' + Daemon.fx.fiatCurrency + } else { + text = Daemon.fx.fiatValue(model.value, false) + ' ' + Daemon.fx.fiatCurrency + } + } + Component.onCompleted: updateText() + } + Item { Layout.columnSpan: 3; Layout.preferredWidth: 1; Layout.preferredHeight: 1 } + } + } + + Rectangle { + visible: delegate.ListView.section == delegate.ListView.nextSection + Layout.fillWidth: true + Layout.preferredHeight: constants.paddingTiny + color: Qt.rgba(0,0,0,0.10) + } + + } + // as the items in the model are not bindings to QObjects, + // hook up events that might change the appearance + Connections { + target: Config + function onBaseUnitChanged() { valueLabel.updateText() } + function onThousandsSeparatorChanged() { valueLabel.updateText() } + } + + Connections { + target: Daemon.fx + function onHistoricRatesChanged() { fiatLabel.updateText() } + function onQuotesUpdated() { fiatLabel.updateText() } + function onHistoryUpdated() { fiatLabel.updateText() } + function onEnabledUpdated() { fiatLabel.updateText() } + } + +}