diff --git a/qgroundcontrol.qrc b/qgroundcontrol.qrc index 5e5b9340ec04ec2e8256c427aec7488fc932cf96..ec358523264a48d8353aef8c1f7bde62d5cf7db8 100644 --- a/qgroundcontrol.qrc +++ b/qgroundcontrol.qrc @@ -58,6 +58,9 @@ src/QmlControls/QGCButton.qml src/QmlControls/QGCCheckBox.qml src/QmlControls/QGCColoredImage.qml + src/QmlControls/QGCFlickable.qml + src/QmlControls/QGCFlickableVerticalIndicator.qml + src/QmlControls/QGCFlickableHorizontalIndicator.qml src/QmlControls/QGCComboBox.qml src/QmlControls/QGCLabel.qml src/QmlControls/QGCMovableItem.qml diff --git a/src/AutoPilotPlugins/APM/APMAirframeComponent.qml b/src/AutoPilotPlugins/APM/APMAirframeComponent.qml index 30529cc563c980020d89262d21fd60322e870c2a..de9bf7cbcf71da9a5a6e1c1d633b9d76d7a09d6d 100644 --- a/src/AutoPilotPlugins/APM/APMAirframeComponent.qml +++ b/src/AutoPilotPlugins/APM/APMAirframeComponent.qml @@ -138,7 +138,7 @@ QGCView { width: 10 } - Flickable { + QGCFlickable { id: scroll anchors.top: helpSpacer.bottom anchors.bottom: parent.bottom diff --git a/src/AutoPilotPlugins/APM/APMCameraComponent.qml b/src/AutoPilotPlugins/APM/APMCameraComponent.qml index d56e10700bd7fb2a26448ffcc98c12a97794cf3d..41ebde565bd8c94e00f60edb20d2385725aa302e 100644 --- a/src/AutoPilotPlugins/APM/APMCameraComponent.qml +++ b/src/AutoPilotPlugins/APM/APMCameraComponent.qml @@ -459,7 +459,7 @@ QGCView { id: panel anchors.fill: parent - Flickable { + QGCFlickable { clip: true anchors.fill: parent contentHeight: gimbalDirectionPanLoader.y + gimbalDirectionPanLoader.height diff --git a/src/AutoPilotPlugins/APM/APMFlightModesComponent.qml b/src/AutoPilotPlugins/APM/APMFlightModesComponent.qml index e21b7d6d78c54b4584270101f6b7136dd901e6b1..7c81ccbd1d899afde9420de3769380b79328c3c9 100644 --- a/src/AutoPilotPlugins/APM/APMFlightModesComponent.qml +++ b/src/AutoPilotPlugins/APM/APMFlightModesComponent.qml @@ -51,10 +51,9 @@ QGCView { id: panel anchors.fill: parent - Flickable { + QGCFlickable { anchors.fill: parent clip: true - boundsBehavior: Flickable.StopAtBounds flickableDirection: Flickable.VerticalFlick contentHeight: flightModeSettings.y + flightModeSettings.height @@ -164,6 +163,6 @@ QGCView { } // Repeater -- Channel options } // Column - Channel options } // Rectangle - Channel options - } // FLickable + } // QGCFlickable } // QGCViewPanel } // QGCView diff --git a/src/AutoPilotPlugins/APM/APMPowerComponent.qml b/src/AutoPilotPlugins/APM/APMPowerComponent.qml index 37f0aa6644b030e6f6adf03b4048091f97b91d81..f6bf6ab3b3574ca0bb8da52d54900be2bb19cda7 100644 --- a/src/AutoPilotPlugins/APM/APMPowerComponent.qml +++ b/src/AutoPilotPlugins/APM/APMPowerComponent.qml @@ -99,7 +99,7 @@ QGCView { id: panel anchors.fill: parent - Flickable { + QGCFlickable { anchors.fill: parent clip: true contentWidth: capacityField.x + capacityField.width + _margins @@ -246,6 +246,6 @@ QGCView { fact: battAmpPerVolt visible: _showAdvanced } - } // Flickable + } // QGCFlickable } // QGCViewPanel } // QGCView diff --git a/src/AutoPilotPlugins/APM/APMSafetyComponentCopter.qml b/src/AutoPilotPlugins/APM/APMSafetyComponentCopter.qml index 65582c207e8fd2fdbef374d24f7ed463c18fab3e..c61305fa40c907ae6b543b66c31f4acc83e90dfb 100644 --- a/src/AutoPilotPlugins/APM/APMSafetyComponentCopter.qml +++ b/src/AutoPilotPlugins/APM/APMSafetyComponentCopter.qml @@ -71,7 +71,7 @@ QGCView { id: panel anchors.fill: parent - Flickable { + QGCFlickable { clip: true anchors.fill: parent contentHeight: armingCheckSettings.y + armingCheckSettings.height @@ -494,6 +494,6 @@ QGCView { FactBitmask { fact: _armingCheck } } } - } // Flickable + } // QGCFlickable } // QGCViewPanel } // QGCView diff --git a/src/AutoPilotPlugins/APM/APMSafetyComponentPlane.qml b/src/AutoPilotPlugins/APM/APMSafetyComponentPlane.qml index f06676032023b98df9c6c802a9b78b2e63aa67c5..7915de94bab236d4d128ecd695e144d9c33d90f2 100644 --- a/src/AutoPilotPlugins/APM/APMSafetyComponentPlane.qml +++ b/src/AutoPilotPlugins/APM/APMSafetyComponentPlane.qml @@ -56,10 +56,9 @@ QGCView { id: panel anchors.fill: parent - Flickable { + QGCFlickable { clip: true anchors.fill: parent - boundsBehavior: Flickable.StopAtBounds contentHeight: rtlSettings.y + rtlSettings.height flickableDirection: Flickable.VerticalFlick @@ -205,6 +204,6 @@ QGCView { enabled: returnAltRadio.checked } } // Rectangle - RTL Settings - } // Flickable + } // QGCFlickable } // QGCViewPanel } // QGCView diff --git a/src/AutoPilotPlugins/APM/APMSensorsComponent.qml b/src/AutoPilotPlugins/APM/APMSensorsComponent.qml index 0990ece279a5cdf63ef9c426d8833dd437b5aaa0..708b809febc0ea1a2f6e0585044ad5cf7c5cf3ee 100644 --- a/src/AutoPilotPlugins/APM/APMSensorsComponent.qml +++ b/src/AutoPilotPlugins/APM/APMSensorsComponent.qml @@ -239,7 +239,7 @@ QGCView { text: "Show values" } - Flickable { + QGCFlickable { anchors.topMargin: ScreenTools.defaultFontPixelHeight anchors.top: showValues.bottom anchors.bottom: parent.bottom diff --git a/src/AutoPilotPlugins/APM/APMTuningComponentCopter.qml b/src/AutoPilotPlugins/APM/APMTuningComponentCopter.qml index 4e5844851d92f38e82ea8a12639c36a6ded96eef..efa7d08e5f39c94123639e323c17f4f4de24515f 100644 --- a/src/AutoPilotPlugins/APM/APMTuningComponentCopter.qml +++ b/src/AutoPilotPlugins/APM/APMTuningComponentCopter.qml @@ -126,10 +126,9 @@ QGCView { id: panel anchors.fill: parent - Flickable { + QGCFlickable { clip: true anchors.fill: parent - boundsBehavior: Flickable.StopAtBounds contentHeight: autoTuneRect.y + autoTuneRect.height flickableDirection: Flickable.VerticalFlick @@ -340,6 +339,6 @@ QGCView { } } } // Rectangle - AutoTune - } // Flickable + } // QGCFlickable } // QGCViewPanel } // QGCView diff --git a/src/AutoPilotPlugins/PX4/AirframeComponent.qml b/src/AutoPilotPlugins/PX4/AirframeComponent.qml index 69c63f69944bd4306bd78ca9a0ead8a000147075..799d700e01c5e1f69454302472a75b4f096b332f 100644 --- a/src/AutoPilotPlugins/PX4/AirframeComponent.qml +++ b/src/AutoPilotPlugins/PX4/AirframeComponent.qml @@ -149,7 +149,7 @@ QGCView { width: 10 } - Flickable { + QGCFlickable { id: scroll anchors.top: lastSpacer.bottom anchors.bottom: parent.bottom @@ -157,7 +157,6 @@ QGCView { clip: true contentHeight: flowView.height contentWidth: parent.width - boundsBehavior: Flickable.StopAtBounds flickableDirection: Flickable.VerticalFlick onWidthChanged: { diff --git a/src/AutoPilotPlugins/PX4/PowerComponent.qml b/src/AutoPilotPlugins/PX4/PowerComponent.qml index 2ffd62095855196516dc773dc98591c9c672b0ab..d417930e0c9f84c594bc6f604c4e5491590150fd 100644 --- a/src/AutoPilotPlugins/PX4/PowerComponent.qml +++ b/src/AutoPilotPlugins/PX4/PowerComponent.qml @@ -108,12 +108,11 @@ QGCView { id: panel anchors.fill: parent - Flickable { + QGCFlickable { anchors.fill: parent clip: true contentHeight: innerColumn.height contentWidth: panel.width - boundsBehavior: Flickable.StopAtBounds flickableDirection: Flickable.VerticalFlick Column { @@ -414,6 +413,6 @@ QGCView { } } // Rectangle - Advanced power settings } // Column - } // Flickable + } // QGCFlickable } // QGCViewPanel } // QGCView diff --git a/src/AutoPilotPlugins/PX4/SafetyComponent.qml b/src/AutoPilotPlugins/PX4/SafetyComponent.qml index 695dab48947f2b5d7c54a486973fc57592aecbea..e748321382f4e665b23d0e885e2e073ae40943d5 100644 --- a/src/AutoPilotPlugins/PX4/SafetyComponent.qml +++ b/src/AutoPilotPlugins/PX4/SafetyComponent.qml @@ -53,12 +53,11 @@ QGCView { id: panel anchors.fill: parent - Flickable { + QGCFlickable { clip: true anchors.fill: parent contentHeight: screenBottom.y + screenBottom.height contentWidth: parent.width - boundsBehavior: Flickable.StopAtBounds flickableDirection: Flickable.VerticalFlick QGCLabel { @@ -321,6 +320,6 @@ QGCView { width: 1 height: 1 } - } // Flickable + } // QGCFlickable } // QGCViewPanel } // QGCView diff --git a/src/MissionEditor/MissionItemStatus.qml b/src/MissionEditor/MissionItemStatus.qml index 09851a527bf9eca02ce2dc12dd0039048a1e4641..78d99bae1ac16c8354916850d6a5f9995728d529 100644 --- a/src/MissionEditor/MissionItemStatus.qml +++ b/src/MissionEditor/MissionItemStatus.qml @@ -90,7 +90,7 @@ Rectangle { text: _expanded ? "<<" : ">>" } - Flickable { + QGCFlickable { anchors.leftMargin: _margins anchors.rightMargin: _margins anchors.left: distanceLabel.right diff --git a/src/QmlControls/FactSliderPanel.qml b/src/QmlControls/FactSliderPanel.qml index 90fdf78ca2e83039fec1b7aba66fefea5cd5929c..09b0892105eb7cb7e756c7c91459411ec6000d8d 100644 --- a/src/QmlControls/FactSliderPanel.qml +++ b/src/QmlControls/FactSliderPanel.qml @@ -68,10 +68,9 @@ QGCView { id: panel anchors.fill: parent - Flickable { + QGCFlickable { clip: true anchors.fill: parent - boundsBehavior: Flickable.StopAtBounds contentHeight: sliderRect.y + sliderRect.height flickableDirection: Flickable.VerticalFlick @@ -138,6 +137,6 @@ QGCView { } // Repeater } // Column } // Rectangle - } // Flickable + } // QGCFlickable } // QGCViewPanel } // QGCView diff --git a/src/QmlControls/ParameterEditor.qml b/src/QmlControls/ParameterEditor.qml index b0a137088bc795c4c16a9a4b90330f1147721658..1c70b9bc9712ece3097925be7819b532ade6faba 100644 --- a/src/QmlControls/ParameterEditor.qml +++ b/src/QmlControls/ParameterEditor.qml @@ -166,7 +166,7 @@ QGCView { Row { spacing: ScreenTools.defaultFontPixelWidth * 0.5 //-- Parameter Groups - Flickable { + QGCFlickable { id : groupScroll width: ScreenTools.defaultFontPixelWidth * 25 height: parent.height @@ -174,7 +174,6 @@ QGCView { pixelAligned: true contentHeight: groupedViewComponentColumn.height contentWidth: groupedViewComponentColumn.width - boundsBehavior: Flickable.OvershootBounds flickableDirection: Flickable.VerticalFlick Column { id: groupedViewComponentColumn @@ -222,7 +221,7 @@ QGCView { opacity: 0.1 } //-- Parameters - Flickable { + QGCFlickable { id: factScrollView width: parent.width - groupScroll.width height: parent.height @@ -249,7 +248,7 @@ QGCView { Component { id: searchResultsViewComponent Item { - Flickable { + QGCFlickable { id: factScrollView width: parent.width height: parent.height diff --git a/src/QmlControls/QGCFlickable.qml b/src/QmlControls/QGCFlickable.qml new file mode 100644 index 0000000000000000000000000000000000000000..52b1b0c44ec4608aee91356dcf10a1d793f68ef4 --- /dev/null +++ b/src/QmlControls/QGCFlickable.qml @@ -0,0 +1,20 @@ +import QtQuick 2.5 + +import QGroundControl.Palette 1.0 +import QGroundControl.ScreenTools 1.0 + +Flickable { + id: root + boundsBehavior: Flickable.StopAtBounds + + property color indicatorColor: qgcPal.text + + QGCPalette { id: qgcPal; colorGroupEnabled: enabled } + + Component.onCompleted: { + var indicatorComponent = Qt.createComponent("QGCFlickableVerticalIndicator.qml") + indicatorComponent.createObject(root) + indicatorComponent = Qt.createComponent("QGCFlickableHorizontalIndicator.qml") + indicatorComponent.createObject(root) + } +} diff --git a/src/QmlControls/QGCFlickableHorizontalIndicator.qml b/src/QmlControls/QGCFlickableHorizontalIndicator.qml new file mode 100644 index 0000000000000000000000000000000000000000..e5a4fc429b996135cfefc20a3bb39bce5209e1eb --- /dev/null +++ b/src/QmlControls/QGCFlickableHorizontalIndicator.qml @@ -0,0 +1,39 @@ +import QtQuick 2.5 + +Rectangle { + id: horizontalIndicator + anchors.bottomMargin: 2 + anchors.bottom: parent.bottom + x: parent.width * (parent.contentX / parent.contentWidth) + z: 10 + height: 2 + width: parent.width * (parent.width / parent.contentWidth) + color: parent.indicatorColor + visible: showIndicator + + property bool showIndicator: (parent.flickableDirection == Flickable.AutoFlickDirection || + parent.flickableDirection == Flickable.HorizontalFlick || + parent.flickableDirection == Flickable.HorizontalAndVerticalFlick) && + (parent.contentWidth > parent.width) + + Component.onCompleted: animateOpacity.restart() + onVisibleChanged: animateOpacity.restart() + onWidthChanged: animateOpacity.restart() + + Connections { + target: horizontalIndicator.parent + onMovementStarted: horizontalIndicator.opacity = 1.0 + onMovementEnded: animateOpacity.restart() + onContentHeightChanged: animateOpacity.restart() + } + + NumberAnimation { + id: animateOpacity + target: horizontalIndicator + properties: "opacity" + from: 1.0 + to: 0.0 + duration: 1000 + easing.type: Easing.InQuint + } +} diff --git a/src/QmlControls/QGCFlickableVerticalIndicator.qml b/src/QmlControls/QGCFlickableVerticalIndicator.qml new file mode 100644 index 0000000000000000000000000000000000000000..c20a832865ca864aa3dfb2582290a38eaaf10437 --- /dev/null +++ b/src/QmlControls/QGCFlickableVerticalIndicator.qml @@ -0,0 +1,39 @@ +import QtQuick 2.5 + +Rectangle { + id: verticalIndicator + anchors.rightMargin: 2 + anchors.right: parent.right + y: parent.height * (parent.contentY / parent.contentHeight) + z: 10 + width: 2 + height: parent.height * (parent.height / parent.contentHeight) + color: parent.indicatorColor + visible: showIndicator + + property bool showIndicator: (parent.flickableDirection == Flickable.AutoFlickDirection || + parent.flickableDirection == Flickable.VerticalFlick || + parent.flickableDirection == Flickable.HorizontalAndVerticalFlick) && + (parent.contentHeight > parent.height) + + Component.onCompleted: animateOpacity.restart() + onVisibleChanged: animateOpacity.restart() + onHeightChanged: animateOpacity.restart() + + Connections { + target: verticalIndicator.parent + onMovementStarted: verticalIndicator.opacity = 1.0 + onMovementEnded: animateOpacity.restart() + onContentHeightChanged: animateOpacity.restart() + } + + NumberAnimation { + id: animateOpacity + target: verticalIndicator + properties: "opacity" + from: 1.0 + to: 0.0 + duration: 1000 + easing.type: Easing.InQuint + } +} diff --git a/src/QmlControls/QGroundControl.Controls.qmldir b/src/QmlControls/QGroundControl.Controls.qmldir index 336948323d480626f10dc78b21b764bcfac49ca4..8484c1444c115f578ac61a1a2c23b1db7004c927 100644 --- a/src/QmlControls/QGroundControl.Controls.qmldir +++ b/src/QmlControls/QGroundControl.Controls.qmldir @@ -18,6 +18,7 @@ QGCButton 1.0 QGCButton.qml QGCCheckBox 1.0 QGCCheckBox.qml QGCColoredImage 1.0 QGCColoredImage.qml QGCComboBox 1.0 QGCComboBox.qml +QGCFlickable 1.0 QGCFlickable.qml QGCLabel 1.0 QGCLabel.qml QGCMovableItem 1.0 QGCMovableItem.qml QGCRadioButton 1.0 QGCRadioButton.qml diff --git a/src/VehicleSetup/SetupView.qml b/src/VehicleSetup/SetupView.qml index a9678a58885b642cee62943dec8a79c7dc65f424..e28859dd4d62c0995d2228c9bcda75593214373a 100644 --- a/src/VehicleSetup/SetupView.qml +++ b/src/VehicleSetup/SetupView.qml @@ -211,16 +211,13 @@ Rectangle { anchors.right: parent.right color: qgcPal.window - Flickable { + QGCFlickable { id: buttonScroll width: buttonColumn.width anchors.topMargin: _defaultTextHeight / 2 anchors.top: parent.top anchors.bottom: parent.bottom - clip: true contentHeight: buttonColumn.height - contentWidth: buttonColumn.width - boundsBehavior: Flickable.StopAtBounds flickableDirection: Flickable.VerticalFlick Column { diff --git a/src/VehicleSetup/VehicleSummary.qml b/src/VehicleSetup/VehicleSummary.qml index ed126b21bc7874ad81cf3bbba0fec57cde5ae643..a0230e7b6f01d5eb394659a4f92e35d710fb7b16 100644 --- a/src/VehicleSetup/VehicleSummary.qml +++ b/src/VehicleSetup/VehicleSummary.qml @@ -75,13 +75,12 @@ Rectangle { computeSummaryBoxSize() } - Flickable { + QGCFlickable { clip: true anchors.fill: parent contentHeight: summaryColumn.height contentWidth: _summaryRoot.width flickableDirection: Flickable.VerticalFlick - boundsBehavior: Flickable.StopAtBounds Column { id: summaryColumn diff --git a/src/ui/MainWindowInner.qml b/src/ui/MainWindowInner.qml index 6a9f019ad86494e17deffcbf833be9026db9056b..16c47d0dbdd8b94ce2ca5300d0981d45f533d44a 100644 --- a/src/ui/MainWindowInner.qml +++ b/src/ui/MainWindowInner.qml @@ -346,13 +346,12 @@ Item { anchors.horizontalCenter: parent.horizontalCenter anchors.top: parent.top anchors.topMargin: tbHeight + ScreenTools.defaultFontPixelHeight - Flickable { + QGCFlickable { id: messageFlick anchors.margins: ScreenTools.defaultFontPixelHeight anchors.fill: parent contentHeight: messageText.height contentWidth: messageText.width - boundsBehavior: Flickable.StopAtBounds pixelAligned: true clip: true TextEdit { diff --git a/src/ui/preferences/GeneralSettings.qml b/src/ui/preferences/GeneralSettings.qml index 4b76e1dade3913f20b2a66d77fb87ef46cb3fd70..7762d23481941885914a47e2015959167aa32a70 100644 --- a/src/ui/preferences/GeneralSettings.qml +++ b/src/ui/preferences/GeneralSettings.qml @@ -45,13 +45,12 @@ Rectangle { colorGroupEnabled: enabled } - Flickable { + QGCFlickable { clip: true anchors.fill: parent contentHeight: settingsColumn.height contentWidth: _generalRoot.width flickableDirection: Flickable.VerticalFlick - boundsBehavior: Flickable.StopAtBounds Column { id: settingsColumn diff --git a/src/ui/preferences/LinkSettings.qml b/src/ui/preferences/LinkSettings.qml index a016aa3fde8099d93c1be2a807ccb3d5b0cc5e75..e1d5695d19a2c110ffac7d02fce20b5460251192 100644 --- a/src/ui/preferences/LinkSettings.qml +++ b/src/ui/preferences/LinkSettings.qml @@ -58,7 +58,7 @@ Rectangle { settingLoader.sourceComponent = null } - Flickable { + QGCFlickable { clip: true anchors.top: parent.top width: parent.width @@ -66,7 +66,6 @@ Rectangle { contentHeight: settingsColumn.height contentWidth: _linkRoot.width flickableDirection: Flickable.VerticalFlick - boundsBehavior: Flickable.StopAtBounds Column { id: settingsColumn @@ -201,7 +200,7 @@ Rectangle { editConfig = null } } - Flickable { + QGCFlickable { id: settingsFlick clip: true anchors.top: parent.top diff --git a/src/ui/preferences/MavlinkSettings.qml b/src/ui/preferences/MavlinkSettings.qml index ea2541f27612b718766ba377cfc7f24e4555ed19..bab7f760d395884c404d3100475273e9ec53f49b 100644 --- a/src/ui/preferences/MavlinkSettings.qml +++ b/src/ui/preferences/MavlinkSettings.qml @@ -43,14 +43,13 @@ Rectangle { colorGroupEnabled: enabled } - Flickable { + QGCFlickable { clip: true anchors.fill: parent anchors.margins: ScreenTools.defaultFontPixelWidth contentHeight: settingsColumn.height contentWidth: __mavlinkRoot.width flickableDirection: Flickable.VerticalFlick - boundsBehavior: Flickable.StopAtBounds Column { id: settingsColumn