Index: sources/gui/qml/components/RangeSlider.qml =================================================================== diff -u -rccb91da4becded9a7ad409b758bba96784d9feba -r514a0dd3f99af42040041b7033826d4a2d1192f1 --- sources/gui/qml/components/RangeSlider.qml (.../RangeSlider.qml) (revision ccb91da4becded9a7ad409b758bba96784d9feba) +++ sources/gui/qml/components/RangeSlider.qml (.../RangeSlider.qml) (revision 514a0dd3f99af42040041b7033826d4a2d1192f1) @@ -1,15 +1,15 @@ /*! * - * Copyright (c) 2019-2020 Diality Inc. - All Rights Reserved. + * Copyright (c) 2020-2023 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 Slider.qml - * \author (last) Behrouz NemaiPour - * \date (last) 04-Jun-2020 - * \author (original) Behrouz NematiPour - * \date (original) 18-Mar-2020 + * \file RangeSlider.qml + * \author (last) Behrouz NematiPour + * \date (last) 23-Nov-2022 + * \author (original) Behrouz NematiPour + * \date (original) 17-Sep-2020 * */ @@ -46,10 +46,10 @@ property bool minVerticalEdgeVisible: true property int gapValue : 0 ///< the gap between minValue and maxValue so the minValue shall always be gap value less than maxValue and vise versa. - property real minValueLowerBound : _root.minimum ///< min value can't be lower than this value - property real minValueUpperBound : _root.maximum ///< min value can't be higher than this value - property real maxValueLowerBound : _root.minimum ///< max value can't be lower than this value - property real maxValueUpperBound : _root.maximum ///< max value can't be higher than this value + property real minValueLowerBound : 0 + property real minValueUpperBound : 0 + property real maxValueLowerBound : 0 + property real maxValueUpperBound : 0 property int curHandler : RangeSlider.HandlerOption.None ///< current active slider handler @@ -65,9 +65,12 @@ property bool minAdjusted : false ///< first time user adjustment happens property bool maxAdjusted : false ///< first time user adjustment happens - property bool hasAdjusted : false ///< if set to true then component is grayed out until both min and max are adjusted + property bool hasAdjust : false ///< if set to true then component is grayed out until both min and max are adjusted - onHasAdjustedChanged: { + property bool showTickmarks : true ///< Indicate whether tickMarks should be shown + property bool isTickMarksRound : true ///< Indicate whether the tickmakrs are round + + onHasAdjustChanged : { setAdjusted() } onMinAdjustedChanged: { @@ -79,36 +82,17 @@ /// root attributes clip : false + color: Colors.transparent height : Variables.progressbarHeight touchMargin : 25 + isRoundedEnds : true + hasBorder : true + minimum : 0 maximum : 0 - /// real-time bound change should effect the current set value - onMinimumChanged: { - if ( minValueLowerBound < minimum ) { minValueLowerBound = minimum } - if ( maxValueLowerBound < minimum ) { maxValueLowerBound = minimum } - } - onMaximumChanged: { - if ( minValueUpperBound > maximum ) { minValueUpperBound = maximum } - if ( maxValueUpperBound > maximum ) { maxValueUpperBound = maximum } - } - - onMinValueLowerBoundChanged: { - if ( minValue < minValueLowerBound ) { minValue = minValueLowerBound } - } - onMinValueUpperBoundChanged: { - if ( minValue > minValueUpperBound ) { minValue = minValueUpperBound } - } - onMaxValueLowerBoundChanged: { - if ( maxValue < maxValueLowerBound ) { maxValue = maxValueLowerBound } - } - onMaxValueUpperBoundChanged: { - if ( maxValue > maxValueUpperBound ) { maxValue = maxValueUpperBound } - } - /// Lable of the minimum of range minText { visible : true @@ -126,11 +110,11 @@ } /// - /// \brief grays out the rangebar and handler if not adjusted and hasAdjusted set to true + /// \brief grays out the rangebar and handler if not adjusted and hasAdjust set to true /// function setAdjusted() { function check() { - _rangeRect .color = minAdjusted && maxAdjusted ? Colors.createTreatmentActive : Colors.createTreatmentInactive + _rangeRect .color = minAdjusted && maxAdjusted ? Colors.sliderHighlightColor : Colors.createTreatmentInactive _handlerLeft .color = minAdjusted ? Colors.createTreatmentActive: Colors.createTreatmentInactive _handlerRight.color = maxAdjusted ? Colors.createTreatmentActive: Colors.createTreatmentInactive } @@ -139,7 +123,7 @@ _handlerLeft .color = Colors.createTreatmentActive _handlerRight.color = Colors.createTreatmentActive } - if ( ! hasAdjusted ) { + if ( ! hasAdjust ) { active() } else { @@ -165,67 +149,69 @@ /// \param x : the active slider x cordinate. /// function setValue(x) { - var value = 0 - if ( x < 0 ) { value = minimum; return value; } - if ( x > width ) { value = maximum; return value; } + let mValue = 0 + if ( x < 0 ) { mValue = minimum; return mValue; } + if ( x > width ) { mValue = maximum; return mValue; } - value = getValueOfX(x) + mValue = getValueOfX(x) - if ( step === 1 ) { return value; } + if ( step === 1 ) { return mValue; } - var start = 0 + let start = 0 if ( ! stepSnap ) start = minimum + mValue = Math.round((mValue - start) / step) * step + start - value = Math.round((value - start) / step) * step + start + let decimals = Math.round(-Math.log10(step)) + if (decimals > 0) mValue = mValue.toFixed(decimals) - if ( value < minimum ) { value = minimum; return value; } - if ( value > maximum ) { value = maximum; return value; } - return value; + if ( mValue < minimum ) { mValue = minimum; return mValue; } + if ( mValue > maximum ) { mValue = maximum; return mValue; } + return mValue; } /// /// \brief updates correct lower or upper bound value regarding the x position /// \details regarding the current mouse x position selects the correct handler and updated the bound value. /// \param x : mouse x position. function setBound(x) { - var value = setValue(x) + let mValue = setValue(x) // console.debug( maxValue - minValue, minValue, value, maxValue ) if ( maxValue - minValue <= gapValue ) { // max correction if the values get too close together less than defined gap if ( curHandler === RangeSlider.HandlerOption.Max ) maxValue = minValue + gapValue // min correction if the values get too close together less than defined gap if ( curHandler === RangeSlider.HandlerOption.Min ) minValue = maxValue - gapValue // while value is between min and max do nothing and let the value gets out of the bound and then apply value. - if ( minValue <= value && value <= maxValue ) return + if ( minValue <= mValue && mValue <= maxValue ) return } - var minDiff = Math.abs(minValue - value) - var maxDiff = Math.abs(maxValue - value) + let minDiff = Math.abs(minValue - mValue) + let maxDiff = Math.abs(maxValue - mValue) if ( minDiff === maxDiff ) { - if ( curHandler === RangeSlider.HandlerOption.Max ) checkLimitsMaxValueBounds(value) - else checkLimitsMinValueBounds(value) + if ( curHandler === RangeSlider.HandlerOption.Max ) checkLimitsMaxValueBounds(mValue) + else checkLimitsMinValueBounds(mValue) } else { // console.debug( minDiff, minValue, value, maxValue, maxDiff ) if ( minDiff < maxDiff ) { // if (minDiff > limitGap) return // not sure if it needs but kept it as an idea. - checkLimitsMinValueBounds(value) + checkLimitsMinValueBounds(mValue) } else { // if (maxDiff > limitGap) return // not sure if it needs but kept it as an idea. - checkLimitsMaxValueBounds(value) + checkLimitsMaxValueBounds(mValue) } } } - function checkLimitsMinValueBounds( vValue ) { + function checkLimitsMinValueBounds ( vValue ) { curHandler = RangeSlider.HandlerOption.Min if ( vValue < minValueLowerBound ) { minValue = minValueLowerBound; return } if ( vValue > minValueUpperBound ) { minValue = minValueUpperBound; return } setMinvalue(vValue) } - function checkLimitsMaxValueBounds( vValue ) { + function checkLimitsMaxValueBounds ( vValue ) { curHandler = RangeSlider.HandlerOption.Max if ( vValue < maxValueLowerBound ) { maxValue = maxValueLowerBound; return } if ( vValue > maxValueUpperBound ) { maxValue = maxValueUpperBound; return } @@ -247,13 +233,13 @@ property alias lowerBound : _rangeRect.minimum property alias upperBound : _rangeRect.maximum property real minmaxDiff : parent.maximum - parent.minimum - x : minmaxDiff ? ((parent.width * (lowerBound - parent.minimum)) / minmaxDiff) : minmaxDiff width : minmaxDiff ? ((parent.width * (upperBound - lowerBound )) / minmaxDiff) : minmaxDiff height : parent.height - radius: 0 - decimal: _root.decimal + decimal : _root.decimal + isRoundedEnds : _root.isRoundedEnds + hasBorder : _root.hasBorder minText { visible: false @@ -268,9 +254,11 @@ // so it has to be implemented here as well onDragged: { setBound(vMouseEvent.x + _rangeRect.x) + _root.clicked(vMouseEvent) } onClicked: { setBound(vMouseEvent.x + _rangeRect.x) + _root.clicked(vMouseEvent) } } @@ -280,13 +268,20 @@ Loader { id: _ticksLoader active : _root.ticks anchors.fill : parent - sourceComponent : TickMarks { + sourceComponent : _root.showTickmarks ? _tickMarkFactory : undefined + } + + Component { id:_tickMarkFactory + TickMarks { decimal : _root.decimal minimum : _root.minimum maximum : _root.maximum step : _root.step stepSnap : _root.stepSnap textColor : _root.color + lineTickMarkHeight: _rangeRect.height + isTickMarkRound : _root.isTickMarksRound + yDisplacement : _root.isTickMarksRound ? (-_rangeRect.height) : 0 } } @@ -332,7 +327,7 @@ color : Colors.highlightProgressBar border { width : 4 - color : "white" + color : Colors.textMain } } @@ -349,7 +344,7 @@ color : Colors.highlightProgressBar border { width : 4 - color : "white" + color : Colors.textMain } } }