diff --git a/containments/desktop/package/contents/ui/FolderItemDelegate.qml b/containments/desktop/package/contents/ui/FolderItemDelegate.qml --- a/containments/desktop/package/contents/ui/FolderItemDelegate.qml +++ b/containments/desktop/package/contents/ui/FolderItemDelegate.qml @@ -52,9 +52,13 @@ anchors.fill: parent + visible: status === Loader.Ready + active: !model.blank sourceComponent: delegateImplementation + + asynchronous: true } Component { @@ -72,39 +76,54 @@ property QtObject popupDialog: null property Item iconArea: icon property Item label: label - property Item labelArea: textShadow + property Item labelArea: frameLoader.textShadow || label property Item actionsOverlay: actions property Item hoverArea: toolTip property Item toolTip: toolTip + property Item selectionButton: null property Item popupButton: null onSelectedChanged: { if (selected && !blank) { - frame.grabToImage(function(result) { - dir.addItemDragImage(positioner.map(index), main.x + frame.x, main.y + frame.y, frame.width, frame.height, result.image); + frameLoader.grabToImage(function(result) { + dir.addItemDragImage(positioner.map(index), main.x + frameLoader.x, main.y + frameLoader.y, frameLoader.width, frameLoader.height, result.image); }); } } - onIsDirChanged: { - if (isDir && main.GridView.view.isRootView && impl.popupButton == null) { - impl.popupButton = popupButtonComponent.createObject(actions); - } else if (impl.popupButton) { - impl.popupButton.destroy(); - impl.popupButton = null; - } - } - onHoveredChanged: { - if (hovered && (!main.GridView.view.isRootView || root.containsDrag) && model.isDir) { - hoverActivateTimer.restart(); - } else if (!hovered) + if (hovered) { + if (plasmoid.configuration.selectionMarkers && Qt.styleHints.singleClickActivation) { + selectionButton = selectionButtonComponent.createObject(actions); + } + + if (model.isDir) { + if (!main.GridView.view.isRootView || root.containsDrag) { + hoverActivateTimer.restart(); + } + + if (plasmoid.configuration.popups && !root.useListViewMode) { + popupButton = popupButtonComponent.createObject(actions); + } + } + } else if (!hovered) { hoverActivateTimer.stop(); if (popupDialog != null) { popupDialog.requestDestroy(); popupDialog = null; } + + if (selectionButton) { + selectionButton.destroy(); + selectionButton = null; + } + + if (popupButton) { + popupButton.destroy(); + popupButton = null; + } + } } function openPopup() { @@ -116,39 +135,11 @@ } } - Timer { - id: hoverActivateTimer - - interval: root.hoverActivateDelay - - onTriggered: { - if (root.useListViewMode) { - doCd(index); - } else { - impl.openPopup(); - } - } - } - - Connections { - target: main.GridView.view - - enabled: hovered - - onContentXChanged: { - hoverActivateTimer.stop(); - } - - onContentYChanged: { - hoverActivateTimer.stop(); - } - } - PlasmaCore.ToolTipArea { id: toolTip - x: frame.x + Math.min(icon.x, label.x) - y: frame.y + icon.y + x: frameLoader.x + Math.min(icon.x, label.x) + y: frameLoader.y + icon.y width: Math.max(icon.width, label.width) height: (label.y + label.paintedHeight) @@ -173,12 +164,19 @@ } } - PlasmaCore.FrameSvgItem { - id: frame + Loader { + id: frameLoader x: root.useListViewMode ? 0 : units.smallSpacing y: root.useListViewMode ? 0 : units.smallSpacing + property Item textShadow: null + property string prefix: "" + + sourceComponent: frameComponent + active: state !== "" + asynchronous: true + width: { if (root.useListViewMode) { if (main.GridView.view.overflowing) { @@ -200,139 +198,105 @@ * theme.mSize(theme.defaultFont).height) + (2 * units.largeSpacing)); } - visible: !model.blank - enabled: visible - - imagePath: "widgets/viewitem" - - PlasmaCore.ColorScope { - anchors.fill: parent + PlasmaCore.IconItem { + id: icon - colorGroup: ((root.isContainment && main.GridView.view.isRootView) ? PlasmaCore.Theme.ComplementaryColorGroup - : PlasmaCore.Theme.NormalColorGroup) + z: 2 - PlasmaCore.IconItem { - id: icon + states: [ + State { // icon view + when: !root.useListViewMode - states: [ - State { // icon view - when: !root.useListViewMode - - AnchorChanges { - target: icon - anchors.top: parent.top - anchors.horizontalCenter: parent.horizontalCenter - } - }, - State { // list view - when: root.useListViewMode - - AnchorChanges { - target: icon - anchors.left: parent.left - anchors.verticalCenter: parent.verticalCenter - } + AnchorChanges { + target: icon + anchors.top: parent.top + anchors.horizontalCenter: parent.horizontalCenter + } + }, + State { // list view + when: root.useListViewMode + + AnchorChanges { + target: icon + anchors.left: parent.left + anchors.verticalCenter: parent.verticalCenter } - ] - - anchors { - topMargin: units.largeSpacing - leftMargin: units.smallSpacing } + ] - width: root.useListViewMode ? main.GridView.view.iconSize : (parent.width - 2 * units.smallSpacing) - height: main.GridView.view.iconSize - - opacity: root.useListViewMode ? (1.3 - selectionButton.opacity) : 1.0 - - animated: false - usesPlasmaTheme: false - - source: model.decoration - overlays: model.overlays - } - - TextMetrics { - id: labelMetrics - - font: label.font - elide: Text.ElideNone - text: label.text + anchors { + topMargin: units.largeSpacing + leftMargin: units.smallSpacing } - DropShadow { - id: textShadow + width: root.useListViewMode ? main.GridView.view.iconSize : (parent.width - 2 * units.smallSpacing) + height: main.GridView.view.iconSize - anchors.fill: label + opacity: root.useListViewMode && selectionButton ? 0.3 : 1.0 - visible: (root.isContainment && main.GridView.view.isRootView) + animated: false + usesPlasmaTheme: false - horizontalOffset: 2 - verticalOffset: 2 + source: model.decoration + overlays: model.overlays + } - radius: 9.0 - samples: 18 - spread: 0.15 + PlasmaComponents.Label { + id: label - color: "black" + z: 2 // So we can position a textShadowComponent below if needed. - source: label - } + states: [ + State { // icon view + when: !root.useListViewMode - PlasmaComponents.Label { - id: label - - states: [ - State { // icon view - when: !root.useListViewMode - - AnchorChanges { - target: label - anchors.top: icon.bottom - anchors.horizontalCenter: parent.horizontalCenter - } - PropertyChanges { - target: label - anchors.topMargin: 2 * units.smallSpacing - width: Math.min(labelMetrics.advanceWidth + units.smallSpacing, parent.width - units.smallSpacing * 8) - maximumLineCount: plasmoid.configuration.textLines - horizontalAlignment: Text.AlignHCenter - } - }, - State { // list view - when: root.useListViewMode - - AnchorChanges { - target: label - anchors.left: icon.right - anchors.verticalCenter: parent.verticalCenter - } - PropertyChanges { - target: label - anchors.leftMargin: units.smallSpacing * 2 - anchors.rightMargin: units.smallSpacing * 2 - width: parent.width - icon.width - (units.smallSpacing * 4) - maximumLineCount: 1 - horizontalAlignment: Text.AlignLeft - } + AnchorChanges { + target: label + anchors.top: icon.bottom + anchors.horizontalCenter: parent.horizontalCenter + } + PropertyChanges { + target: label + anchors.topMargin: 2 * units.smallSpacing + width: Math.min(label.implicitWidth + units.smallSpacing, parent.width - units.smallSpacing * 8) + maximumLineCount: plasmoid.configuration.textLines + horizontalAlignment: Text.AlignHCenter + } + }, + State { // list view + when: root.useListViewMode + + AnchorChanges { + target: label + anchors.left: icon.right + anchors.verticalCenter: parent.verticalCenter } - ] + PropertyChanges { + target: label + anchors.leftMargin: units.smallSpacing * 2 + anchors.rightMargin: units.smallSpacing * 2 + width: parent.width - icon.width - (units.smallSpacing * 4) + maximumLineCount: 1 + horizontalAlignment: Text.AlignLeft + } + } + ] - height: undefined // Unset PlasmaComponents.Label's default. + height: undefined // Unset PlasmaComponents.Label's default. - textFormat: Text.PlainText + textFormat: Text.PlainText - wrapMode: Text.Wrap - elide: Text.ElideRight + wrapMode: Text.Wrap + elide: Text.ElideRight - color: textShadow.visible ? "white" : PlasmaCore.ColorScope.textColor + color: (frameLoader.textShadow && frameLoader.textShadow.visible + ? "#fff" : PlasmaCore.ColorScope.textColor) - text: model.blank ? "" : model.display + text: model.blank ? "" : model.display - font.italic: model.isLink + font.italic: model.isLink - Component.onCompleted: textFix.disableMouseHandling(label) // FIXME TODO: See https://codereview.qt-project.org/#/c/113758/ - } + Component.onCompleted: textFix.disableMouseHandling(label) // FIXME TODO: See https://codereview.qt-project.org/#/c/113758/ } Column { @@ -357,19 +321,30 @@ x: units.smallSpacing * 3 y: units.smallSpacing * 3 + z: 3 + anchors { centerIn: root.useListViewMode ? icon : undefined } width: implicitWidth height: implicitHeight + } - FolderItemActionButton { - id: selectionButton + Component { + id: frameComponent + + PlasmaCore.FrameSvgItem { + prefix: frameLoader.prefix + + imagePath: "widgets/viewitem" + } + } - visible: plasmoid.configuration.selectionMarkers && Qt.styleHints.singleClickActivation - opacity: (visible && impl.hovered) ? 1.0 : 0.0 + Component { + id: selectionButtonComponent + FolderItemActionButton { element: model.selected ? "remove" : "add" onClicked: dir.toggleSelected(positioner.map(index)) @@ -380,13 +355,32 @@ id: popupButtonComponent FolderItemActionButton { - visible: !root.useListViewMode - - opacity: (plasmoid.configuration.popups && impl.hovered && impl.popupDialog == null) ? 1.0 : 0.0 + visible: popupDialog == null element: "open" - onClicked: impl.openPopup() + onClicked: openPopup() + } + } + + Component { + id: textShadowComponent + + DropShadow { + anchors.fill: label + + z: 1 + + horizontalOffset: 2 + verticalOffset: 2 + + radius: 9.0 + samples: 18 + spread: 0.15 + + color: "black" + + source: label } } @@ -396,30 +390,36 @@ when: model.selected PropertyChanges { - target: frame + target: frameLoader prefix: "selected" } }, State { name: "hover" when: hovered && !model.selected PropertyChanges { - target: frame + target: frameLoader prefix: "hover" } }, State { name: "selected+hover" when: hovered && model.selected PropertyChanges { - target: frame + target: frameLoader prefix: "selected+hover" } } ] } + + Component.onCompleted: { + if (root.isContainment && main.GridView.view.isRootView) { + frameLoader.textShadow = textShadowComponent.createObject(frameLoader); + } + } } } } diff --git a/containments/desktop/package/contents/ui/FolderView.qml b/containments/desktop/package/contents/ui/FolderView.qml --- a/containments/desktop/package/contents/ui/FolderView.qml +++ b/containments/desktop/package/contents/ui/FolderView.qml @@ -432,6 +432,24 @@ } } + Timer { + id: hoverActivateTimer + + interval: root.hoverActivateDelay + + onTriggered: { + if (!hoveredItem) { + return; + } + + if (root.useListViewMode) { + doCd(index); + } else { + hoveredItem.openPopup(); + } + } + } + PlasmaExtras.ScrollArea { id: scrollArea @@ -493,6 +511,10 @@ } onContentXChanged: { + if (hoveredItem) { + hoverActivateTimer.stop(); + } + dir.setDragHotSpotScrollOffset(contentX, contentY); if (contentX == 0) { @@ -522,6 +544,10 @@ } onContentYChanged: { + if (hoveredItem) { + hoverActivateTimer.stop(); + } + dir.setDragHotSpotScrollOffset(contentX, contentY); if (contentY == 0) { diff --git a/containments/desktop/package/contents/ui/FolderViewLayer.qml b/containments/desktop/package/contents/ui/FolderViewLayer.qml --- a/containments/desktop/package/contents/ui/FolderViewLayer.qml +++ b/containments/desktop/package/contents/ui/FolderViewLayer.qml @@ -188,37 +188,46 @@ } } - FolderView { - id: folderView + PlasmaCore.ColorScope { + id: colorScope anchors.left: parent.left anchors.top: parent.top anchors.topMargin: folderViewLayerComponent.label != null ? folderViewLayerComponent.label.height : 0 anchors.right: parent.right anchors.bottom: parent.bottom - isRootView: true + colorGroup: (root.isContainment ? PlasmaCore.Theme.ComplementaryColorGroup + : PlasmaCore.Theme.NormalColorGroup) - url: plasmoid.configuration.url - locked: (plasmoid.configuration.locked || !isContainment) - filterMode: plasmoid.configuration.filterMode - filterPattern: plasmoid.configuration.filterPattern - filterMimeTypes: plasmoid.configuration.filterMimeTypes + FolderView { + id: folderView - flow: (plasmoid.configuration.arrangement == 0) ? GridView.FlowLeftToRight : GridView.FlowTopToBottom - layoutDirection: (plasmoid.configuration.alignment == 0) ? Qt.LeftToRight : Qt.RightToLeft + anchors.fill: parent - onSortModeChanged: { - plasmoid.configuration.sortMode = sortMode; - } + isRootView: true - onPositionsChanged: { - plasmoid.configuration.positions = folderView.positions; - } + url: plasmoid.configuration.url + locked: (plasmoid.configuration.locked || !isContainment) + filterMode: plasmoid.configuration.filterMode + filterPattern: plasmoid.configuration.filterPattern + filterMimeTypes: plasmoid.configuration.filterMimeTypes - Component.onCompleted: { - folderView.sortMode = plasmoid.configuration.sortMode; - folderView.positions = plasmoid.configuration.positions; + flow: (plasmoid.configuration.arrangement == 0) ? GridView.FlowLeftToRight : GridView.FlowTopToBottom + layoutDirection: (plasmoid.configuration.alignment == 0) ? Qt.LeftToRight : Qt.RightToLeft + + onSortModeChanged: { + plasmoid.configuration.sortMode = sortMode; + } + + onPositionsChanged: { + plasmoid.configuration.positions = folderView.positions; + } + + Component.onCompleted: { + folderView.sortMode = plasmoid.configuration.sortMode; + folderView.positions = plasmoid.configuration.positions; + } } }