Index: denali.pro.user =================================================================== diff -u -r9a0581274e4dc51af6d6f3e4dd932581e8dce445 -r99e12314855a6b8dd46989b9c0e5263b74af5dc4 --- denali.pro.user (.../denali.pro.user) (revision 9a0581274e4dc51af6d6f3e4dd932581e8dce445) +++ denali.pro.user (.../denali.pro.user) (revision 99e12314855a6b8dd46989b9c0e5263b74af5dc4) @@ -1,6 +1,6 @@ - + EnvironmentId Index: denali.qrc =================================================================== diff -u -r9a0581274e4dc51af6d6f3e4dd932581e8dce445 -r99e12314855a6b8dd46989b9c0e5263b74af5dc4 --- denali.qrc (.../denali.qrc) (revision 9a0581274e4dc51af6d6f3e4dd932581e8dce445) +++ denali.qrc (.../denali.qrc) (revision 99e12314855a6b8dd46989b9c0e5263b74af5dc4) @@ -72,6 +72,10 @@ sources/gui/qml/components/DebugDataColumn.qml sources/gui/qml/components/RangeSlider.qml + + sources/gui/qml/compounds/PressureRangeSlider.qml + + qtquickcontrols2.conf sources/gui/qml/main.qml Index: sources/gui/qml/components/RangeBar.qml =================================================================== diff -u -r9a0581274e4dc51af6d6f3e4dd932581e8dce445 -r99e12314855a6b8dd46989b9c0e5263b74af5dc4 --- sources/gui/qml/components/RangeBar.qml (.../RangeBar.qml) (revision 9a0581274e4dc51af6d6f3e4dd932581e8dce445) +++ sources/gui/qml/components/RangeBar.qml (.../RangeBar.qml) (revision 99e12314855a6b8dd46989b9c0e5263b74af5dc4) @@ -33,7 +33,7 @@ property alias rangebar : _rangeRect property int markerHeight: Variables.rangeMarkerHeightMidle - property color markerColor : markerOutRangeNotify ? (value > lowerBound && value < upperBound ? Colors.rangeMarker : Colors.red) : Colors.rangeMarker + property color markerColor : markerOutRangeNotify ? (value >= lowerBound && value <= upperBound ? Colors.rangeMarker : Colors.red) : Colors.rangeMarker property bool markerOutRangeNotify: false property bool markerVisible : true Index: sources/gui/qml/components/RangeSlider.qml =================================================================== diff -u -r9a0581274e4dc51af6d6f3e4dd932581e8dce445 -r99e12314855a6b8dd46989b9c0e5263b74af5dc4 --- sources/gui/qml/components/RangeSlider.qml (.../RangeSlider.qml) (revision 9a0581274e4dc51af6d6f3e4dd932581e8dce445) +++ sources/gui/qml/components/RangeSlider.qml (.../RangeSlider.qml) (revision 99e12314855a6b8dd46989b9c0e5263b74af5dc4) @@ -100,7 +100,7 @@ } function getXOfValue(vValue) { - return ((vValue - minimum) * width)/( maximum - minimum ) + return ( ( vValue - minimum ) * width ) / ( maximum - minimum ) } /// Index: sources/gui/qml/compounds/PressureRangeSlider.qml =================================================================== diff -u --- sources/gui/qml/compounds/PressureRangeSlider.qml (revision 0) +++ sources/gui/qml/compounds/PressureRangeSlider.qml (revision 99e12314855a6b8dd46989b9c0e5263b74af5dc4) @@ -0,0 +1,160 @@ +import QtQuick 2.0 + +/*! + * + * Copyright (c) 2019-2020 Diality Inc. - All Rights Reserved. + * \copyright + * THIS CODE MAY NOT BE COPIED OR REPRODUCED IN ANY FORM, IN PART OR IN + * WHOLE, WITHOUT THE EXPLICIT PERMISSION OF THE COPYRIGHT OWNER. + * + * \file PressureRangeSlider.qml + * \author (last) Behrouz NematiPour + * \date (last) 11-Oct-2020 + * \author (original) Behrouz NematiPour + * \date (original) 11-Oct-2020 + * + */ + +// Qt +import QtQuick 2.12 + +// Project + +// Qml imports +import "qrc:/globals" +import "qrc:/components" + + +/*! + * \brief PressureRangeSlider.qml is a compound component + * \detail Which is used in the in-line arterial and venus presseure adjustment screen. + * It contains of label for the Arterial/Venous and the unit next to it on top left. + * And on the left side a RangeBar on top of a RangeSlider that are layed out in a Column. + * The RangeSlider and RangeBar are connected and RangeSlider change affects RangeBar min/max. + */ +Row { id: _root + + property real minimum : 0 + property real minimumMargin : 0 + property real lowerBound : 0 + property real upperBound : 0 + property real maximumMargin : 0 + property real maximum : 0 + property real value : 0 + property real step : 10 + property bool ticksVisible : false + + property string titleText : "" + property string titleUnit : Variables.unitTextBloodPressure + property int titleFontSize : Fonts.fontPixelPresseuresLabel + property int titleWidth : 200 + + property int progressWidth : Variables.pressuresProgressbarWidth + property color progressColor : Colors.pressuresArterialBar + + property int sliderTopMargin : 75 + + spacing: 25 + + TextRect { id: _pressureTextRect + anchors.top: parent.top + width: titleWidth + label: _root.titleText + extra: _root.titleUnit + labelFont.pixelSize: _root.titleFontSize + } + + Rectangle { id: _pressureRect + width : _root.progressWidth + height: 10 + color: Colors.transparent + + property int minMargin: _root.minimumMargin + property int maxMargin: _root.maximumMargin + + RangeBar { id: _pressureRangeBar + property int minDiff: (_pressureRect.minMargin * width)/( _root.maximum - _root.minimum ) // Map the value to pixel + property int maxDiff: (_pressureRect.maxMargin * width)/( _root.maximum - _root.minimum ) // Map the value to pixel + + anchors { + top : _pressureRect.top + left : _pressureRect.left + right: _pressureRect.right + } + + height : 15 + + rangebar.color: _root.progressColor + + minimum : _root.minimum + lowerBound : _root.lowerBound + upperBound : _root.upperBound + maximum : _root.maximum + value : _root.value + + minText.visible : _root.lowerBound !== minimum + maxText.visible : _root.upperBound !== maximum + + minText.anchors.topMargin: 25 + maxText.anchors.topMargin: 25 + minTextHorizontalCenter: true + maxTextHorizontalCenter: true + + minText.font.pixelSize : Fonts.fontPixelPresseuresText + maxText.font.pixelSize : Fonts.fontPixelPresseuresText + rangebar.minText.font.pixelSize : Fonts.fontPixelPresseuresText + rangebar.maxText.font.pixelSize : Fonts.fontPixelPresseuresText + markerFontSize : Fonts.fontPixelPresseuresText + + markerOutRangeNotify : true + } + RangeSlider { id: _pressureSlider + anchors { + top : _pressureRangeBar.top + topMargin: sliderTopMargin + left : _pressureRect.left + leftMargin: _pressureRangeBar.minDiff + right: _pressureRect.right + rightMargin: _pressureRangeBar.maxDiff + } + + height : 5 + diameter: 30 + + decimal : 1 + bgColor : Colors.pressuresOutOfRaneBg + + minText { + text : qsTr("LOW") + font.bold: true + font.pixelSize: Fonts.fontPixelPresseuresText + anchors.leftMargin: - minText.width - 20 + anchors.topMargin : - minText.height / 2 - 5 + color: "white" + } + maxText { + text : qsTr("HIGH") + font.bold: true + font.pixelSize: Fonts.fontPixelPresseuresText + anchors.rightMargin: - minText.width - 20 + anchors.topMargin : - minText.height / 2 - 5 + color: "white" + } + + minimum : _root.minimum + _pressureRect.minMargin + minValue: _root.lowerBound + maxValue: _root.upperBound + maximum : _root.maximum - _pressureRect.maxMargin + unit : Variables.unitTextBloodPressure + step : _root.step + ticks : _root.ticksVisible + + onMinValueChanged: { + lowerBound = minValue + } + onMaxValueChanged: { + upperBound = maxValue + } + } + } +} Index: sources/gui/qml/globals/Colors.qml =================================================================== diff -u -r9a0581274e4dc51af6d6f3e4dd932581e8dce445 -r99e12314855a6b8dd46989b9c0e5263b74af5dc4 --- sources/gui/qml/globals/Colors.qml (.../Colors.qml) (revision 9a0581274e4dc51af6d6f3e4dd932581e8dce445) +++ sources/gui/qml/globals/Colors.qml (.../Colors.qml) (revision 99e12314855a6b8dd46989b9c0e5263b74af5dc4) @@ -27,6 +27,8 @@ readonly property color white : "white" // white readonly property color transparent : "Transparent" // No Color + readonly property color separatorLine : "#5f809d" + readonly property color backgroundMain : "#1A344D" readonly property color backgroundButtonNormal : transparent readonly property color backgroundButtonSelect : "#438FEB" Index: sources/gui/qml/pages/treatment/adjustments/TreatmentAdjustmentFlow.qml =================================================================== diff -u -r56e378f7504701b9e9a9dccaf205aef2fd52c58e -r99e12314855a6b8dd46989b9c0e5263b74af5dc4 --- sources/gui/qml/pages/treatment/adjustments/TreatmentAdjustmentFlow.qml (.../TreatmentAdjustmentFlow.qml) (revision 56e378f7504701b9e9a9dccaf205aef2fd52c58e) +++ sources/gui/qml/pages/treatment/adjustments/TreatmentAdjustmentFlow.qml (.../TreatmentAdjustmentFlow.qml) (revision 99e12314855a6b8dd46989b9c0e5263b74af5dc4) @@ -106,7 +106,7 @@ Line { anchors.horizontalCenter: parent.horizontalCenter length : _root.width - 100 - color : "#5f809d" + color : Colors.separatorLine } Row { id : _dialysateInletFlowRow spacing: 100 Index: sources/gui/qml/pages/treatment/adjustments/TreatmentAdjustmentPressures.qml =================================================================== diff -u -r9a0581274e4dc51af6d6f3e4dd932581e8dce445 -r99e12314855a6b8dd46989b9c0e5263b74af5dc4 --- sources/gui/qml/pages/treatment/adjustments/TreatmentAdjustmentPressures.qml (.../TreatmentAdjustmentPressures.qml) (revision 9a0581274e4dc51af6d6f3e4dd932581e8dce445) +++ sources/gui/qml/pages/treatment/adjustments/TreatmentAdjustmentPressures.qml (.../TreatmentAdjustmentPressures.qml) (revision 99e12314855a6b8dd46989b9c0e5263b74af5dc4) @@ -21,6 +21,7 @@ // Qml imports import "qrc:/globals" import "qrc:/components" +import "qrc:/compounds" /*! * \brief TreatmentAdjustmentPressures.qml is the screen @@ -29,22 +30,21 @@ TreatmentAdjustmentBase { id: _root contentItem.objectName: "TreatmentAdjustmentPressures" //SquishQt testability - property alias arterialPressureMinimum : _arterialPressureRangeBar.minimum - property alias arterialPressureLowerBound : _arterialPressureRangeBar.lowerBound - property alias arterialPressureUpperBound : _arterialPressureRangeBar.upperBound - property alias arterialPressureMaximum : _arterialPressureRangeBar.maximum - property alias arterialPressureValue : _arterialPressureRangeBar.value + property alias arterialPressureMinimum : _arterialPressure.minimum + property alias arterialPressureLowerBound : _arterialPressure.lowerBound + property alias arterialPressureUpperBound : _arterialPressure.upperBound + property alias arterialPressureMaximum : _arterialPressure.maximum + property alias arterialPressureValue : _arterialPressure.value property real arterialPressureStep : 10 - property alias venousPressureMinimum : _venousPressureRangeBar.minimum - property alias venousPressureLowerBound: _venousPressureRangeBar.lowerBound - property alias venousPressureUpperBound: _venousPressureRangeBar.upperBound - property alias venousPressureMaximum : _venousPressureRangeBar.maximum - property alias venousPressureValue : _venousPressureRangeBar.value - property real venousPressureStep : 10 + property alias venousPressureMinimum : _venousPressure.minimum + property alias venousPressureLowerBound : _venousPressure.lowerBound + property alias venousPressureUpperBound : _venousPressure.upperBound + property alias venousPressureMaximum : _venousPressure.maximum + property alias venousPressureValue : _venousPressure.value + property real venousPressureStep : 10 readonly property int textWidth : 200 - readonly property int slidersTopMargin : 75 titleText: qsTr("PRESSURES") @@ -85,206 +85,38 @@ Column { id : _pressuresColumn spacing: 100 anchors.centerIn: parent - Row { id : _arterialPressureRow - spacing: 25 + PressureRangeSlider { id: _arterialPressure + titleText : qsTr("Arterial") anchors.horizontalCenter: parent.horizontalCenter - TextRect { id: _arterialPressureTextRect - anchors.top: parent.top - width: textWidth - label: qsTr("Arterial") - extra: Variables.unitTextBloodPressure - labelFont.pixelSize: Fonts.fontPixelPresseuresLabel - } - RangeBar { id: _arterialPressureRangeBar - width : Variables.pressuresProgressbarWidth - height : 15 - rangebar.color: Colors.pressuresArterialBar - - value : vTreatmentPressureOcclusion.pressureocclusion_ArterialPressure - - minimum : _root.arterialMinimum - lowerBound : _root.arterialLowerBound - upperBound : _root.arterialUpperBound - maximum : _root.arterialMaximum - - minText.visible : lowerBound !== minimum - maxText.visible : upperBound !== maximum - minText.anchors.topMargin: 25 - maxText.anchors.topMargin: 25 - minTextHorizontalCenter: true - maxTextHorizontalCenter: true - - minText.font.pixelSize : Fonts.fontPixelPresseuresText - maxText.font.pixelSize : Fonts.fontPixelPresseuresText - rangebar.minText.font.pixelSize : Fonts.fontPixelPresseuresText - rangebar.maxText.font.pixelSize : Fonts.fontPixelPresseuresText - markerFontSize : Fonts.fontPixelPresseuresText - - markerOutRangeNotify : true - } + minimum : arterialPressureMinimum + minimumMargin : 100 + lowerBound : arterialPressureLowerBound + upperBound : arterialPressureUpperBound + maximumMargin : 100 + maximum : arterialPressureMaximum + value : arterialPressureValue + step : arterialPressureStep } + Line { anchors.horizontalCenter: parent.horizontalCenter length : _root.width - 100 - color : "#5f809d" + color : Colors.separatorLine } - Row { id : _venousPressureRow - spacing: 25 + PressureRangeSlider { id: _venousPressure + titleText : qsTr("Arterial") anchors.horizontalCenter: parent.horizontalCenter - TextRect { id: _venousPressureTextRect - anchors.top: parent.top - width: textWidth - label: qsTr("Venous") - extra: Variables.unitTextBloodPressure - labelFont.pixelSize: Fonts.fontPixelPresseuresLabel - } - RangeBar { id: _venousPressureRangeBar - width : Variables.pressuresProgressbarWidth - height : 15 - rangebar.color: Colors.pressuresVenousBar - value : vTreatmentPressureOcclusion.pressureocclusion_VenousPressure - - minimum : _root.venousPressureMinimum - lowerBound : _root.venousPressureLowerBound - upperBound : _root.venousPressureUpperBound - maximum : _root.venousPressureMaximum - - minText.visible : lowerBound !== minimum - maxText.visible : upperBound !== maximum - minText.anchors.topMargin: 25 - maxText.anchors.topMargin: 25 - minTextHorizontalCenter: true - maxTextHorizontalCenter: true - - minText.font.pixelSize : Fonts.fontPixelPresseuresText - maxText.font.pixelSize : Fonts.fontPixelPresseuresText - rangebar.minText.font.pixelSize : Fonts.fontPixelPresseuresText - rangebar.maxText.font.pixelSize : Fonts.fontPixelPresseuresText - markerFontSize : Fonts.fontPixelPresseuresText - - markerOutRangeNotify : true - } + minimum : venousPressureMinimum + minimumMargin : 50 + lowerBound : venousPressureLowerBound + upperBound : venousPressureUpperBound + maximumMargin : 50 + maximum : venousPressureMaximum + value : venousPressureValue + step : venousPressureStep } } - RangeSlider { id: _arterialPressureSlider - property int diff: getXOfValue(-300) - // vertical position - y: _arterialPressureRangeBar.height + - _arterialPressureRangeBar.y + - _pressuresColumn .y + - _arterialPressureRow .y + - slidersTopMargin - - // horizontal location - x: _arterialPressureRangeBar.x + - _pressuresColumn .x + - _arterialPressureRow .x + - diff - width : _arterialPressureRangeBar.width - diff - // HERE : 2020/09/29 - // I have an error : - // qrc:/pages/treatment/adjustments/TreatmentAdjustmentPressures.qml:172:5: QML RangeSlider: Binding loop detected for property "diff" - - height : 5 - diameter: 30 - - decimal : 1 - bgColor : Colors.pressuresOutOfRaneBg - - //// //TODO : TEST : these two texts need to be removed - //// lowerText.visible: true - //// upperText.visible: true - - minText { - text : qsTr("LOW") - font.bold: true - font.pixelSize: Fonts.fontPixelPresseuresText - anchors.leftMargin: - minText.width - 20 - anchors.topMargin : - minText.height / 2 - 5 - color: "white" - } - maxText { - text : qsTr("HIGH") - font.bold: true - font.pixelSize: Fonts.fontPixelPresseuresText - anchors.rightMargin: - minText.width - 20 - anchors.topMargin : - minText.height / 2 - 5 - color: "white" - } - minValue: arterialPressureLowerBound - maxValue: arterialPressureUpperBound - minimum : arterialPressureMinimum - maximum : arterialPressureMaximum - unit : Variables.unitTextBloodPressure - step : arterialPressureStep - //ticks : true - - onMinValueChanged: { - arterialPressureLowerBound = minValue - } - onMaxValueChanged: { - arterialPressureUpperBound = maxValue - } - } - - RangeSlider { id: _venousPressureSliders - // vertical position - y: _venousPressureRangeBar .height + - _venousPressureRangeBar .y + - _pressuresColumn .y + - _venousPressureRow .y + - slidersTopMargin - - - // horizontal location - x: _venousPressureRangeBar .x + - _pressuresColumn .x + - _venousPressureRow .x - width : _venousPressureRangeBar.width - - height : 5 - diameter: 30 - - decimal : 1 - bgColor : Colors.pressuresOutOfRaneBg - - //// //TODO : TEST : these two texts need to be removed - //// lowerText.visible: trues - //// upperText.visible: true - - minText { - text : qsTr("LOW") - font.bold: true - font.pixelSize: Fonts.fontPixelPresseuresText - anchors.leftMargin: - minText.width - 20 - anchors.topMargin : - minText.height / 2 - 5 - color: "white" - } - maxText { - text : qsTr("HIGH") - font.bold: true - font.pixelSize: Fonts.fontPixelPresseuresText - anchors.rightMargin: - minText.width - 20 - anchors.topMargin : - minText.height / 2 - 5 - color: "white" - } - minimum : venousPressureMinimum - maximum : venousPressureMaximum - unit : Variables.unitTextBloodPressure - step : venousPressureStep - //ticks : true - - minValue: venousPressureLowerBound - maxValue: venousPressureUpperBound - - onMinValueChanged: { - venousPressureLowerBound = minValue - } - onMaxValueChanged: { - venousPressureUpperBound = maxValue - } - } }