Fix layout issues in smart meter views
This commit is contained in:
Michael Zanetti
parent
230552ddd5
commit
abe3a26c91
@ -85,11 +85,8 @@ ThingPageBase {
|
|||||||
CircleBackground {
|
CircleBackground {
|
||||||
id: background
|
id: background
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.preferredHeight: width
|
Layout.fillHeight: true
|
||||||
Layout.leftMargin: app.landscape ? Style.margins : Style.hugeMargins
|
Layout.margins: Style.hugeMargins
|
||||||
Layout.rightMargin: Style.hugeMargins
|
|
||||||
Layout.topMargin: Style.hugeMargins
|
|
||||||
Layout.bottomMargin: app.landscape ? Style.hugeMargins : Style.margins
|
|
||||||
iconSource: ""
|
iconSource: ""
|
||||||
onColor: batteryLevelState
|
onColor: batteryLevelState
|
||||||
? currentPower < 0 ? "crimson" : "limegreen"
|
? currentPower < 0 ? "crimson" : "limegreen"
|
||||||
@ -185,92 +182,92 @@ ThingPageBase {
|
|||||||
}
|
}
|
||||||
|
|
||||||
OpacityMask {
|
OpacityMask {
|
||||||
anchors.fill: background
|
anchors.centerIn: parent
|
||||||
|
width: background.contentItem.width
|
||||||
|
height: background.contentItem.height
|
||||||
source: ShaderEffectSource {
|
source: ShaderEffectSource {
|
||||||
sourceItem: juice
|
sourceItem: juice
|
||||||
hideSource: true
|
hideSource: true
|
||||||
|
sourceRect: Qt.rect(background.contentItem.x, background.contentItem.y, background.contentItem.width, background.contentItem.height)
|
||||||
}
|
}
|
||||||
maskSource: mask
|
maskSource: mask
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Item {
|
|
||||||
|
ColumnLayout {
|
||||||
|
id: textLayout
|
||||||
Layout.fillHeight: true
|
Layout.fillHeight: true
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.margins: Style.bigMargins
|
Layout.margins: Style.bigMargins
|
||||||
|
spacing: Style.margins
|
||||||
|
|
||||||
ColumnLayout {
|
Label {
|
||||||
id: textLayout
|
Layout.fillWidth: true
|
||||||
anchors.fill: parent
|
visible: isBattery
|
||||||
spacing: Style.margins
|
wrapMode: Text.WordWrap
|
||||||
|
horizontalAlignment: Text.AlignHCenter
|
||||||
|
textFormat: Text.RichText
|
||||||
|
property bool isCharging: root.chargingState && root.chargingState.value === "charging"
|
||||||
|
property bool isDischarging: root.chargingState && root.chargingState.value === "discharging"
|
||||||
|
property double availableWh: isBattery ? root.capacityState.value * 1000 * root.batteryLevelState.value / 100 : 0
|
||||||
|
property double remainingWh: isCharging ? root.capacityState.value - availableWh : availableWh
|
||||||
|
property double remainingHours: isBattery ? remainingWh / Math.abs(root.currentPower) : 0
|
||||||
|
property date endTime: isBattery ? new Date(new Date().getTime() + remainingHours * 60 * 60 * 1000) : new Date()
|
||||||
|
property int n: Math.round(remainingHours)
|
||||||
|
|
||||||
Label {
|
text: isCharging ? qsTr("At the current rate, the battery will be fully charged at %1.").arg('<span style="font-size:' + Style.bigFont.pixelSize + 'px">' + endTime.toLocaleTimeString(Locale.ShortFormat) + "</span>")
|
||||||
Layout.fillWidth: true
|
: isDischarging ? qsTr("At the current rate, the battery will last until %1.").arg('<span style="font-size:' + Style.bigFont.pixelSize + 'px">' + endTime.toLocaleTimeString(Locale.ShortFormat) + "</span>")
|
||||||
visible: isBattery
|
: qsTr("The battery is fully charged")
|
||||||
wrapMode: Text.WordWrap
|
}
|
||||||
horizontalAlignment: Text.AlignHCenter
|
|
||||||
textFormat: Text.RichText
|
|
||||||
property bool isCharging: root.chargingState && root.chargingState.value === "charging"
|
|
||||||
property bool isDischarging: root.chargingState && root.chargingState.value === "discharging"
|
|
||||||
property double availableWh: isBattery ? root.capacityState.value * 1000 * root.batteryLevelState.value / 100 : 0
|
|
||||||
property double remainingWh: isCharging ? root.capacityState.value - availableWh : availableWh
|
|
||||||
property double remainingHours: isBattery ? remainingWh / Math.abs(root.currentPower) : 0
|
|
||||||
property date endTime: isBattery ? new Date(new Date().getTime() + remainingHours * 60 * 60 * 1000) : new Date()
|
|
||||||
property int n: Math.round(remainingHours)
|
|
||||||
|
|
||||||
text: isCharging ? qsTr("At the current rate, the battery will be fully charged at %1.").arg('<span style="font-size:' + Style.bigFont.pixelSize + 'px">' + endTime.toLocaleTimeString(Locale.ShortFormat) + "</span>")
|
BlurredLabel {
|
||||||
: isDischarging ? qsTr("At the current rate, the battery will last until %1.").arg('<span style="font-size:' + Style.bigFont.pixelSize + 'px">' + endTime.toLocaleTimeString(Locale.ShortFormat) + "</span>")
|
Layout.fillWidth: true
|
||||||
: qsTr("The battery is fully charged")
|
wrapMode: Text.WordWrap
|
||||||
|
horizontalAlignment: Text.AlignHCenter
|
||||||
|
visible: isEnergyMeter || isConsumer
|
||||||
|
blurred: periodConsumptionModel.busy
|
||||||
|
font: Style.smallFont
|
||||||
|
text: isConsumer ?
|
||||||
|
qsTr("A total of %1 kWh has been <b>consumed</b> in the last 24 hours.").arg('<span style="font-size:' + Style.bigFont.pixelSize + 'px">' + (totalPeriodConsumption).toFixed(1) + '</span>')
|
||||||
|
: qsTr("A total of %1 kWh has been <b>obtained</b> in the last 24 hours.").arg('<span style="font-size:' + Style.bigFont.pixelSize + 'px">' + (totalPeriodConsumption).toFixed(1) + '</span>')
|
||||||
|
textFormat: Text.RichText
|
||||||
|
|
||||||
|
LogsModel {
|
||||||
|
id: periodConsumptionModel
|
||||||
|
objectName: "Root meter model"
|
||||||
|
engine: root.isEnergyMeter ? _engine : null
|
||||||
|
thingId: root.thing.id
|
||||||
|
typeIds: isEnergyMeter ? [root.totalEnergyConsumedStateType.id] : []
|
||||||
|
viewStartTime: root.startTime
|
||||||
|
live: true
|
||||||
}
|
}
|
||||||
|
property LogEntry logEntryAtStart: periodConsumptionModel.busy ? null : periodConsumptionModel.findClosest(periodConsumptionModel.viewStartTime)
|
||||||
|
property double totalPeriodConsumption: logEntryAtStart && totalEnergyConsumedState ? totalEnergyConsumedState.value - logEntryAtStart.value : 0
|
||||||
|
}
|
||||||
|
|
||||||
BlurredLabel {
|
BlurredLabel {
|
||||||
Layout.fillWidth: true
|
visible: isEnergyMeter || isProducer
|
||||||
wrapMode: Text.WordWrap
|
Layout.fillWidth: true
|
||||||
horizontalAlignment: Text.AlignHCenter
|
wrapMode: Text.WordWrap
|
||||||
visible: isEnergyMeter || isConsumer
|
horizontalAlignment: Text.AlignHCenter
|
||||||
blurred: periodConsumptionModel.busy
|
blurred: periodProductionModel.busy
|
||||||
font: Style.smallFont
|
font: Style.smallFont
|
||||||
text: isConsumer ?
|
text: isProducer ?
|
||||||
qsTr("A total of %1 kWh has been <b>consumed</b> in the last 24 hours.").arg('<span style="font-size:' + Style.bigFont.pixelSize + 'px">' + (totalPeriodConsumption).toFixed(1) + '</span>')
|
qsTr("A total of %1 kWh has been <b>produced</b> in the last 24 hours.").arg('<span style="font-size:' + Style.bigFont.pixelSize + 'px">' + (totalPeriodProduction).toFixed(1) + '</span>')
|
||||||
: qsTr("A total of %1 kWh has been <b>obtained</b> in the last 24 hours.").arg('<span style="font-size:' + Style.bigFont.pixelSize + 'px">' + (totalPeriodConsumption).toFixed(1) + '</span>')
|
: qsTr("A total of %1 kWh has been <b>returned</b> in the last 24 hours.").arg('<span style="font-size:' + Style.bigFont.pixelSize + 'px">' + (totalPeriodProduction).toFixed(1) + '</span>')
|
||||||
textFormat: Text.RichText
|
textFormat: Text.RichText
|
||||||
|
|
||||||
LogsModel {
|
LogsModel {
|
||||||
id: periodConsumptionModel
|
id: periodProductionModel
|
||||||
objectName: "Root meter model"
|
engine: root.isEnergyMeter ? _engine : null
|
||||||
engine: root.isEnergyMeter ? _engine : null
|
thingId: root.thing.id
|
||||||
thingId: root.thing.id
|
typeIds: isEnergyMeter ? [root.totalEnergyProducedStateType.id] : []
|
||||||
typeIds: isEnergyMeter ? [root.totalEnergyConsumedStateType.id] : []
|
viewStartTime: root.startTime
|
||||||
viewStartTime: root.startTime
|
live: true
|
||||||
live: true
|
|
||||||
}
|
|
||||||
property LogEntry logEntryAtStart: periodConsumptionModel.busy ? null : periodConsumptionModel.findClosest(periodConsumptionModel.viewStartTime)
|
|
||||||
property double totalPeriodConsumption: logEntryAtStart && totalEnergyConsumedState ? totalEnergyConsumedState.value - logEntryAtStart.value : 0
|
|
||||||
}
|
|
||||||
|
|
||||||
BlurredLabel {
|
|
||||||
visible: isEnergyMeter || isProducer
|
|
||||||
Layout.fillWidth: true
|
|
||||||
wrapMode: Text.WordWrap
|
|
||||||
horizontalAlignment: Text.AlignHCenter
|
|
||||||
blurred: periodProductionModel.busy
|
|
||||||
font: Style.smallFont
|
|
||||||
text: isProducer ?
|
|
||||||
qsTr("A total of %1 kWh has been <b>produced</b> in the last 24 hours.").arg('<span style="font-size:' + Style.bigFont.pixelSize + 'px">' + (totalPeriodProduction).toFixed(1) + '</span>')
|
|
||||||
: qsTr("A total of %1 kWh has been <b>returned</b> in the last 24 hours.").arg('<span style="font-size:' + Style.bigFont.pixelSize + 'px">' + (totalPeriodProduction).toFixed(1) + '</span>')
|
|
||||||
textFormat: Text.RichText
|
|
||||||
|
|
||||||
LogsModel {
|
|
||||||
id: periodProductionModel
|
|
||||||
engine: root.isEnergyMeter ? _engine : null
|
|
||||||
thingId: root.thing.id
|
|
||||||
typeIds: isEnergyMeter ? [root.totalEnergyProducedStateType.id] : []
|
|
||||||
viewStartTime: root.startTime
|
|
||||||
live: true
|
|
||||||
}
|
|
||||||
property LogEntry logEntryAtStart: periodProductionModel.busy ? null : periodProductionModel.findClosest(periodProductionModel.viewStartTime)
|
|
||||||
property double totalPeriodProduction: logEntryAtStart && totalEnergyProducedState ? totalEnergyProducedState.value - logEntryAtStart.value : 0
|
|
||||||
}
|
}
|
||||||
|
property LogEntry logEntryAtStart: periodProductionModel.busy ? null : periodProductionModel.findClosest(periodProductionModel.viewStartTime)
|
||||||
|
property double totalPeriodProduction: logEntryAtStart && totalEnergyProducedState ? totalEnergyProducedState.value - logEntryAtStart.value : 0
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user