QmlDesigner: Add QML views transient scrollbars

* Add transient scrollbars to all QML based views
* Remove version from QtQuick imports
* Fix missing AssetsLibraryBackend reference in AssetsDelegate

Task-number: QDS-9549
Change-Id: I7ab2e52106efae07caa37763b5b0592cfbf57c2e
Reviewed-by: Qt CI Patch Build Bot <ci_patchbuild_bot@qt.io>
Reviewed-by: <github-actions-qt-creator@cristianadam.eu>
Reviewed-by: Thomas Hartmann <thomas.hartmann@qt.io>
This commit is contained in:
Henning Gruendl
2023-08-25 16:53:39 +02:00
committed by Henning Gründl
parent b30337e04c
commit b2ee8acafa
21 changed files with 236 additions and 66 deletions

View File

@@ -156,7 +156,7 @@ TreeViewDelegate {
mouseArea.allowTooltip = true
}
onPositionChanged: tooltipBackend.reposition()
onPositionChanged: AssetsLibraryBackend.tooltipBackend.reposition()
onPressed: (mouse) => {
mouseArea.forceActiveFocus()

View File

@@ -260,10 +260,12 @@ Item {
AssetsView {
id: assetsView
assetsRoot: root
contextMenu: contextMenu
width: parent.width
height: parent.height - assetsView.y
assetsRoot: root
contextMenu: contextMenu
focus: true
}
}

View File

@@ -15,6 +15,11 @@ TreeView {
boundsBehavior: Flickable.StopAtBounds
rowSpacing: 5
property bool adsFocus: false
// objectName is used by the dock widget to find this particular ScrollView
// and set the ads focus on it.
objectName: "__mainSrollView"
property var assetsModel: AssetsLibraryBackend.assetsModel
property var rootView: AssetsLibraryBackend.rootView
property var tooltipBackend: AssetsLibraryBackend.tooltipBackend
@@ -46,9 +51,18 @@ TreeView {
return -1
}
ScrollBar.vertical: HelperWidgets.VerticalScrollBar {
HoverHandler { id: hoverHandler }
ScrollBar.vertical: HelperWidgets.ScrollBar {
id: verticalScrollBar
scrollBarVisible: root.contentHeight > root.height
parent: root
x: root.width - verticalScrollBar.width
y: 0
height: root.availableHeight
orientation: Qt.Vertical
show: (hoverHandler.hovered || root.adsFocus || verticalScrollBar.inUse)
&& verticalScrollBar.isNeeded
}
model: assetsModel

View File

@@ -1,8 +1,7 @@
// Copyright (C) 2022 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0
import QtQuick 2.15
import QtQuick.Layouts 1.15
import QtQuick
import QtQuickDesignerTheme 1.0
import HelperWidgets 2.0
import StudioTheme 1.0 as StudioTheme

View File

@@ -1,7 +1,7 @@
// Copyright (C) 2022 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0
import QtQuick 2.15
import QtQuick
import QtQuickDesignerTheme 1.0
import HelperWidgets 2.0
@@ -56,12 +56,12 @@ PropertyEditorPane {
anchors.left: parent.left
anchors.right: parent.right
visible: theSource !== ""
visible: specificsTwo.theSource !== ""
sourceComponent: specificQmlComponent
onTheSourceChanged: {
active = false
active = true
specificsTwo.active = false
specificsTwo.active = true
}
}

View File

@@ -1,9 +1,9 @@
// Copyright (C) 2021 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0
import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import HelperWidgets 2.0
import StudioControls 1.0 as StudioControls
import StudioTheme 1.0 as StudioTheme
@@ -116,12 +116,12 @@ PropertyEditorPane {
anchors.left: parent.left
anchors.right: parent.right
visible: theSource !== ""
visible: specificsTwo.theSource !== ""
sourceComponent: specificQmlComponent
onTheSourceChanged: {
active = false
active = true
specificsTwo.active = false
specificsTwo.active = true
}
}

View File

@@ -1,8 +1,8 @@
// Copyright (C) 2021 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0
import QtQuick 2.15
import QtQuick.Layouts 1.15
import QtQuick
import QtQuick.Layouts
import QtQuickDesignerTheme 1.0
import HelperWidgets 2.0
import StudioTheme 1.0 as StudioTheme

View File

@@ -1,8 +1,8 @@
// Copyright (C) 2021 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0
import QtQuick 2.15
import QtQuick.Layouts 1.15
import QtQuick
import QtQuick.Layouts
import QtQuickDesignerTheme 1.0
import HelperWidgets 2.0
import StudioTheme 1.0 as StudioTheme
@@ -25,16 +25,17 @@ PropertyEditorPane {
Loader {
id: specificsTwo
anchors.left: parent.left
anchors.right: parent.right
visible: theSource !== ""
sourceComponent: specificQmlComponent
property string theSource: specificQmlData
anchors.left: parent.left
anchors.right: parent.right
visible: specificsTwo.theSource !== ""
sourceComponent: specificQmlComponent
onTheSourceChanged: {
active = false
active = true
specificsTwo.active = false
specificsTwo.active = true
}
}

View File

@@ -1,15 +1,16 @@
// Copyright (C) 2021 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0
import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import QtQuickDesignerTheme 1.0
import HelperWidgets 2.0
import HelperWidgets 2.0 as HelperWidgets
import StudioTheme 1.0 as StudioTheme
Rectangle {
id: itemPane
width: 320
height: 400
color: Theme.qmlDesignerBackgroundColorDarkAlternate()
@@ -19,8 +20,7 @@ Rectangle {
default property alias content: mainColumn.children
// Called from C++ to close context menu on focus out
function closeContextMenu()
{
function closeContextMenu() {
Controller.closeContextMenu()
}
@@ -29,9 +29,9 @@ Rectangle {
onClicked: forceActiveFocus()
}
ScrollView {
HelperWidgets.ScrollView {
id: mainScrollView
clip: true
//clip: true
anchors.fill: parent
interactive: !Controller.contextMenuOpened

View File

@@ -0,0 +1,89 @@
// Copyright (C) 2023 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0
import QtQuick
import QtQuick.Templates as T
import StudioTheme 1.0 as StudioTheme
T.ScrollBar {
id: control
property bool show: false
property bool otherInUse: false
property bool isNeeded: control.size < 1.0
property bool inUse: control.hovered || control.pressed
property int thickness: control.inUse || control.otherInUse ? 10 : 8
property bool scrollBarVisible: parent.childrenRect.height > parent.height
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
implicitContentWidth + leftPadding + rightPadding)
implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
implicitContentHeight + topPadding + bottomPadding)
hoverEnabled: true
padding: 0
minimumSize: orientation === Qt.Horizontal ? height / width : width / height
opacity: 0.0
contentItem: Rectangle {
implicitWidth: control.thickness
implicitHeight: control.thickness
radius: width / 2
color: "#D9D9D9"
}
background: Rectangle {
id: controlTrack
color: "#D9D9D9"
opacity: control.inUse || control.otherInUse ? 0.3 : 0.0
radius: width / 2
Behavior on opacity {
PropertyAnimation {
duration: 100
easing.type: Easing.InOutQuad
}
}
}
states: [
State {
name: "show"
when: control.show
PropertyChanges {
target: control
opacity: 1.0
}
},
State {
name: "hide"
when: !control.show
PropertyChanges {
target: control
opacity: 0.0
}
}
]
transitions: Transition {
from: "show"
SequentialAnimation {
PauseAnimation { duration: 450 }
NumberAnimation {
target: control
duration: 200
property: "opacity"
to: 0.0
}
}
}
Behavior on thickness {
PropertyAnimation {
duration: 100
easing.type: Easing.InOutQuad
}
}
}

View File

@@ -1,8 +1,8 @@
// Copyright (C) 2021 The Qt Company Ltd.
// Copyright (C) 2023 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0
import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick
//import QtQuick.Controls as C
import StudioTheme 1.0 as StudioTheme
Flickable {
@@ -12,29 +12,54 @@ Flickable {
property alias verticalThickness: verticalScrollBar.width
readonly property bool verticalScrollBarVisible: verticalScrollBar.scrollBarVisible
readonly property bool horizontalScrollBarVisible: horizontalScrollBar.scrollBarVisible
readonly property bool bothVisible: verticalScrollBarVisible && horizontalScrollBarVisible
readonly property bool bothVisible: flickable.verticalScrollBarVisible
&& flickable.horizontalScrollBarVisible
property real temporaryHeight: 0
contentWidth: areaItem.childrenRect.width
contentHeight: Math.max(areaItem.childrenRect.height, flickable.temporaryHeight)
boundsBehavior: Flickable.StopAtBounds
default property alias content: areaItem.children
Item {
id: areaItem
}
property bool adsFocus: false
// objectName is used by the dock widget to find this particular ScrollView
// and set the ads focus on it.
objectName: "__mainSrollView"
ScrollBar.horizontal: HorizontalScrollBar {
HoverHandler { id: hoverHandler }
ScrollBar.horizontal: ScrollBar {
id: horizontalScrollBar
parent: flickable
scrollBarVisible: flickable.contentWidth > flickable.width
x: 0
y: flickable.height - horizontalScrollBar.height
width: flickable.availableWidth - (verticalScrollBar.isNeeded ? verticalScrollBar.thickness : 0)
orientation: Qt.Horizontal
show: (hoverHandler.hovered || flickable.focus || flickable.adsFocus
|| horizontalScrollBar.inUse || horizontalScrollBar.otherInUse)
&& horizontalScrollBar.isNeeded
otherInUse: verticalScrollBar.inUse
}
ScrollBar.vertical: VerticalScrollBar {
ScrollBar.vertical: ScrollBar {
id: verticalScrollBar
parent: flickable
scrollBarVisible: flickable.contentHeight > flickable.height
x: flickable.width - verticalScrollBar.width
y: 0
height: flickable.availableHeight - (horizontalScrollBar.isNeeded ? horizontalScrollBar.thickness : 0)
orientation: Qt.Vertical
show: (hoverHandler.hovered || flickable.focus || flickable.adsFocus
|| horizontalScrollBar.inUse || horizontalScrollBar.otherInUse)
&& verticalScrollBar.isNeeded
otherInUse: horizontalScrollBar.inUse
}
contentWidth: areaItem.childrenRect.width
contentHeight: Math.max(areaItem.childrenRect.height, flickable.temporaryHeight)
boundsMovement: Flickable.StopAtBounds
boundsBehavior: Flickable.StopAtBounds
Item { id: areaItem }
}

View File

@@ -59,6 +59,7 @@ PropertyEditorPane 2.0 PropertyEditorPane.qml
PropertyLabel 2.0 PropertyLabel.qml
PaddingSection 2.0 PaddingSection.qml
RoundedPanel 2.0 RoundedPanel.qml
ScrollBar 2.0 ScrollBar.qml
ScrollView 2.0 ScrollView.qml
SecondColumnLayout 2.0 SecondColumnLayout.qml
Section 2.0 Section.qml

View File

@@ -24,7 +24,7 @@
****************************************************************************/
import QtQuick
import QtQuick.Controls
import QtQuick.Controls.Basic as Basic
import StatesEditor
import HelperWidgets 2.0 as HelperWidgets
import StudioControls 1.0 as StudioControls
@@ -567,28 +567,42 @@ Rectangle {
height: root.isLandscape ? root.height - toolBar.height - (2 * root.padding) : root.scrollViewHeight
clip: true
ScrollView {
Basic.ScrollView {
id: scrollView
property bool adsFocus: false
// objectName is used by the dock widget to find this particular ScrollView
// and set the ads focus on it.
objectName: "__mainSrollView"
anchors.fill: parent
anchors.topMargin: root.topMargin
anchors.leftMargin: root.leftMargin
ScrollBar.horizontal: StateScrollBar {
ScrollBar.horizontal: HelperWidgets.ScrollBar {
id: horizontalBar
parent: scrollView
x: scrollView.leftPadding
y: scrollView.height - height
width: scrollView.availableWidth
orientation: Qt.Horizontal
show: (scrollView.hovered || scrollView.focus || scrollView.adsFocus)
&& horizontalBar.isNeeded
otherInUse: verticalBar.inUse
}
ScrollBar.vertical: StateScrollBar {
ScrollBar.vertical: HelperWidgets.ScrollBar {
id: verticalBar
parent: scrollView
x: scrollView.mirrored ? 0 : scrollView.width - width
y: scrollView.topPadding
height: scrollView.availableHeight
orientation: Qt.Vertical
show: (scrollView.hovered || scrollView.focus || scrollView.adsFocus)
&& verticalBar.isNeeded
otherInUse: horizontalBar.inUse
}
Flickable {

View File

@@ -1,8 +1,7 @@
// Copyright (C) 2022 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0
import QtQuick 2.15
import QtQuick.Layouts 1.15
import QtQuick
import QtQuickDesignerTheme 1.0
import HelperWidgets 2.0
import StudioTheme 1.0 as StudioTheme

View File

@@ -1,7 +1,7 @@
// Copyright (C) 2022 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0
import QtQuick 2.15
import QtQuick
import QtQuickDesignerTheme 1.0
import HelperWidgets 2.0
@@ -44,12 +44,12 @@ PropertyEditorPane {
anchors.left: parent.left
anchors.right: parent.right
visible: theSource !== ""
visible: specificsTwo.theSource !== ""
sourceComponent: specificQmlComponent
onTheSourceChanged: {
active = false
active = true
specificsTwo.active = false
specificsTwo.active = true
}
}

View File

@@ -1,5 +1,5 @@
add_qtc_library(AdvancedDockingSystem
DEPENDS Qt::Widgets Qt::Core Qt::Gui Qt::Xml Utils
DEPENDS Qt::Widgets Qt::Core Qt::Gui Qt::Xml Qt::QuickWidgets Utils
SOURCES
ads_globals.cpp ads_globals.h
advanceddockingsystemtr.h

View File

@@ -6,7 +6,6 @@
#include "ads_globals.h"
#include "ads_globals_p.h"
#include "autohidedockcontainer.h"
#include "autohidesidebar.h"
#include "autohidetab.h"
#include "dockareawidget.h"
#include "dockcomponentsfactory.h"
@@ -20,6 +19,7 @@
#include <QEvent>
#include <QLoggingCategory>
#include <QPointer>
#include <QQuickItem>
#include <QScrollArea>
#include <QSplitter>
#include <QStack>
@@ -27,6 +27,7 @@
#include <QToolBar>
#include <QWindow>
#include <QXmlStreamWriter>
#include <QtQuickWidgets/QQuickWidget>
namespace ADS {
/**
@@ -452,8 +453,25 @@ void DockWidget::setFocused(bool focused)
return;
d->m_focused = focused;
if (d->m_scrollArea)
d->m_scrollArea->setProperty("focused", focused);
QList<QQuickWidget *> quickWidgets = d->m_widget->findChildren<QQuickWidget *>();
for (const auto &quickWidget : std::as_const(quickWidgets)) {
QQuickItem *rootItem = quickWidget->rootObject();
if (!rootItem)
continue;
QQuickItem *scrollView = rootItem->findChild<QQuickItem *>("__mainSrollView");
if (!scrollView)
continue;
scrollView->setProperty("adsFocus", focused);
}
emit focusedChanged();
}
bool DockWidget::isFocused() const

View File

@@ -32,7 +32,7 @@ class AutoHideSideBar;
class ADS_EXPORT DockWidget : public QFrame
{
Q_OBJECT
Q_PROPERTY(bool focused READ isFocused WRITE setFocused)
Q_PROPERTY(bool focused READ isFocused WRITE setFocused NOTIFY focusedChanged)
private:
DockWidgetPrivate *d; ///< private data (pimpl)
@@ -639,6 +639,8 @@ signals:
* The features parameter gives the new value of the property.
*/
void featuresChanged(DockWidgetFeatures features);
void focusedChanged();
}; // class DockWidget
} // namespace ADS

View File

@@ -13,10 +13,11 @@
#include <bindingproperty.h>
#include <nodeabstractproperty.h>
#include <variantproperty.h>
#include <signalhandlerproperty.h>
#include <qmldesignerplugin.h>
#include <variantproperty.h>
#include <viewmanager.h>
#include <qmldesignerconstants.h>
#include <qmldesignerplugin.h>
#include <studioquickwidget.h>
@@ -59,7 +60,7 @@ public:
this,
&ConnectionViewQuickWidget::reloadQmlSource);
//setObjectName(Constants::OBJECT_NAME_STATES_EDITOR);
quickWidget()->setObjectName(Constants::OBJECT_NAME_CONNECTION_EDITOR);
setResizeMode(QQuickWidget::SizeRootObjectToView);
setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

View File

@@ -168,6 +168,7 @@ const char OBJECT_NAME_TOP_FEEDBACK[] = "QQuickWidgetQDSFeedback";
const char OBJECT_NAME_NEW_DIALOG[] = "QQuickWidgetQDSNewDialog";
const char OBJECT_NAME_SPLASH_SCREEN[] = "QQuickWidgetSplashScreen";
const char OBJECT_NAME_WELCOME_PAGE[] = "QQuickWidgetQDSWelcomePage";
const char OBJECT_NAME_CONNECTION_EDITOR[] = "QQuickWidgetConnectionEditor";
const char ENVIRONMENT_SHOW_QML_ERRORS[] = "QMLDESIGNER_SHOW_QML_ERRORS";

View File

@@ -147,6 +147,7 @@ public:
class QMLDESIGNERBASE_EXPORT StudioQuickWidget : public QWidget
{
Q_OBJECT
public:
explicit StudioQuickWidget(QWidget *parent = nullptr);
@@ -168,6 +169,9 @@ public:
StudioPropertyMap *registerPropertyMap(const QByteArray &name);
QQuickWidget *quickWidget() const;
signals:
void adsFocusChanged();
private:
QQuickWidget *m_quickWidget = nullptr;
};