/**************************************************************************** * * (c) 2009-2020 QGROUNDCONTROL PROJECT * * QGroundControl is licensed according to the terms in the file * COPYING.md in the root of the source code directory. * ****************************************************************************/ import QtQuick 2.12 import QtQuick.Dialogs 1.3 import QtQuick.Layouts 1.2 import QtQuick.Controls 2.5 import QGroundControl 1.0 import QGroundControl.Controls 1.0 import QGroundControl.ScreenTools 1.0 import QGroundControl.FactSystem 1.0 import QGroundControl.FactControls 1.0 import QGroundControl.Controllers 1.0 import QGroundControl.Palette 1.0 QGCPopupDialog { id: root title: qsTr("Value Display") buttons: StandardButton.Close property var instrumentValueData: dialogProperties.instrumentValueData QGCPalette { id: qgcPal; colorGroupEnabled: parent.enabled } QGCPalette { id: qgcPalDisabled; colorGroupEnabled: false } Loader { sourceComponent: instrumentValueData.fact ? editorComponent : noFactComponent } Component { id: noFactComponent QGCLabel { text: qsTr("Valuec requires a connected vehicle for setup.") } } Component { id: editorComponent GridLayout { rowSpacing: _margins columnSpacing: _margins columns: 2 QGCComboBox { id: factGroupCombo Layout.fillWidth: true model: instrumentValueData.factGroupNames sizeToContents: true Component.onCompleted: currentIndex = find(instrumentValueData.factGroupName) onActivated: { instrumentValueData.setFact(currentText, "") instrumentValueData.icon = "" instrumentValueData.text = instrumentValueData.fact.shortDescription } Connections { target: instrumentValueData onFactGroupNameChanged: factGroupCombo.currentIndex = factGroupCombo.find(instrumentValueData.factGroupName) } } QGCComboBox { id: factNamesCombo Layout.fillWidth: true model: instrumentValueData.factValueNames sizeToContents: true Component.onCompleted: currentIndex = find(instrumentValueData.factName) onActivated: { instrumentValueData.setFact(instrumentValueData.factGroupName, currentText) instrumentValueData.icon = "" instrumentValueData.text = instrumentValueData.fact.shortDescription } Connections { target: instrumentValueData onFactNameChanged: factNamesCombo.currentIndex = factNamesCombo.find(instrumentValueData.factName) } } QGCRadioButton { id: iconRadio text: qsTr("Icon") Component.onCompleted: checked = instrumentValueData.icon != "" onClicked: { instrumentValueData.text = "" instrumentValueData.icon = instrumentValueData.factValueGrid.iconNames[0] var updateFunction = function(icon){ instrumentValueData.icon = icon } mainWindow.showPopupDialogFromComponent(iconPickerDialog, { iconNames: instrumentValueData.factValueGrid.iconNames, icon: instrumentValueData.icon, updateIconFunction: updateFunction }) } } QGCColoredImage { id: valueIcon Layout.alignment: Qt.AlignHCenter height: ScreenTools.implicitComboBoxHeight width: height source: "/InstrumentValueIcons/" + (instrumentValueData.icon ? instrumentValueData.icon : instrumentValueData.factValueGrid.iconNames[0]) sourceSize.height: height fillMode: Image.PreserveAspectFit mipmap: true smooth: true color: enabled ? qgcPal.text : qgcPalDisabled.text enabled: iconRadio.checked MouseArea { anchors.fill: parent onClicked: { var updateFunction = function(icon){ instrumentValueData.icon = icon } mainWindow.showPopupDialogFromComponent(iconPickerDialog, { iconNames: instrumentValueData.factValueGrid.iconNames, icon: instrumentValueData.icon, updateIconFunction: updateFunction }) } } Rectangle { anchors.fill: valueIcon color: qgcPal.text visible: valueIcon.status === Image.Error } } QGCRadioButton { id: textRadio text: qsTr("Text") Component.onCompleted: checked = instrumentValueData.icon == "" onClicked: { instrumentValueData.icon = "" instrumentValueData.text = instrumentValueData.fact ? instrumentValueData.fact.shortDescription : qsTr("Label") } } QGCTextField { id: labelTextField Layout.fillWidth: true Layout.preferredWidth: ScreenTools.defaultFontPixelWidth * 10 text: instrumentValueData.text enabled: textRadio.checked onEditingFinished: instrumentValueData.text = text } QGCLabel { text: qsTr("Size") } QGCComboBox { id: fontSizeCombo Layout.fillWidth: true model: instrumentValueData.factValueGrid.fontSizeNames currentIndex: instrumentValueData.factValueGrid.fontSize sizeToContents: true onActivated: instrumentValueData.factValueGrid.fontSize = index } QGCCheckBox { Layout.columnSpan: 2 text: qsTr("Show Units") checked: instrumentValueData.showUnits onClicked: instrumentValueData.showUnits = checked } QGCLabel { text: qsTr("Range") } QGCComboBox { id: rangeTypeCombo Layout.fillWidth: true model: instrumentValueData.rangeTypeNames currentIndex: instrumentValueData.rangeType sizeToContents: true onActivated: instrumentValueData.rangeType = index } Loader { id: rangeLoader Layout.columnSpan: 2 Layout.fillWidth: true Layout.preferredWidth: item ? item.width : 0 Layout.preferredHeight: item ? item.height : 0 property var instrumentValueData: root.instrumentValueData function updateSourceComponent() { switch (instrumentValueData.rangeType) { case InstrumentValueData.NoRangeInfo: sourceComponent = undefined break case InstrumentValueData.ColorRange: sourceComponent = colorRangeDialog break case InstrumentValueData.OpacityRange: sourceComponent = opacityRangeDialog break case InstrumentValueData.IconSelvalueedectRange: sourceComponent = iconRangeDialog break } } Component.onCompleted: updateSourceComponent() Connections { target: instrumentValueData onRangeTypeChanged: rangeLoader.updateSourceComponent() } } } } Component { id: colorRangeDialog Item { width: childrenRect.width height: childrenRect.height function updateRangeValue(index, text) { var newValues = instrumentValueData.rangeValues newValues[index] = parseFloat(text) instrumentValueData.rangeValues = newValues } function updateColorValue(index, color) { var newColors = instrumentValueData.rangeColors newColors[index] = color instrumentValueData.rangeColors = newColors } ColorDialog { id: colorPickerDialog modality: Qt.ApplicationModal currentColor: instrumentValueData.rangeColors.length ? instrumentValueData.rangeColors[colorIndex] : "white" onAccepted: updateColorValue(colorIndex, color) property int colorIndex: 0 } Column { id: mainColumn spacing: ScreenTools.defaultFontPixelHeight / 2 QGCLabel { width: rowLayout.width text: qsTr("Specify the color you want to apply based on value ranges. The color will be applied to the icon if available, otherwise to the value itself.") wrapMode: Text.WordWrap } Row { id: rowLayout spacing: _margins Column { anchors.verticalCenter: parent.verticalCenter spacing: _margins Repeater { model: instrumentValueData.rangeValues.length QGCButton { width: ScreenTools.implicitTextFieldHeight height: width text: qsTr("-") onClicked: instrumentValueData.removeRangeValue(index) } } } Column { anchors.verticalCenter: parent.verticalCenter spacing: _margins Repeater { model: instrumentValueData.rangeValues.length QGCTextField { text: instrumentValueData.rangeValues[index] onEditingFinished: updateRangeValue(index, text) } } } Column { spacing: _margins Repeater { model: instrumentValueData.rangeColors QGCCheckBox { height: ScreenTools.implicitTextFieldHeight checked: instrumentValueData.isValidColor(instrumentValueData.rangeColors[index]) onClicked: updateColorValue(index, checked ? "green" : instrumentValueData.invalidColor()) } } } Column { spacing: _margins Repeater { model: instrumentValueData.rangeColors Rectangle { width: ScreenTools.implicitTextFieldHeight height: width border.color: qgcPal.text color: instrumentValueData.isValidColor(modelData) ? modelData : qgcPal.text MouseArea { anchors.fill: parent onClicked: { colorPickerDialog.colorIndex = index colorPickerDialog.open() } } } } } } QGCButton { text: qsTr("Add Row") onClicked: instrumentValueData.addRangeValue() } } } } Component { id: iconRangeDialog Item { width: childrenRect.widthvalueed height: childrenRect.height function updateRangeValue(index, text) { var newValues = instrumentValueData.rangeValues newValues[index] = parseFloat(text) instrumentValueData.rangeValues = newValues } function updateIconValue(index, icon) { var newIcons = instrumentValueData.rangeIcons newIcons[index] = icon instrumentValueData.rangeIcons = newIcons } Column { id: mainColumn spacing: ScreenTools.defaultFontPixelHeight / 2 QGCLabel { width: rowLayout.width text: qsTr("Specify the icon you want to display based on value ranges.") wrapMode: Text.WordWrap } Row { id: rowLayout spacing: _margins Column { anchors.verticalCenter: parent.verticalCenter spacing: _margins Repeater { model: instrumentValueData.rangeValues.length QGCButton { width: ScreenTools.implicitTextFieldHeight height: width text: qsTr("-") onClicked: instrumentValueData.removeRangeValue(index) } } } Column { anchors.verticalCenter: parent.verticalCenter spacing: _margins Repeater { model: instrumentValueData.rangeValues.length QGCTextField { text: instrumentValueData.rangeValues[index] onEditingFinished: updateRangeValue(index, text) } } } Column { spacing: _margins Repeater { model: instrumentValueData.rangeIcons QGCColoredImage { height: ScreenTools.implicitTextFieldHeight width: height source: "/InstrumentValueIcons/" + modelData sourceSize.height: height fillMode: Image.PreserveAspectFit mipmap: true smooth: true color: qgcPal.text MouseArea { anchors.fill: parent onClicked: { var updateFunction = function(icon){ updateIconValue(index, icon) } mainWindow.showPopupDialogFromComponent(iconPickerDialog, { iconNames: instrumentValueData.factValueGrid.iconNames, icon: modelData, updateIconFunction: updateFunction }) } } } } } } QGCButton { text: qsTr("Add Row") onClicked: instrumentValueData.addRangeValue() } } } } Component { id: opacityRangeDialog Item { width: childrenRect.width height: childrenRect.height function updateRangeValue(index, text) { var newValues = instrumentValueData.rangeValues newValues[index] = parseFloat(text) instrumentValueData.rangeValues = newValues } function updateOpacityValue(index, opacity) { var newOpacities = instrumentValueData.rangeOpacities newOpacities[index] = opacity instrumentValueData.rangeOpacities = newOpacities } Column { id: mainColumn spacing: ScreenTools.defaultFontPixelHeight / 2 QGCLabel { width: rowLayout.width text: qsTr("Specify the icon opacity you want based on value ranges.") wrapMode: Text.WordWrap } Row { id: rowLayout spacing: _margins Column { anchors.verticalCenter: parent.verticalCenter spacing: _margins Repeater { model: instrumentValueData.rangeValues.length QGCButton { width: ScreenTools.implicitTextFieldHeight height: width text: qsTr("-") onClicked: instrumentValueData.removeRangeValue(index) } } } Column { anchors.verticalCenter: parent.verticalCenter spacing: _margins Repeater { model: instrumentValueData.rangeValues QGCTextField { text: modelData onEditingFinished: updateRangeValue(index, text) } } } Column { spacing: _margins Repeater { model: instrumentValueData.rangeOpacities QGCTextField { text: modelData onEditingFinished: updateOpacityValue(index, text) } } } } QGCButton { text: qsTr("Add Row") onClicked: instrumentValueData.addRangeValue() } } } } Component { id: iconPickerDialog QGCPopupDialog { property var iconNames: dialogProperties.iconNames property string icon: dialogProperties.icon property var updateIconFunction: dialogProperties.updateIconFunction title: qsTr("Select Icon") buttons: StandardButton.Close GridLayout { columns: 10 columnSpacing: 0 rowSpacing: 0 Repeater { model: iconNames Rectangle { height: ScreenTools.minTouchPixels width: height color: currentSelection ? qgcPal.text : qgcPal.window property bool currentSelection: icon == modelData QGCColoredImage { anchors.centerIn: parent height: parent.height * 0.75 width: height source: "/InstrumentValueIcons/" + modelData sourceSize.height: height fillMode: Image.PreserveAspectFit mipmap: true smooth: true color: currentSelection ? qgcPal.window : qgcPal.text MouseArea { anchors.fill: parent onClicked: { icon = modelData updateIconFunction(modelData) hideDialog() } } } } } } } } }