Index: sources/gui/qml/components/Slider.qml =================================================================== diff -u -r22ad47530c68333209f2006f54dbdcef9efd20aa -rc80e4dade15bd769ea20f8098b37655fb22407b7 --- sources/gui/qml/components/Slider.qml (.../Slider.qml) (revision 22ad47530c68333209f2006f54dbdcef9efd20aa) +++ sources/gui/qml/components/Slider.qml (.../Slider.qml) (revision c80e4dade15bd769ea20f8098b37655fb22407b7) @@ -40,10 +40,13 @@ property alias handlerColor : _handler.color property alias handlerVisible : _handler.visible + readonly property alias handleAdjusted : _private.sliderAdjusted + property alias diameter : _handler.diameter property bool isActive : true property bool inActiveZero : false // if inActiveZero:true, when is not active (inActive or active:false) sets to zero instead of minimum + property bool showActiveDisabled : false // if showActiveDisabled: true the slider is highlighted active even if the slider is isActive:false property alias progressRectMargin : _progressRect.margin @@ -53,7 +56,6 @@ property bool isRoundedEnds : true property bool hasBorder : true - property color borderColor : Colors.borderDisableButton QtObject { id:_private // To avoid displaying and updating _root.value with intermediate values, @@ -65,6 +67,14 @@ // This value is set primarily in the update() function and checked for in // onValueChanged handler property bool isInternalValueUpdate : false + + // Indicate the active state of the slider visually (borders) + property bool isVisualActive : false + + // Indicate whether the slider have been modified/adjusted + // When property changes, update the visuals of the slider to reflect + property bool sliderAdjusted : false + onSliderAdjustedChanged: setActiveVisuals(sliderAdjusted) } onValueChanged: { @@ -112,26 +122,30 @@ update(newValue) } - function setActiveVisuals(active) { - if (active) { - color = Colors.sliderHighlightColor + function setActiveVisuals(vActive) { + // NOTE: the slider borders are set separately from here and + // based on _private.isVisualActive + + if (vActive) { + color = Colors.sliderHighlightColor // _progressRect body color handlerColor = Colors.createTreatmentActive } else { - color = Colors.createTreatmentInactive + color = Colors.createTreatmentInactive // _progressRect body color handlerColor = Colors.createTreatmentInactive } + + _private.isVisualActive = vActive } onIsActiveChanged: { - setActiveVisuals(isActive) - - // value is assigned a different value based on active-ness of the slider - // This is to resolve the use of slider with a switch and arrows enabled. - // It allows correct behavior when using arrow on a first initialize increment of - // the slider when the slider has inActiveZero to true. - _root.value = inActiveZero ? 0 : minimum // Not using update() here because slider is not active => _progressRect not visible - _progressRect.value = 0 - + if(!isActive) { + _root.value = inActiveZero ? 0 : minimum + setActiveVisuals(showActiveDisabled) + } else { + _progressRect.value = minimum + _private.sliderAdjusted = false + setActiveVisuals(false) + } activeChanged() // emit } @@ -142,7 +156,7 @@ radius : _root.isRoundedEnds ? (height/2) : Variables.rangeRectRadius border.width: _root.hasBorder ? Variables.rangeRectBorderWidth : 0 - border.color: _root.isActive ? Colors.borderButton : Colors.borderDisableButton + border.color: _private.isVisualActive ? Colors.borderButton : Colors.borderDisableButton minimum : 0 maximum : 0 @@ -185,6 +199,9 @@ // Update the _root.value / the exposed value of slider _root.value = vValue + // indicate that the slider have modified value state + _private.sliderAdjusted = true + // reset state to allow _root.value value updating externally _private.isInternalValueUpdate = false } @@ -250,7 +267,7 @@ radius : _root.isRoundedEnds ? (height/2) : Variables.rangeRectRadius border.width: _root.hasBorder ? Variables.rangeRectBorderWidth : 0 - border.color: _root.isActive ? Colors.sliderProgressBorderActive : Colors.borderDisableButton + border.color: _private.isVisualActive ? Colors.sliderProgressBorderActive : Colors.borderDisableButton // propagation is not working on drag ! onDragged: { @@ -289,7 +306,7 @@ return _root.tickMarkYDisplacement } } - color : _root.isActive ? Colors.borderButton : Colors.borderDisableButton + color : _private.isVisualActive ? Colors.borderButton : Colors.borderDisableButton } } @@ -314,7 +331,6 @@ // update slider value with rounded new value update(calculateRoundedValue(newCurrentValue)) - } } Index: sources/gui/qml/components/SliderCreateTreatment.qml =================================================================== diff -u -r22ad47530c68333209f2006f54dbdcef9efd20aa -rc80e4dade15bd769ea20f8098b37655fb22407b7 --- sources/gui/qml/components/SliderCreateTreatment.qml (.../SliderCreateTreatment.qml) (revision 22ad47530c68333209f2006f54dbdcef9efd20aa) +++ sources/gui/qml/components/SliderCreateTreatment.qml (.../SliderCreateTreatment.qml) (revision c80e4dade15bd769ea20f8098b37655fb22407b7) @@ -35,6 +35,7 @@ property alias value : _slider.value property alias step : _slider.step property alias inActiveZero: _slider.inActiveZero + property alias showActiveDisabled : _slider.showActiveDisabled property string zeroLabel : "" @@ -53,9 +54,19 @@ anchors.horizontalCenter: parent.horizontalCenter + QtObject { id: _private + property bool setVisualActive : _root.active + } + + // Allows overriding the visual coloring for active/inactive binding + function overrideActiveVisual(vSetActive) { + _slider.setActiveVisuals(vSetActive) + _private.setVisualActive = Qt.binding(function(){return vSetActive;}) + } + function setColor() { let color = Colors.textDisableButton - if ( _root.active ) { + if ( _root.active || _private.setVisualActive) { if ( _root.valid ) { color = Colors.textMain } @@ -75,7 +86,7 @@ let mValue = "__" let unit = " " + _root.unit - if ( _root.active ) { + if ( _root.active && _slider.handleAdjusted) { mValue = _slider.value.toFixed(decimal) } return mValue + unit Index: sources/gui/qml/pages/pretreatment/create/PreTreatmentCreate.qml =================================================================== diff -u -rc1e20965a961f16ab27e0daf33cafd1f435edf4d -rc80e4dade15bd769ea20f8098b37655fb22407b7 --- sources/gui/qml/pages/pretreatment/create/PreTreatmentCreate.qml (.../PreTreatmentCreate.qml) (revision c1e20965a961f16ab27e0daf33cafd1f435edf4d) +++ sources/gui/qml/pages/pretreatment/create/PreTreatmentCreate.qml (.../PreTreatmentCreate.qml) (revision c80e4dade15bd769ea20f8098b37655fb22407b7) @@ -163,31 +163,37 @@ step : vTreatmentRanges.heparinDispensingRateRes value : vTreatmentRanges.heparinDispensingRateDef onValueChanged : vTreatmentCreate.heparinDispensingRate = value - adjustable : _heparinDispensingRateSwitch.checked + adjustable : _heparinDispensingRateSwitch.isSliderOn inActiveZero : true - enableAdjustButtons: _heparinDispensingRateSwitch.checked - onActiveChanged: { - // Update the state of the heparin stop time slider to match activeness - // of this slider - _heparinStopTime.active = _heparinDispensingRate.active - _heparinStopTime.enabled= _heparinDispensingRate.active - } + enableAdjustButtons: _heparinDispensingRateSwitch.isSliderOn + showActiveDisabled: _heparinDispensingRateSwitch.active + onActiveChanged: { _heparinStopTime.enabled = _heparinDispensingRate.active } // ToDo: create a component for Switch, // ToDo: Consider putting the new CheckBox component into the SliderCreateTreatment component and set via boolean property // This is a full implementation of a Switch Switch { id: _heparinDispensingRateSwitch property bool active: false - onCheckedChanged: { - if ( ! active ) { + // Due to the desired behavior of the switch: + // activating from inactive-OFF to active-OFF before allowing active-ON + // Setting checkable to OFF to manually handle check state. + // This will avoid a double call to onClickedChanged and also rid of the + // need to set to checked property twice (once by Switch object and again by code) + property bool isSliderOn : false + checkable: false + onClicked: { + if(!active) { active = true - checked = ! checked + _heparinDispensingRate.overrideActiveVisual(true) + } else { + isSliderOn = !isSliderOn } - vTreatmentCreate.heparinDispensingRate = 0 - _heparinDispensingRate.value = 0 - _heparinDispensingRate.active = ! checked + _heparinDispensingRate.active = isSliderOn + checked = isSliderOn } + onCheckedChanged: console.log("_heparinDispensingRate switch changed " + checked) + x : width * -1.5 y : Variables.createTreatmentSwitchYDisplacement // these values are set to align the switch with slider width : 75 // these values are set to align the switch with slider @@ -240,23 +246,31 @@ step : vTreatmentRanges.heparinBolusVolumeRes value : vTreatmentRanges.heparinBolusVolumeDef onValueChanged : vTreatmentCreate.heparinBolusVolume = value - adjustable : _heparinBolusVolumeSwitch.checked + adjustable : _heparinBolusVolumeSwitch.isSliderOn inActiveZero : true - enableAdjustButtons: _heparinBolusVolumeSwitch.checked + enableAdjustButtons: _heparinBolusVolumeSwitch.isSliderOn // ToDo: create a component for this, // ToDo: Consider putting the new CheckBox component into the SliderCreateTreatment component and set via boolean property // This is a full implementation of a CheckBox Switch { id: _heparinBolusVolumeSwitch property bool active: false - onCheckedChanged: { - if ( ! active ) { + // Due to the desired behavior of the switch: + // activating from inactive-OFF to active-OFF before allowing active-ON + // Setting checkable to OFF to manually handle check state. + // This will avoid a double call to onClickedChanged and also rid of the + // need to set to checked property twice (once by Switch object and again by code) + property bool isSliderOn : false + checkable: false + onClicked: { + if(!active) { active = true - checked = ! checked + _heparinDispensingRate.overrideActiveVisual(true) + } else { + isSliderOn = !isSliderOn } - vTreatmentCreate.heparinBolusVolume = 0 - _heparinBolusVolume.value = 0 - _heparinBolusVolume.active = ! checked + _heparinDispensingRate.active = isSliderOn + checked = isSliderOn } x : width * -1.5 @@ -593,24 +607,31 @@ step : vTreatmentRanges.bloodPressureMeasureIntervalRes value : vTreatmentRanges.bloodPressureMeasureIntervalDef onValueChanged: vTreatmentCreate.bloodPressureMeasureInterval = value - adjustable : _bloodPressureIntervalSwitch.checked + adjustable : _bloodPressureIntervalSwitch.isSliderOn inActiveZero: true - enableAdjustButtons: _bloodPressureIntervalSwitch.checked - + enableAdjustButtons: _bloodPressureIntervalSwitch.isSliderOn + showActiveDisabled: true // ToDo: create a component for this, // ToDo: Consider putting the new CheckBox component into the SliderCreateTreatment component and set via boolean property // This is a full implementation of a CheckBox Switch { id: _bloodPressureIntervalSwitch property bool active: false - onCheckedChanged: { - if ( ! active ) { + // Due to the desired behavior of the switch: + // activating from inactive-OFF to active-OFF before allowing active-ON + // Setting checkable to OFF to manually handle check state. + // This will avoid a double call to onClickedChanged and also rid of the + // need to set to checked property twice (once by Switch object and again by code) + property bool isSliderOn : false + checkable: false + onClicked: { + if(!active) { active = true - checked = ! checked + _heparinDispensingRate.overrideActiveVisual(true) + } else { + isSliderOn = !isSliderOn } - vTreatmentCreate.bloodPressureMeasureInterval = 0 - _bloodPressureInterval.value = 0 - _bloodPressureInterval.active = ! checked - + _heparinDispensingRate.active = isSliderOn + checked = isSliderOn } x : width * -1.5