diff --git a/qml/qml.qrc b/qml/qml.qrc index 36918d1da..471c18300 100644 --- a/qml/qml.qrc +++ b/qml/qml.qrc @@ -87,5 +87,7 @@ ui/widgets/GroundPowerWidgetForm.ui.qml ui/GroundPiSettingsPresetView.ui.qml ui/PresetMap.qml + ui/elements/ColoredCheckboxForm.ui.qml + ui/elements/ColoredCheckbox.qml diff --git a/qml/ui/StatusPanelForm.ui.qml b/qml/ui/StatusPanelForm.ui.qml index 626aab461..1023bc3f9 100644 --- a/qml/ui/StatusPanelForm.ui.qml +++ b/qml/ui/StatusPanelForm.ui.qml @@ -1,6 +1,7 @@ import QtQuick 2.12 import QtQuick.Controls 2.12 import QtQuick.Layouts 1.12 +import QtCharts 2.3 import Qt.labs.settings 1.0 @@ -8,117 +9,267 @@ import OpenHD 1.0 import "../ui" as Ui +import "../ui/elements" + Rectangle { id: element2 width: 504 height: 300 - GroupBox { - title: qsTr("OpenHD Telemetry") - id: openhd_box + Label { + id: ohdLabel + color: "black" + text: "Last openhd telemetry: " + (openHDTelemetry.last_heartbeat !== undefined ? openHDTelemetry.last_heartbeat : "N/A") + font.pixelSize: 12 + anchors.bottom: parent.bottom + anchors.left: parent.left + anchors.bottomMargin: 12 + anchors.leftMargin: 12 + + z: 1.1 + } - width: (parent.width / 2) - 48 + Label { + id: mavLabel + color: "black" + text: "Last mavlink heartbeat: " + (mavlinkTelemetry.last_heartbeat !== undefined ? mavlinkTelemetry.last_heartbeat : "N/A") + font.pixelSize: 12 + anchors.bottom: parent.bottom + anchors.right: parent.right + anchors.bottomMargin: 12 + anchors.rightMargin: 12 - anchors.top: parent.top - anchors.topMargin: 24 - anchors.left: parent.left - anchors.leftMargin: 24 - - background: Rectangle { - y: openhd_box.topPadding - openhd_box.bottomPadding - width: parent.width - height: parent.height - openhd_box.topPadding + openhd_box.bottomPadding - color: "transparent" - border.color: "black" - radius: 2 + z: 1.1 + } + + + GridLayout { + id: topRow + columnSpacing: 0 + rowSpacing: 0 + + anchors { + top: parent.top + topMargin: 6 + left: parent.left + leftMargin: 12 + right: parent.right + rightMargin: 12 + } + + //Column { + ColoredCheckbox { + padding: 0 + Layout.row: 0 + Layout.column: 0 + text: "Air CPU" + boxColor: airCPUAxis.color + checked: airCPUAxis.visible + onCheckedChanged: airCPUAxis.visible = checked + } + + ColoredCheckbox { + padding: 0 + Layout.row: 0 + Layout.column: 1 + text: "Air Temp" + boxColor: airTempAxis.color + checked: airTempAxis.visible + onCheckedChanged: airTempAxis.visible = checked + } + + //} + + //Column { + ColoredCheckbox { + padding: 0 + Layout.row: 0 + Layout.column: 2 + text: "Ground CPU" + boxColor: gndCPUAxis.color + checked: gndCPUAxis.visible + onCheckedChanged: gndCPUAxis.visible = checked + } + ColoredCheckbox { + padding: 0 + Layout.row: 1 + Layout.column: 0 + text: "Ground Temp" + boxColor: gndTempAxis.color + checked: gndTempAxis.visible + onCheckedChanged: gndTempAxis.visible = checked + } + //} + + //Column { + ColoredCheckbox { + padding: 0 + Layout.row: 1 + Layout.column: 1 + text: "Lost Packets" + boxColor: lostPacketAxis.color + checked: lostPacketAxis.visible + onCheckedChanged: lostPacketAxis.visible = checked + } + + ColoredCheckbox { + padding: 0 + Layout.row: 1 + Layout.column: 2 + text: "Damaged Blocks" + boxColor: damagedBlockAxis.color + checked: damagedBlockAxis.visible + onCheckedChanged: damagedBlockAxis.visible = checked + } + //} + } + + ChartView { + id: chart + legend.visible: false + + anchors { + top: topRow.bottom + topMargin: 0 + left: parent.left + right: parent.right + bottom: parent.bottom } - label: Label { - x: openhd_box.leftPadding - width: openhd_box.availableWidth - text: openhd_box.title + antialiasing: true + + + property int chartData: 0 + + + property int lostPacketsLast: 0 + property int lostPacketsMax: 0 + + property int damagedBlocksLast: 0 + property int damagedBlocksMax: 0 + + ValueAxis { + id: valueAxis + min: 0 + max: 300 + labelsVisible: false color: "black" - elide: Text.ElideRight - font.pixelSize: 12 } - Label { + ValueAxis { + id: tempYAxis + min: 0 + max: 100 + labelFormat: "%d°C" + tickCount: 11 color: "black" - text: "last heartbeat: " + (openHDTelemetry.last_heartbeat !== undefined ? openHDTelemetry.last_heartbeat : "N/A") - font.pixelSize: 12 } - } + ValueAxis { + id: countYAxis + min: 0 + max: 100 + tickCount: 11 + labelFormat: "%d" + color: "black" + } - GroupBox { - title: qsTr("Mavlink") - id: mavlink_box + LineSeries { + id: airCPUAxis + name: "Air CPU" + axisX: valueAxis + axisY: countYAxis + color: "green" + width: 2 + useOpenGL: true + } - width: (parent.width / 2) - 48 + LineSeries { + id: gndCPUAxis + name: "Ground CPU" + axisX: valueAxis + axisY: countYAxis + color: "blue" + width: 2 + useOpenGL: true + } - anchors.top: parent.top - anchors.topMargin: 24 - anchors.left: openhd_box.right - anchors.leftMargin: 24 + LineSeries { + id: gndTempAxis + name: "Ground Temp" + axisX: valueAxis + axisYRight: tempYAxis + color: "red" + width: 2 + useOpenGL: true + } - background: Rectangle { - y: mavlink_box.topPadding - mavlink_box.bottomPadding - width: parent.width - height: parent.height - mavlink_box.topPadding + mavlink_box.bottomPadding - color: "transparent" - border.color: "black" - radius: 2 + LineSeries { + id: airTempAxis + name: "Air Temp" + axisX: valueAxis + axisYRight: tempYAxis + color: "orange" + width: 2 + useOpenGL: true } - label: Label { - x: mavlink_box.leftPadding - width: mavlink_box.availableWidth - text: mavlink_box.title - color: "black" - elide: Text.ElideRight - font.pixelSize: 12 + LineSeries { + id: lostPacketAxis + name: "Lost Packets" + axisX: valueAxis + axisY: countYAxis + color: "purple" + width: 2 + useOpenGL: true } - Label { - color: "black" - text: "last heartbeat: " + (mavlinkTelemetry.last_heartbeat !== undefined ? mavlinkTelemetry.last_heartbeat : "N/A") - font.pixelSize: 12 + LineSeries { + id: damagedBlockAxis + name: "Damaged Blocks" + axisX: valueAxis + axisY: countYAxis + color: "brown" + width: 2 + useOpenGL: true } - } + Connections { + target: OpenHD - /* - Rectangle { - id: gamepadRow - height: 32 - Layout.leftMargin: 0 - width: parent.width - - Layout.fillWidth: true - Layout.rowSpan: 1 - Layout.columnSpan: 8 - - Text { - id: gamepadText - width: 192 - height: parent.height - font.bold: true - text: qsTr("Connected gamepad:") - anchors.left: parent.left - anchors.leftMargin: 12 - verticalAlignment: Text.AlignVCenter - } + onLost_packet_cnt_changed: { + if (chart.lostPacketsLast != 0) { + var lostPacketsDifference = OpenHD.lost_packet_cnt - chart.lostPacketsLast; + lostPacketAxis.append(chart.chartData, lostPacketsDifference); + } + chart.lostPacketsLast = OpenHD.lost_packet_cnt; + + if (chart.damagedBlocksLast != 0) { + var damagedBlocksDifference = OpenHD.damaged_block_cnt - chart.damagedBlocksLast; + damagedBlockAxis.append(chart.chartData, damagedBlocksDifference); + } + chart.damagedBlocksLast = OpenHD.damaged_block_cnt; - Text { - id: gamepadValue - width: 128 - height: parent.height - text: openHDRC.selectedGamepadName !== undefined ? openHDRC.selectedGamepadName : "N/A" - horizontalAlignment: Text.AlignRight - anchors.rightMargin: 12 - anchors.right: parent.right - elide: Text.ElideRight - verticalAlignment: Text.AlignVCenter + airCPUAxis.append(chart.chartData, OpenHD.cpuload_air); + gndCPUAxis.append(chart.chartData, OpenHD.cpuload_gnd); + airTempAxis.append(chart.chartData, OpenHD.temp_air); + gndTempAxis.append(chart.chartData, OpenHD.temp_gnd); + + chart.chartData++; + + if (chart.chartData > 300) { + valueAxis.min++; + valueAxis.max++; + + lostPacketAxis.remove(1); + damagedBlockAxis.remove(1); + + airCPUAxis.remove(1); + gndCPUAxis.remove(1); + airTempAxis.remove(1); + gndTempAxis.remove(1); + } } - }*/ + } + } } diff --git a/qml/ui/elements/ColoredCheckbox.qml b/qml/ui/elements/ColoredCheckbox.qml new file mode 100644 index 000000000..493428abe --- /dev/null +++ b/qml/ui/elements/ColoredCheckbox.qml @@ -0,0 +1,7 @@ +import QtQuick 2.12 + +ColoredCheckboxForm { + property color boxColor: "blue" + +} + diff --git a/qml/ui/elements/ColoredCheckboxForm.ui.qml b/qml/ui/elements/ColoredCheckboxForm.ui.qml new file mode 100644 index 000000000..af114374f --- /dev/null +++ b/qml/ui/elements/ColoredCheckboxForm.ui.qml @@ -0,0 +1,53 @@ +import QtQuick 2.12 +import QtQuick.Controls 2.12 +import QtQuick.Layouts 1.12 +import QtGraphicalEffects 1.12 + +CheckBox { + id: el + + contentItem: Text { + text: el.text + font: el.font + color: "black" + verticalAlignment: Text.AlignVCenter + leftPadding: el.indicator.width + el.spacing + } + + indicator: Rectangle { + implicitWidth: 20 + implicitHeight: 20 + x: el.leftPadding + y: parent.height / 2 - height / 2 + radius: 3 + color: "#00000000" + border.color: boxColor + border.width: 3 + + Rectangle { + width: 16 + height: 15 + x: 2 + y: 2 + radius: 0 + color: boxColor + visible: el.checked + } + + Text { + id: checkMark + width: 14 + height: 14 + color: "#ffffff" + text: "\uf00c" + anchors.fill: parent + verticalAlignment: Text.AlignVCenter + horizontalAlignment: Text.AlignHCenter + font.family: "Font Awesome 5 Free" + styleColor: "#ffffff" + font.pixelSize: 14 + visible: el.checked + } + } +} + diff --git a/src/main.cpp b/src/main.cpp index 9f5f8e383..e64639217 100755 --- a/src/main.cpp +++ b/src/main.cpp @@ -1,4 +1,4 @@ -#include +#include #include #include #include @@ -47,7 +47,7 @@ const QVector permissions({"android.permission.INTERNET", int main(int argc, char *argv[]) { QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling); - QGuiApplication app(argc, argv); + QApplication app(argc, argv); QCoreApplication::setOrganizationName("Open.HD"); QCoreApplication::setOrganizationDomain("open.hd");