Implement basic dummy time picker

AppSettingsPage.qml

@@ -14,7 +14,7 @@ NavigationPage {
             anchors.fill: parent
             columns: 2
 
-            Label {
+            Text {
                 text: qsTr("Number of app instances:")
                 font.bold: true
                 wrapMode: Text.Wrap
@@ -35,7 +35,7 @@ NavigationPage {
             anchors.fill: parent
             columns: 2
 
-            Label {
+            Text {
                 text: qsTr("solalaweb key:")
                 font.bold: true
                 wrapMode: Text.Wrap
@@ -52,7 +52,7 @@ NavigationPage {
                 }
             }
 
-            Label {
+            Text {
                 text: qsTr("solalaweb cert:")
                 font.bold: true
                 wrapMode: Text.Wrap

CMakeLists.txt

@@ -103,13 +103,19 @@ qt_add_qml_module(evcharger-app
         PvSurplusPage.qml
         RebootPage.qml
         RequestStatusText.qml
+        SchedulerDayPage.qml
         SchedulerPage.qml
         SecurityPage.qml
         SelectLogicModeItem.qml
         SensorsConfigurationPage.qml
         SetPriceLimitPage.qml
         SettingsTabPage.qml
+        SimpleNavigationItem.qml
         SwitchLanguagePage.qml
+        TimeComponentLabel.qml
+        TimePickerDialog.qml
+        TimePickerLabel.qml
+        TimePicker.qml
         VerticalTabButton.qml
         WhiteBox.qml
         WiFiErrorsPage.qml

ChargerTabPage.qml

@@ -28,7 +28,7 @@ StackView {
             RowLayout {
                 anchors.fill: parent
 
-                Label {
+                Text {
                     Layout.fillWidth: true
                     Layout.fillHeight: true
 

CloudPage.qml

@@ -25,7 +25,7 @@ NavigationPage {
             anchors.fill: parent
             columns: 2
 
-            Label {
+            Text {
                 text: qsTr("Trying to connect:")
                 font.bold: true
             }
@@ -34,7 +34,7 @@ NavigationPage {
                 apiKey: "cws"
             }
 
-            Label {
+            Text {
                 text: qsTr("Is connected:")
                 font.bold: true
             }
@@ -45,7 +45,7 @@ NavigationPage {
 
             // TODO cwsca
 
-            Label {
+            Text {
                 text: qsTr("Hello received:")
                 font.bold: true
             }
@@ -54,7 +54,7 @@ NavigationPage {
                 apiKey: "chr"
             }
 
-            Label {
+            Text {
                 text: qsTr("Queue size cloud:")
                 font.bold: true
             }
@@ -63,7 +63,7 @@ NavigationPage {
                 apiKey: "qsc"
             }
 
-            Label {
+            Text {
                 text: qsTr("Last error:")
                 font.bold: true
             }

ConnectingScreen.qml

@@ -37,7 +37,7 @@ ColumnLayout {
         model: collectedMessages
         clip: true
 
-        delegate: Label {
+        delegate: Text {
             text: message
         }
 

ControllerTabPage.qml

@@ -18,7 +18,7 @@ Page {
         RowLayout {
             anchors.fill: parent
 
-            Label {
+            Text {
                 Layout.fillWidth: true
                 Layout.fillHeight: true
 

DeviceListScreen.qml

@@ -190,14 +190,14 @@ StackView {
                             Layout.fillWidth: true
                             Layout.fillHeight: true
 
-                            Label {
+                            Text {
                                 Layout.fillWidth: true
                                 text: delegate.friendlyName
                                 font.bold: true
                                 elide: Text.ElideRight
                             }
 
-                            Label {
+                            Text {
                                 Layout.fillWidth: true
                                 text: qsTr("Serial Number %0").arg(delegate.serial);
                             }
@@ -212,48 +212,48 @@ StackView {
                         rowSpacing: 10
                         columnSpacing: 10
 
-                        Label {
+                        Text {
                             text: qsTr("Manufacturer:")
                             Layout.leftMargin: 60
                         }
 
-                        Label {
+                        Text {
                             text: delegate.manufacturer
                             font.bold: true
                             elide: Text.ElideRight
                             Layout.fillWidth: true
                         }
 
-                        Label {
+                        Text {
                             text: qsTr("Device Type:")
                             Layout.leftMargin: 60
                         }
 
-                        Label {
+                        Text {
                             text: delegate.deviceType
                             font.bold: true
                             elide: Text.ElideRight
                             Layout.fillWidth: true
                         }
 
-                        Label {
+                        Text {
                             text: qsTr("Host Name:")
                             Layout.leftMargin: 60
                         }
 
-                        Label {
+                        Text {
                             text: delegate.hostName
                             font.bold: true
                             elide: Text.ElideRight
                             Layout.fillWidth: true
                         }
 
-                        Label {
+                        Text {
                             text: qsTr("Ip:")
                             Layout.leftMargin: 60
                         }
 
-                        Label {
+                        Text {
                             text: delegate.ip
                             font.bold: true
                             elide: Text.ElideRight

DeviceScreen.qml

@@ -92,7 +92,7 @@ Loader {
                 color: "red"
             }
 
-            Label {
+            Text {
                 text: qsTr("Password:")
                 Layout.alignment: Qt.AlignLeft | Qt.AlignBaseline
             }

EcoTabPage.qml

@@ -43,7 +43,7 @@ StackView {
                     fillMode: Image.PreserveAspectFit
                 }
 
-                Label {
+                Text {
                     Layout.fillWidth: true
                     font.pointSize: 20
                     font.bold: true

FirmwarePage.qml

@@ -13,7 +13,7 @@ NavigationPage {
             anchors.fill: parent
             columns: 2
 
-            Label {
+            Text {
                 text: qsTr("Running version:")
                 font.bold: true
             }
@@ -23,7 +23,7 @@ NavigationPage {
                 id: runningVersion
             }
 
-            Label {
+            Text {
                 text: qsTr("Details:")
                 font.bold: true
             }
@@ -40,7 +40,7 @@ NavigationPage {
                 text: JSON.stringify(runningVersionDetails.value, null, 4)
             }
 
-            Label {
+            Text {
                 text: qsTr("Recommended version:")
                 font.bold: true
             }
@@ -61,7 +61,7 @@ NavigationPage {
             RowLayout {
                 Layout.fillWidth: true
 
-                Label {
+                Text {
                     text: qsTr("Update:")
                 }
 
@@ -163,7 +163,7 @@ NavigationPage {
                 Layout.fillWidth: true
                 columns: 2
 
-                Label {
+                Text {
                     text: qsTr("Update status:")
                     font.bold: true
                 }
@@ -191,7 +191,7 @@ NavigationPage {
                     }
                 }
 
-                Label {
+                Text {
                     text: qsTr("Update progress:")
                     font.bold: true
                 }
@@ -222,7 +222,7 @@ NavigationPage {
                     }
                 }
 
-                Label {
+                Text {
                     text: qsTr("Update message:")
                     font.bold: true
                 }

HardwareInformationPage.qml

@@ -13,7 +13,7 @@ NavigationPage {
             columns: 2
             anchors.fill: parent
 
-            Label {
+            Text {
                 text: qsTr("Serial Number:")
             }
 
@@ -22,7 +22,7 @@ NavigationPage {
                 apiKey: "sse"
             }
 
-            Label {
+            Text {
                 visible: variant.exists
                 text: qsTr("Variant:")
             }
@@ -34,7 +34,7 @@ NavigationPage {
                 apiKey: "var"
             }
 
-            Label {
+            Text {
                 visible: rssi.exists
                 text: qsTr("RSSI:")
             }

MqttPage.qml

@@ -17,7 +17,7 @@ NavigationPage {
             anchors.fill: parent
             columns: 2
 
-            Label {
+            Text {
                 text: qsTr("Trying to connect:")
                 font.bold: true
             }
@@ -26,7 +26,7 @@ NavigationPage {
                 apiKey: "mcs"
             }
 
-            Label {
+            Text {
                 text: qsTr("Is connected:")
                 font.bold: true
             }
@@ -35,7 +35,7 @@ NavigationPage {
                 apiKey: "mcc"
             }
 
-            Label {
+            Text {
                 text: qsTr("Connected since:")
                 font.bold: true
             }
@@ -50,7 +50,7 @@ NavigationPage {
                 text: connectedSince.value ? formatDuration(connectedSince.value - rebootTime.value) : ""
             }
 
-            Label {
+            Text {
                 text: qsTr("Command Counter:")
                 font.bold: true
             }
@@ -59,7 +59,7 @@ NavigationPage {
                 apiKey: "mcsl"
             }
 
-            Label {
+            Text {
                 text: qsTr("Last error:")
                 font.bold: true
             }
@@ -69,7 +69,7 @@ NavigationPage {
                 wrapMode: Text.Wrap
             }
 
-            Label {
+            Text {
                 text: qsTr("Last error age:")
                 font.bold: true
             }

OcppPage.qml

@@ -17,7 +17,7 @@ NavigationPage {
             anchors.fill: parent
             columns: 2
 
-            Label {
+            Text {
                 text: qsTr("Trying to connect:")
                 font.bold: true
             }
@@ -26,7 +26,7 @@ NavigationPage {
                 apiKey: "ocpps"
             }
 
-            Label {
+            Text {
                 text: qsTr("Is connected:")
                 font.bold: true
             }
@@ -35,7 +35,7 @@ NavigationPage {
                 apiKey: "ocppc"
             }
 
-            Label {
+            Text {
                 text: qsTr("Connected since:")
                 font.bold: true
             }
@@ -50,7 +50,7 @@ NavigationPage {
                 text: connectedSince.value ? formatDuration(connectedSince.value - rebootTime.value) : ""
             }
 
-            Label {
+            Text {
                 text: qsTr("Is accepted:")
                 font.bold: true
             }
@@ -59,7 +59,7 @@ NavigationPage {
                 apiKey: "ocppa"
             }
 
-            Label {
+            Text {
                 text: qsTr("Accepted since:")
                 font.bold: true
             }
@@ -74,7 +74,7 @@ NavigationPage {
                 text: acceptedSince.value ? formatDuration(acceptedSince.value - rebootTime.value) : ""
             }
 
-            Label {
+            Text {
                 text: qsTr("Last error:")
                 font.bold: true
             }
@@ -84,7 +84,7 @@ NavigationPage {
                 wrapMode: Text.Wrap
             }
 
-            Label {
+            Text {
                 text: qsTr("Last error age:")
                 font.bold: true
             }
@@ -99,7 +99,7 @@ NavigationPage {
                 text: lastErrorAge.value ? formatDuration(lastErrorAge.value - rebootTime.value) : ""
             }
 
-            Label {
+            Text {
                 text: qsTr("Chargepoint status:")
                 font.bold: true
             }

SchedulerDayPage.qml

@@ -0,0 +1,47 @@
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+
+NavigationPage {
+    title: qsTr("Scheduler day")
+
+    TimeComponentLabel {
+        id: openDialogLabel
+        width: parent.width - 80
+        anchors.centerIn: parent
+        font.pixelSize: Qt.application.font.pixelSize * 8
+        renderTypeQuality: Text.VeryHighRenderTypeQuality
+        interactive: !timePickerDialog.opened
+
+        text: Qt.formatTime(new Date(1970, 1, 1, timePickerDialog.hours, timePickerDialog.minutes), "hh:mm")
+
+        onTapped: timePickerDialog.openWithMode(TimePicker.Mode.Hours)
+    }
+
+    ColumnLayout {
+        // We always want the openDialogLabel to be centered in the window, not us.
+        // For that reason, we use anchors rather than putting the root items into a ColumnLayout.
+        anchors.horizontalCenter: parent.horizontalCenter
+        anchors.top: openDialogLabel.bottom
+        anchors.topMargin: 24
+        spacing: 12
+
+        Switch {
+            id: is24HourSwitch
+            text: qsTr("24 Hour")
+            checked: timePickerDialog.is24Hour
+        }
+        // Switch {
+        //     id: darkThemeSwitch
+        //     text: qsTr("Dark")
+        // }
+    }
+
+    TimePickerDialog {
+        id: timePickerDialog
+        anchors.centerIn: parent
+        is24Hour: is24HourSwitch.checked
+
+        onTimeAccepted: print("A time was chosen - do something here!")
+    }
+}

SchedulerPage.qml

@@ -5,9 +5,138 @@ import QtQuick.Layouts
 NavigationPage {
     title: qsTr("Scheduler")
 
-    Text {
+    WhiteBox {
-        text: "TODO"
+        Layout.fillWidth: true
 
-        Layout.fillHeight: true
+        ColumnLayout {
+            anchors.fill: parent
+
+            Image {
+                Layout.fillWidth: true
+                Layout.preferredHeight: 50
+                source: "material-icons/grid_guides.svg"
+                fillMode: Image.PreserveAspectFit
+            }
+
+            Text {
+                Layout.fillWidth: true
+                font.pointSize: 20
+                font.bold: true
+                text: qsTr("About Schedule")
+                wrapMode: Text.Wrap
+                verticalAlignment: Text.AlignVCenter
+            }
+
+            Text {
+                Layout.fillWidth: true
+                text: qsTr("Customize your charging routine on workdays, Saturdays, and Sundays. Define specific time slots for charging or blocking to perfectly align with your weekly schedule. Schedule can only start charging if all other functions like eco or access settings allow charging.")
+                wrapMode: Text.Wrap
+                verticalAlignment: Text.AlignVCenter
+            }
+
+            RowLayout {
+                Layout.fillWidth: true
+
+                Image {
+                    Layout.preferredWidth: 50
+                    Layout.fillHeight: true
+                    source: "material-icons/grid_guides.svg"
+                    fillMode: Image.PreserveAspectFit
+                }
+
+                ColumnLayout {
+                    Layout.fillWidth: true
+
+                    Text {
+                        Layout.fillWidth: true
+
+                        font.bold: true
+                        text: qsTr("Charging schedule")
+                        wrapMode: Text.Wrap
+                    }
+
+                    Text {
+                        Layout.fillWidth: true
+                        Layout.fillHeight: true
+
+                        text: qsTr("go-e Charger will exclusively charge your car during the time slots you set, and won't charge for the rest of the time.")
+                        wrapMode: Text.Wrap
+                    }
+                }
+            }
+
+            RowLayout {
+                Layout.fillWidth: true
+
+                Image {
+                    Layout.preferredWidth: 50
+                    Layout.fillHeight: true
+                    source: "material-icons/grid_guides.svg"
+                    fillMode: Image.PreserveAspectFit
+                }
+
+                ColumnLayout {
+                    Layout.fillWidth: true
+
+                    Text {
+                        Layout.fillWidth: true
+
+                        font.bold: true
+                        text: qsTr("Blocking schedule")
+                        wrapMode: Text.Wrap
+                    }
+
+                    Text {
+                        Layout.fillWidth: true
+                        Layout.fillHeight: true
+
+                        text: qsTr("go-e Charger will block charging your car during the time slots you set, but it will charge your car for the rest of the time.")
+                        wrapMode: Text.Wrap
+                    }
+                }
+            }
+        }
+    }
+
+    Text {
+        text: qsTr("Workdays")
+        font.bold: true
+        font.pointSize: 15
+        height: implicitHeight + 30
+    }
+
+    SimpleNavigationItem {
+        text: qsTr("Create workdays schedule")
+        color: "blue"
+        component: "SchedulerDayPage.qml"
+        componentArgs: { day: 0 }
+    }
+
+    Text {
+        text: qsTr("Saturdays")
+        font.bold: true
+        font.pointSize: 15
+        height: implicitHeight + 30
+    }
+
+    SimpleNavigationItem {
+        text: qsTr("Create saturdays schedule")
+        color: "blue"
+        component: "SchedulerDayPage.qml"
+        componentArgs: { day: 1 }
+    }
+
+    Text {
+        text: qsTr("Sundays")
+        font.bold: true
+        font.pointSize: 15
+        height: implicitHeight + 30
+    }
+
+    SimpleNavigationItem {
+        text: qsTr("Create sundays schedule")
+        color: "blue"
+        component: "SchedulerDayPage.qml"
+        componentArgs: { day: 2 }
     }
 }

SimpleNavigationItem.qml

@@ -0,0 +1,21 @@
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+
+ItemDelegate {
+    id: navigationItem
+
+    property color color
+    property string component
+    property var componentArgs: undefined
+
+    Layout.fillWidth: true
+
+    Component.onCompleted: {
+        background.radius = 5
+        background.color = 'white'
+        contentItem.children[0].color = navigationItem.color
+    }
+
+    onClicked: stackView.push(navigationItem.component, navigationItem.componentArgs)
+}

TimeComponentLabel.qml

@@ -0,0 +1,26 @@
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls.Material
+
+Label {
+    id: root
+    fontSizeMode: Label.Fit
+    horizontalAlignment: Label.AlignHCenter
+    verticalAlignment: Label.AlignVCenter
+
+    Material.foreground: Material.theme === Material.Light
+        ? Material.color(Material.Indigo, !dim ? Material.Shade500 : Material.Shade100)
+        : Material.color(Material.Indigo, dim ? Material.Shade300 : Material.Shade100)
+
+    Layout.fillHeight: true
+
+    property bool dim: false
+    property alias interactive: tapHandler.enabled
+
+    signal tapped
+
+    TapHandler {
+        id: tapHandler
+        onTapped: root.tapped()
+    }
+}

TimePicker.qml

@@ -0,0 +1,316 @@
+import QtQuick
+import QtQuick.Controls.Material
+
+Item {
+    id: root
+    implicitWidth: 250
+    implicitHeight: 250
+
+    enum Mode {
+        Hours,
+        Minutes
+    }
+
+    property int mode: TimePicker.Mode.Hours
+    property int hours
+    property int minutes
+    property bool is24Hour
+    property bool interactive: true
+
+    // The mode that the label delegates see, so that we can
+    // animate their opacity before their text changes.
+    property int __effectiveMode: TimePicker.Mode.Hours
+    // For 12 hour pickers, we can use 0 to 60 to represent all values.
+    property int __value: 0
+    // For 24 hour pickers, we need to store this extra flag.
+    property bool __is24HourValueSelected
+    // How many values the arm should snap to at a time.
+    readonly property int __stepSize: __getStepSize(mode)
+    readonly property int __to: 60
+    readonly property int __labelAngleStepSize: 360 / 12
+    property bool __switchingModes
+
+    // This signal could be used if TimePicker is used as a standalone component.
+    // It's emitted when the minute is selected.
+    signal accepted()
+
+    // Convenience for setting each property individually, but also
+    // ensures that the selector arm is properly rotated when there is
+    // a programmatic change in hours or minutes but not mode.
+    function openWith(mode, hours, minutes) {
+        root.mode = mode
+        root.hours = hours
+        root.minutes = minutes
+        __updateAfterModeOrTimeChange()
+    }
+
+    // Until QML gets private properties (QTBUG-11984), use the traditional
+    // double-underscore convention.
+    function __angleForValue(value: int): real {
+        return (value / __to) * 360
+    }
+
+    function __getStepSize(mode) {
+        return mode === TimePicker.Mode.Hours ? 5 : 1
+    }
+
+    function __updateAfterModeOrTimeChange() {
+        // We use a function for this rather than a binding, because we could be called before the
+        // __stepSize binding is evaluated.
+        if (mode === TimePicker.Mode.Hours) {
+            // modulo the hours value by __to because we want 60 (12) to be 0.
+            __value = hours * __getStepSize(mode) % __to
+        } else {
+            __value = minutes
+        }
+
+        __is24HourValueSelected = mode === TimePicker.Mode.Hours && hours >= 13
+    }
+
+    onModeChanged: __updateAfterModeOrTimeChange()
+
+    onIs24HourChanged: {
+        // Don't allow 24-hour values when we're not a 24-hour picker.
+        if (!is24Hour && hours > 12)
+            hours = 12
+    }
+
+    // Center dot.
+    Rectangle {
+        width: 6
+        height: 6
+        radius: width / 2
+        color: Material.primary
+        anchors.centerIn: parent
+        z: 1
+    }
+
+    Rectangle {
+        id: contentContainer
+        objectName: "contentContainer"
+        width: Math.min(parent.width, parent.height)
+        height: width
+        radius: width / 2
+        anchors.centerIn: parent
+        color: Material.theme === Material.Light ? "#eeeeee" : "#626262"
+
+        // Animate this so that we don't need an intermediate parent item for the
+        // labels to animate the opacity of that instead. That item would be required
+        // because we don't want to change the opacity of the contentContainer Rectangle.
+        property real labelOpacity: 1
+
+        function updateValueAfterPressPointChange() {
+            const y1 = height / 2
+            const x1 = width / 2
+            const y2 = tapHandler.point.position.y
+            const x2 = tapHandler.point.position.x
+            const yDistance = y2 - y1
+            const xDistance = x2 - x1
+            const angle = Math.atan2(yDistance, xDistance)
+
+            let angleInDegrees = (angle * (180 / Math.PI)) + 90.0
+            if (angleInDegrees < 0)
+                angleInDegrees = 360 + angleInDegrees
+
+            const normalisedAngle = angleInDegrees / 360.0
+            const rawValue = normalisedAngle * __to
+            // Snap to each step.
+            const steppedValue = Math.round(rawValue / __stepSize) * __stepSize
+            root.__value = steppedValue
+            // Account for the area where the angle wraps around from 360 to 0,
+            // otherwise values from 59.5 to 59.999[...] will register as 60 instead of 0.
+            if (rawValue > __to - __stepSize / 2)
+                root.__value = 0
+
+            const distanceFromCenter = Math.sqrt(Math.pow(xDistance, 2) + Math.pow(yDistance, 2))
+            // Only allow selecting 24 hour values when it's in the correct mode.
+            root.__is24HourValueSelected = root.is24Hour && root.__effectiveMode === TimePicker.Mode.Hours
+                && distanceFromCenter < distanceFromCenterForLabels(true) + selectionIndicator.height * 0.5
+        }
+
+        // Returns the distance from our center at which a label should be centered over given is24Hour.
+        function distanceFromCenterForLabels(is24Hour) {
+            return contentContainer.radius - (is24Hour
+                ? selectionIndicator.height * 1.5 : selectionIndicator.height * 0.5)
+        }
+
+        states: [
+            State {
+                name: "hours"
+                when: root.mode === TimePicker.Mode.Hours
+            },
+            State {
+                name: "minutes"
+                when: root.mode === TimePicker.Mode.Minutes
+            }
+        ]
+
+        transitions: [
+            Transition {
+                // When the picker isn't interactive (e.g. when a dialog is opening),
+                // we shouldn't animate the opacity of the labels, as it looks wrong,
+                // and should only happen when switching between modes while the
+                // picker was already visible.
+                enabled: root.interactive
+
+                SequentialAnimation {
+                    NumberAnimation {
+                        target: contentContainer
+                        property: "labelOpacity"
+                        from: 1
+                        to: 0
+                        duration: 100
+                    }
+
+                    ScriptAction {
+                        script: root.__effectiveMode = root.mode
+                    }
+
+                    NumberAnimation {
+                        target: contentContainer
+                        property: "labelOpacity"
+                        from: 0
+                        to: 1
+                        duration: 100
+                    }
+                }
+            },
+            Transition {
+                enabled: !root.interactive
+
+                // Since the transition above doesn't run when we're not interactive,
+                // we need to do the immediate property change here.
+                // See QTBUG-13268 for why we use a ScriptAction and not PropertyAction.
+                ScriptAction {
+                    script: root.__effectiveMode = root.mode
+                }
+            }
+
+        ]
+
+        TapHandler {
+            id: tapHandler
+            gesturePolicy: TapHandler.ReleaseWithinBounds
+            // Don't allow input while switching modes, or a click on an hour could go through to a minute.
+            enabled: root.interactive && root.__effectiveMode === root.mode
+
+            onPointChanged: {
+                if (pressed) {
+                    // Don't call this when not pressed, as the position will be invalid.
+                    contentContainer.updateValueAfterPressPointChange()
+
+                    // Update the value (like a "live" Slider) while the pointer position changes.
+                    if (mode === TimePicker.Mode.Hours) {
+                        root.hours = root.__value / root.__stepSize
+
+                        if (root.hours === 0) {
+                            // A value of 0 (when it's not a 24-hour picker) is 12.
+                            // When it is a 24-hour picker, it's 0.
+                            if (!root.__is24HourValueSelected)
+                                root.hours = 12
+                        } else if (root.__is24HourValueSelected) {
+                            root.hours += 12
+                        }
+                    } else {
+                        root.minutes = root.__value
+                    }
+                } else {
+                    // Select the value that was chosen in the press code above.
+                    if (mode === TimePicker.Mode.Hours) {
+                        mode = TimePicker.Mode.Minutes
+                    } else {
+                        // Does nothing in our example, but could be used to hide the dialog
+                        // if it didn't have an OK button to accept it.
+                        root.accepted()
+                    }
+                }
+            }
+        }
+
+        // The line connecting the center dot to the selection indicator.
+        Rectangle {
+            id: selectionArm
+            objectName: "selectionArm"
+            width: 2
+            height: contentContainer.distanceFromCenterForLabels(root.__is24HourValueSelected)
+            color: Material.primary
+            anchors.horizontalCenter: parent.horizontalCenter
+            anchors.bottom: parent.verticalCenter
+            rotation: root.__angleForValue(root.__value)
+            transformOrigin: Item.Bottom
+            antialiasing: true
+
+            Rectangle {
+                id: selectionIndicator
+                objectName: "selectionIndicator"
+                width: 40
+                height: 40
+                radius: width / 2
+                color: Material.primary
+                anchors.horizontalCenter: parent.horizontalCenter
+                anchors.verticalCenter: parent.top
+
+                Rectangle {
+                    width: 4
+                    height: 4
+                    radius: width / 2
+                    color: Material.color(Material.Indigo, Material.Shade100)
+                    anchors.centerIn: parent
+                    // Only show the circle within the indicator between minute labels.
+                    visible: root.__effectiveMode === TimePicker.Mode.Minutes
+                        && root.__value % 5 !== 0
+                }
+            }
+        }
+
+        Repeater {
+            id: labelRepeater
+            model: root.mode === TimePicker.Mode.Hours && root.is24Hour ? 24 : 12
+            delegate: Label {
+                id: labelDelegate
+                text: displayValue
+                font.pixelSize: Qt.application.font.pixelSize * (is24HourValue ? 0.85 : 1)
+                rotation: -rotationTransform.angle
+                opacity: contentContainer.labelOpacity
+                anchors.centerIn: parent
+
+                required property int index
+                // From 0 to 60.
+                readonly property int value: (index * 5) % root.__to
+                property int displayValue: root.__effectiveMode === TimePicker.Mode.Hours
+                    ? index === 0
+                       ? 12
+                       : index === 12
+                         ? 0
+                         : index
+                    : value
+                // The picker's current value can equal ours but we still might not be current -
+                // it depends on whether it's a 24 hour value or not.
+                readonly property bool current: root.__value === value && root.__is24HourValueSelected == is24HourValue
+                readonly property bool is24HourValue: index >= 12
+
+                Material.foreground: current
+                    // When the selection arm is over us, invert our color so it's legible.
+                    ? Material.color(Material.Indigo, Material.Shade100)
+                    : root.Material.theme === Material.Light
+                        ? is24HourValue ? "#686868" : "#484848"
+                        : Material.color(Material.Indigo, is24HourValue ? Material.Shade300 : Material.Shade100)
+
+                transform: [
+                    Translate {
+                        // We're already centered in our parent, so we can use this function
+                        // to determine our position, which doesn't need to be aware of our height -
+                        // it just needs to tell us where our center position should be.
+                        y: -contentContainer.distanceFromCenterForLabels(labelDelegate.is24HourValue)
+                    },
+                    Rotation {
+                        id: rotationTransform
+                        angle: root.__angleForValue(labelDelegate.value)
+                        origin.x: labelDelegate.width / 2
+                        origin.y: labelDelegate.height / 2
+                    }
+                ]
+            }
+        }
+    }
+}

TimePickerDialog.qml

@@ -0,0 +1,83 @@
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls.Material
+
+Dialog {
+    id: root
+    standardButtons: Dialog.Ok | Dialog.Cancel
+    closePolicy: Dialog.NoAutoClose
+    // We don't want so much space between the picker and dialog buttons.
+    bottomPadding: 8
+
+    property int hours: 12
+    property int minutes: 0
+    property alias is24Hour: timePicker.is24Hour
+
+    property int __initialHours
+    property int __initialMinutes
+
+    signal timeAccepted
+    signal timeRejected
+
+    function openWithMode(mode) {
+        timePicker.openWith(mode !== undefined ? mode : TimePicker.Mode.Hours, hours, minutes)
+
+        __initialHours = hours
+        __initialMinutes = minutes
+
+        open()
+    }
+
+    onAccepted: {
+        root.hours = timePicker.hours
+        root.minutes = timePicker.minutes
+        root.timeAccepted()
+    }
+    onRejected: {
+        hours = __initialHours
+        minutes = __initialMinutes
+        // Also reset the picker's time so that the onIs24HourChanged handler below works as expected.
+        timePicker.hours = __initialHours
+        timePicker.minutes = __initialMinutes
+        root.timeRejected()
+    }
+
+    // If is24Hour changes programmatically (only while we're not open),
+    // make sure we adapt to any possible clamping it did in the transition from 24 hours to 12.
+    onIs24HourChanged: {
+        if (!opened)
+            root.hours = timePicker.hours
+    }
+
+    ColumnLayout {
+        anchors.fill: parent
+        spacing: 12
+
+        TimePickerLabel {
+            id: timeLabel
+            // Use TimePicker's time, because that is updated live, whereas our values
+            // are only changed once we've been accepted.
+            time: new Date(1970, 1, 1, timePicker.hours, timePicker.minutes)
+            hoursActive: timePicker.mode === TimePicker.Mode.Hours
+            showAmPm: !timePicker.is24Hour
+
+            Layout.fillWidth: true
+            // Push us down a bit so we're not so close to the top of the dialog.
+            Layout.topMargin: 8
+
+            onHoursSelected: timePicker.mode = TimePicker.Mode.Hours
+            onMinutesSelected: timePicker.mode = TimePicker.Mode.Minutes
+        }
+
+        TimePicker {
+            id: timePicker
+            objectName: "timePicker"
+            // Our TapHandler may handle the click event on the Label if we don't do this,
+            // causing an hour to be inadvertently selected.
+            interactive: root.opened
+
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+        }
+    }
+}

TimePickerLabel.qml

@@ -0,0 +1,121 @@
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls.Material
+
+Item {
+    id: root
+    // Use TextMetrics' boundingRect.width rather than a RowLayout's implicitWidth
+    // because the latter can cause TimePickerDialog to jump around when the label text changes.
+    implicitWidth: fullTextMetrics.boundingRect.width + amPmLayout.implicitWidth + 80
+    implicitHeight: fullTextMetrics.boundingRect.height
+
+    property var time
+    property bool am: true
+    property bool showAmPm: true
+
+    property bool hoursActive: true
+
+    property int fontPixelSize: Qt.application.font.pixelSize * 4
+
+    signal hoursSelected
+    signal minutesSelected
+    signal amSelected
+    signal pmSelected
+
+    TextMetrics {
+        id: fullTextMetrics
+        font: hoursLabel.font
+        text: "99:99"
+    }
+
+    TextMetrics {
+        id: hourTextMetrics
+        font.family: hoursLabel.font.family
+        font.pixelSize: hoursLabel.fontInfo.pixelSize
+        text: "99"
+    }
+
+    TimeComponentLabel {
+        id: hoursLabel
+        objectName: "hoursLabel"
+        text: Qt.formatTime(root.time, "hh")
+        font.pixelSize: root.fontPixelSize
+        // Avoid any jumping around by using a dedicated TextMetrics object
+        // for our label too, and position ourselves based on its width.
+        x: colonLabel.x - hourTextMetrics.boundingRect.width - 4
+        anchors.verticalCenter: parent.verticalCenter
+        dim: !root.hoursActive
+
+        onTapped: root.hoursSelected()
+    }
+
+    TimeComponentLabel {
+        id: colonLabel
+        text: ":"
+        anchors.horizontalCenter: parent.horizontalCenter
+        anchors.verticalCenter: parent.verticalCenter
+        font.pixelSize: root.fontPixelSize
+        dim: true
+    }
+
+    TimeComponentLabel {
+        id: minutesLabel
+        objectName: "minutesLabel"
+        text: Qt.formatTime(root.time, "mm")
+        font.pixelSize: root.fontPixelSize
+        anchors.left: colonLabel.right
+        anchors.leftMargin: 4
+        anchors.verticalCenter: parent.verticalCenter
+        dim: root.hoursActive
+
+        onTapped: root.minutesSelected()
+    }
+
+    ColumnLayout {
+        id: amPmLayout
+        visible: root.showAmPm
+        // We also need to avoid the AM/PM label jumping around,
+        // so rather than anchor it to the right of the minutes label,
+        // we use colonLabel's horizontal center (which never changes), and fullTextMetrics.
+        anchors.left: colonLabel.horizontalCenter
+        anchors.leftMargin: fullTextMetrics.boundingRect.width / 2 + 12
+        anchors.verticalCenter: minutesLabel.verticalCenter
+
+        spacing: 0
+
+        ToolButton {
+            objectName: "amButton"
+            text: qsTr("AM")
+            autoExclusive: true
+
+            Material.foreground: Material.color(Material.Indigo,
+                root.am ? Material.Shade500 : Material.Shade100)
+
+            // Set the size explicitly to ensure that the buttons aren't too large.
+            // We also add 1 to the width because we want square ripple effects, not round.
+            Layout.preferredWidth: (implicitWidth * 0.7) + 1
+            Layout.preferredHeight: (implicitHeight * 0.7)
+
+            onClicked: {
+                root.am = true
+                root.amSelected()
+            }
+        }
+        ToolButton {
+            objectName: "pmButton"
+            text: qsTr("PM")
+            autoExclusive: true
+
+            Material.foreground: Material.color(Material.Indigo,
+                !root.am ? Material.Shade500 : Material.Shade100)
+
+            Layout.preferredWidth: (implicitWidth * 0.7) + 1
+            Layout.preferredHeight: (implicitHeight * 0.7)
+
+            onClicked: {
+                root.am = false
+                root.pmSelected()
+            }
+        }
+    }
+}

WiFiPage.qml

@@ -13,7 +13,7 @@ NavigationPage {
     GridLayout {
         columns: 2
 
-        Label {
+        Text {
             text: qsTr("Status:")
         }
 

i18n/qml_de.ts

@@ -544,20 +544,26 @@
         <translation>Ethernet</translation>
     </message>
     <message>
-        <location filename="../ConnectionPage.qml" line="32"/>
+        <location filename="../ConnectionPage.qml" line="39"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/ConnectionPage.qml" line="32"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/ConnectionPage.qml" line="39"/>
         <source>OCPP</source>
         <translation>OCPP</translation>
     </message>
     <message>
-        <location filename="../ConnectionPage.qml" line="39"/>
+        <location filename="../ConnectionPage.qml" line="32"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/ConnectionPage.qml" line="39"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/ConnectionPage.qml" line="32"/>
         <source>Cloud</source>
         <translation>Cloud</translation>
     </message>
     <message>
         <location filename="../ConnectionPage.qml" line="46"/>
         <location filename="../build/Desktop-Debug/EVChargerApp/ConnectionPage.qml" line="46"/>
+        <source>MQTT</source>
+        <translation>MQTT</translation>
+    </message>
+    <message>
+        <location filename="../ConnectionPage.qml" line="53"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/ConnectionPage.qml" line="53"/>
         <source>API Settings</source>
         <translation>API Einstellungen</translation>
     </message>
@@ -1379,6 +1385,51 @@
         <translation>Einstellungen</translation>
     </message>
 </context>
+<context>
+    <name>MqttPage</name>
+    <message>
+        <location filename="../MqttPage.qml" line="7"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/MqttPage.qml" line="7"/>
+        <source>MQTT</source>
+        <translation>MQTT</translation>
+    </message>
+    <message>
+        <location filename="../MqttPage.qml" line="21"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/MqttPage.qml" line="21"/>
+        <source>Trying to connect:</source>
+        <translation>Versuche zu verbinden:</translation>
+    </message>
+    <message>
+        <location filename="../MqttPage.qml" line="30"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/MqttPage.qml" line="30"/>
+        <source>Is connected:</source>
+        <translation>Ist verbunden:</translation>
+    </message>
+    <message>
+        <location filename="../MqttPage.qml" line="39"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/MqttPage.qml" line="39"/>
+        <source>Connected since:</source>
+        <translation>Verbunden seit:</translation>
+    </message>
+    <message>
+        <location filename="../MqttPage.qml" line="54"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/MqttPage.qml" line="54"/>
+        <source>Command Counter:</source>
+        <translation>Befehlszähler:</translation>
+    </message>
+    <message>
+        <location filename="../MqttPage.qml" line="63"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/MqttPage.qml" line="63"/>
+        <source>Last error:</source>
+        <translation>Letzer Fehler:</translation>
+    </message>
+    <message>
+        <location filename="../MqttPage.qml" line="73"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/MqttPage.qml" line="73"/>
+        <source>Last error age:</source>
+        <translation>Alter des letzten Fehlers:</translation>
+    </message>
+</context>
 <context>
     <name>NamePage</name>
     <message>
@@ -1407,11 +1458,113 @@
 <context>
     <name>OcppPage</name>
     <message>
-        <location filename="../OcppPage.qml" line="6"/>
+        <location filename="../OcppPage.qml" line="7"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="6"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="7"/>
         <source>OCPP</source>
         <translation>OCPP</translation>
     </message>
+    <message>
+        <location filename="../OcppPage.qml" line="21"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="21"/>
+        <source>Trying to connect:</source>
+        <translation>Versuche zu verbinden:</translation>
+    </message>
+    <message>
+        <location filename="../OcppPage.qml" line="30"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="30"/>
+        <source>Is connected:</source>
+        <translation>Ist verbunden:</translation>
+    </message>
+    <message>
+        <location filename="../OcppPage.qml" line="39"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="39"/>
+        <source>Connected since:</source>
+        <translation>Verbunden seit:</translation>
+    </message>
+    <message>
+        <location filename="../OcppPage.qml" line="54"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="54"/>
+        <source>Is accepted:</source>
+        <translation>Ist akzeptiert:</translation>
+    </message>
+    <message>
+        <location filename="../OcppPage.qml" line="63"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="63"/>
+        <source>Accepted since:</source>
+        <translation>Akzeptiert seit:</translation>
+    </message>
+    <message>
+        <location filename="../OcppPage.qml" line="78"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="78"/>
+        <source>Last error:</source>
+        <translation>Letzer Fehler:</translation>
+    </message>
+    <message>
+        <location filename="../OcppPage.qml" line="88"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="88"/>
+        <source>Last error age:</source>
+        <translation>Alter des letzten Fehlers:</translation>
+    </message>
+    <message>
+        <location filename="../OcppPage.qml" line="103"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="103"/>
+        <source>Chargepoint status:</source>
+        <translation>Chargepoint Status:</translation>
+    </message>
+    <message>
+        <location filename="../OcppPage.qml" line="117"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="117"/>
+        <source>Available</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../OcppPage.qml" line="118"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="118"/>
+        <source>Preparing</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../OcppPage.qml" line="119"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="119"/>
+        <source>Charging</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../OcppPage.qml" line="120"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="120"/>
+        <source>SuspendedEVSE</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../OcppPage.qml" line="121"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="121"/>
+        <source>SuspendedEV</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../OcppPage.qml" line="122"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="122"/>
+        <source>Finishing</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../OcppPage.qml" line="123"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="123"/>
+        <source>Reserved</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../OcppPage.qml" line="124"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="124"/>
+        <source>Unavailable</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../OcppPage.qml" line="125"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/OcppPage.qml" line="125"/>
+        <source>Faulted</source>
+        <translation type="unfinished"></translation>
+    </message>
 </context>
 <context>
     <name>PasswordPage</name>
@@ -1447,6 +1600,21 @@
         <translation type="vanished">Gerät %0</translation>
     </message>
 </context>
+<context>
+    <name>SchedulerDayPage</name>
+    <message>
+        <location filename="../SchedulerDayPage.qml" line="6"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SchedulerDayPage.qml" line="6"/>
+        <source>Scheduler day</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../SchedulerDayPage.qml" line="31"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SchedulerDayPage.qml" line="31"/>
+        <source>24 Hour</source>
+        <translation type="unfinished"></translation>
+    </message>
+</context>
 <context>
     <name>SchedulerPage</name>
     <message>
@@ -1455,6 +1623,98 @@
         <source>Scheduler</source>
         <translation>Ladetimer</translation>
     </message>
+    <message>
+        <location filename="../SchedulerPage.qml" line="25"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SchedulerPage.qml" line="25"/>
+        <source>About Schedule</source>
+        <translation>Über den Ladetimer</translation>
+    </message>
+    <message>
+        <location filename="../SchedulerPage.qml" line="32"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SchedulerPage.qml" line="32"/>
+        <source>Customize your charging routine on workdays, Saturdays, and Sundays. Define specific time slots for charging or blocking to perfectly align with your weekly schedule. Schedule can only start charging if all other functions like eco or access settings allow charging.</source>
+        <translation>Passe deine Laderoutine an Werktagen, Samstagen und Sonntagen an. Lege bestimmte Zeitfenster für das Aufladen oder Blockieren fest, um deinen Wochenplan perfekt abzustimmen. Der Ladevorgang kann nur gestartet werden, wenn alle anderen Funktionen wie Eco Modus oder Zugangskontrolle das Laden zulassen.</translation>
+    </message>
+    <message>
+        <location filename="../SchedulerPage.qml" line="54"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SchedulerPage.qml" line="54"/>
+        <source>Charging schedule</source>
+        <translation>Laden erlauben</translation>
+    </message>
+    <message>
+        <location filename="../SchedulerPage.qml" line="62"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SchedulerPage.qml" line="62"/>
+        <source>go-e Charger will exclusively charge your car during the time slots you set, and won&apos;t charge for the rest of the time.</source>
+        <translation>go-e Charger wird das Fahrzeug ausschließlich in den von dir eingestellten Zeitfenstern aufladen und in der restlichen Zeit nicht laden.</translation>
+    </message>
+    <message>
+        <location filename="../SchedulerPage.qml" line="85"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SchedulerPage.qml" line="85"/>
+        <source>Blocking schedule</source>
+        <translation>Laden blockieren</translation>
+    </message>
+    <message>
+        <location filename="../SchedulerPage.qml" line="93"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SchedulerPage.qml" line="93"/>
+        <source>go-e Charger will block charging your car during the time slots you set, but it will charge your car for the rest of the time.</source>
+        <translation>go-e Charger wird das Aufladen deines Fahrzeugs während des von dir eingestellten Zeitfensters verhindern. In der restlichen Zeit kann dein Auto geladen werden.</translation>
+    </message>
+    <message>
+        <location filename="../SchedulerPage.qml" line="102"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SchedulerPage.qml" line="102"/>
+        <source>Workdays</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../SchedulerPage.qml" line="109"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SchedulerPage.qml" line="109"/>
+        <source>Create workdays schedule</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../SchedulerPage.qml" line="116"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SchedulerPage.qml" line="116"/>
+        <source>Saturdays</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../SchedulerPage.qml" line="123"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SchedulerPage.qml" line="123"/>
+        <source>Create saturdays schedule</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../SchedulerPage.qml" line="130"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SchedulerPage.qml" line="130"/>
+        <source>Sundays</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../SchedulerPage.qml" line="137"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SchedulerPage.qml" line="137"/>
+        <source>Create sundays schedule</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <source>About eco</source>
+        <translation type="obsolete">Über Eco</translation>
+    </message>
+    <message>
+        <source>Flexible energy tariff</source>
+        <translation type="obsolete">Flexibler Energietarif</translation>
+    </message>
+    <message>
+        <source>We offer to charge your car during periods of low electricity price, If you have an electricity contract based on flexible energy tariffs.</source>
+        <translation type="obsolete">Du kannst dein Auto in Zeiten niedriger Strompreise aufladen, sofern du einen Stromvertrag mit flexiblen Tarifen hast.</translation>
+    </message>
+    <message>
+        <source>PV surplus energy</source>
+        <translation type="obsolete">PV-Überschuss</translation>
+    </message>
+    <message>
+        <source>By connecting a PV system and a controller to your charger, you can charge your EV particularly cheaply and use clean energy at the same time.</source>
+        <translation type="obsolete">Wenn du eine PV-Anlage und einen Controller an deinen Charger anschließt, kannst du dein Elektroauto besonders günstig aufladen und gleichzeitig grüne Energie nutzen.</translation>
+    </message>
 </context>
 <context>
     <name>SecurityPage</name>
@@ -1665,98 +1925,104 @@
         <translation>Kategorien</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="87"/>
+        <location filename="../SettingsTabPage.qml" line="92"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="87"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="92"/>
         <source>Wi-Fi</source>
         <translation>WLAN</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="88"/>
+        <location filename="../SettingsTabPage.qml" line="93"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="88"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="93"/>
         <source>Hotspot</source>
         <translation>Hotspot</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="89"/>
+        <location filename="../SettingsTabPage.qml" line="94"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="89"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="94"/>
         <source>Ethernet</source>
         <translation>Ethernet</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="90"/>
+        <location filename="../SettingsTabPage.qml" line="96"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="90"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="96"/>
         <source>OCPP</source>
         <translation>OCPP</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="91"/>
+        <location filename="../SettingsTabPage.qml" line="95"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="91"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="95"/>
         <source>Cloud</source>
         <translation>Cloud</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="92"/>
+        <location filename="../SettingsTabPage.qml" line="97"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="92"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="97"/>
+        <source>MQTT</source>
+        <translation>MQTT</translation>
+    </message>
+    <message>
+        <location filename="../SettingsTabPage.qml" line="98"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="98"/>
         <source>API Settings</source>
         <translation>API Einstellungen</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="116"/>
+        <location filename="../SettingsTabPage.qml" line="122"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="116"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="122"/>
         <source>Name</source>
         <translation>Name</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="117"/>
+        <location filename="../SettingsTabPage.qml" line="123"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="117"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="123"/>
         <source>Switch Language</source>
         <translation>Sprache ändern</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="118"/>
+        <location filename="../SettingsTabPage.qml" line="124"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="118"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="124"/>
         <source>Notifications</source>
         <translation>Benachrichtigungen</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="119"/>
+        <location filename="../SettingsTabPage.qml" line="125"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="119"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="125"/>
         <source>Date and time</source>
         <translation>Datum und Uhrzeit</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="120"/>
+        <location filename="../SettingsTabPage.qml" line="126"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="120"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="126"/>
         <source>LED</source>
         <translation>LED</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="121"/>
+        <location filename="../SettingsTabPage.qml" line="127"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="121"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="127"/>
         <source>Controller</source>
         <translation>Controller</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="122"/>
+        <location filename="../SettingsTabPage.qml" line="128"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="122"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="128"/>
         <source>Display settings</source>
         <translation>Display</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="130"/>
+        <location filename="../SettingsTabPage.qml" line="136"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="130"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="136"/>
         <source>Firmware</source>
         <translation>Firmware</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="131"/>
+        <location filename="../SettingsTabPage.qml" line="137"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="131"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="137"/>
         <source>Hardware information</source>
         <translation>Hardwareinformationen</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="132"/>
+        <location filename="../SettingsTabPage.qml" line="138"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="132"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="138"/>
         <source>Licenses</source>
         <translation>Lizenzen</translation>
     </message>
@@ -1785,8 +2051,8 @@
         <translation type="vanished">Sensoren • Kategorien</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="85"/>
+        <location filename="../SettingsTabPage.qml" line="90"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="85"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="90"/>
         <source>Connection</source>
         <translation>Verbindung</translation>
     </message>
@@ -1795,8 +2061,8 @@
         <translation type="vanished">WLAN • Hotspot • OCPP • API Einstellungen</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="114"/>
+        <location filename="../SettingsTabPage.qml" line="120"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="114"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="120"/>
         <source>General</source>
         <translation>Allgemein</translation>
     </message>
@@ -1805,8 +2071,8 @@
         <translation type="vanished">Name • Sprache ändern • Benachrichtigungen • Datum und Uhrzeit • LED • Controller</translation>
     </message>
     <message>
-        <location filename="../SettingsTabPage.qml" line="128"/>
+        <location filename="../SettingsTabPage.qml" line="134"/>
-        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="128"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/SettingsTabPage.qml" line="134"/>
         <source>About</source>
         <translation>Über</translation>
     </message>
@@ -1824,6 +2090,21 @@
         <translation>Sprache ändern</translation>
     </message>
 </context>
+<context>
+    <name>TimePickerLabel</name>
+    <message>
+        <location filename="../TimePickerLabel.qml" line="88"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/TimePickerLabel.qml" line="88"/>
+        <source>AM</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../TimePickerLabel.qml" line="106"/>
+        <location filename="../build/Desktop-Debug/EVChargerApp/TimePickerLabel.qml" line="106"/>
+        <source>PM</source>
+        <translation type="unfinished"></translation>
+    </message>
+</context>
 <context>
     <name>WiFiErrorsPage</name>
     <message>

qmldir

@@ -53,13 +53,19 @@ EVChargerApp 1.0 PasswordPage.qml
 EVChargerApp 1.0 PvSurplusPage.qml
 EVChargerApp 1.0 RebootPage.qml
 EVChargerApp 1.0 RequestStatusText.qml
+EVChargerApp 1.0 SchedulerDayPage.qml
 EVChargerApp 1.0 SchedulerPage.qml
 EVChargerApp 1.0 SecurityPage.qml
 EVChargerApp 1.0 SelectLogicModeItem.qml
 EVChargerApp 1.0 SensorsConfigurationPage.qml
 EVChargerApp 1.0 SetPriceLimitPage.qml
 EVChargerApp 1.0 SettingsTabPage.qml
+EVChargerApp 1.0 SimpleNavigationItem.qml
 EVChargerApp 1.0 SwitchLanguagePage.qml
+EVChargerApp 1.0 TimeComponentLabel.qml
+EVChargerApp 1.0 TimePickerDialog.qml
+EVChargerApp 1.0 TimePickerLabel.qml
+EVChargerApp 1.0 TimePicker.qml
 EVChargerApp 1.0 VerticalTabButton.qml
 EVChargerApp 1.0 WhiteBox.qml
 EVChargerApp 1.0 WiFiErrorsPage.qml