diff --git a/containments/panel/package/contents/ui/DrawerBackground.qml b/containments/panel/package/contents/ui/DrawerBackground.qml index 1e158fe8..e922de7e 100644 --- a/containments/panel/package/contents/ui/DrawerBackground.qml +++ b/containments/panel/package/contents/ui/DrawerBackground.qml @@ -14,35 +14,17 @@ import org.kde.kirigami 2.12 as Kirigami QQC2.Control { id: root - - required property color backgroundColor - - leftPadding: units.largeSpacing - topPadding: units.largeSpacing - rightPadding: units.largeSpacing - bottomPadding: units.largeSpacing - background: Item { + leftPadding: frameSvg.margins.left + topPadding: frameSvg.margins.top + rightPadding: frameSvg.margins.right + bottomPadding: frameSvg.margins.bottom + + background: PlasmaCore.FrameSvgItem { + id: frameSvg + imagePath: "widgets/background" MouseArea { anchors.fill: parent } - PlasmaCore.FrameSvgItem { - imagePath: "widgets/panel-background" - prefix: "shadow" - anchors.fill: container - anchors.margins: -PlasmaCore.Units.smallSpacing - } - Rectangle { - id: container - color: backgroundColor - anchors { - fill: parent - leftMargin: PlasmaCore.Units.smallSpacing - rightMargin: PlasmaCore.Units.smallSpacing - topMargin: PlasmaCore.Units.smallSpacing - bottomMargin: PlasmaCore.Units.smallSpacing - } - radius: PlasmaCore.Units.smallSpacing - } } } diff --git a/containments/panel/package/contents/ui/FullContainer.qml b/containments/panel/package/contents/ui/FullContainer.qml index 2f1e2c1a..688899bd 100644 --- a/containments/panel/package/contents/ui/FullContainer.qml +++ b/containments/panel/package/contents/ui/FullContainer.qml @@ -17,7 +17,6 @@ DrawerBackground { property ObjectModel fullRepresentationModel property ListView fullRepresentationView - backgroundColor: (applet.backgroundHints === PlasmaCore.Types.NoBackground) ? "transparent" : Kirigami.ColorUtils.adjustColor(PlasmaCore.Theme.backgroundColor, {"alpha": 0.8*255}) visible: shouldBeVisible property bool shouldBeVisible: applet && (applet.status != PlasmaCore.Types.HiddenStatus && applet.status != PlasmaCore.Types.PassiveStatus) @@ -35,7 +34,12 @@ DrawerBackground { return; } } - fullRepresentationModel.append(this); + if (applet && applet.pluginName == "org.kde.plasma.notifications") { + fullRepresentationModel.insert(0, this); + } else { + fullRepresentationModel.append(this); + } + fullRepresentationView.forceLayout(); fullRepresentationView.currentIndex = ObjectModel.index; diff --git a/containments/panel/package/contents/ui/SlidingContainer.qml b/containments/panel/package/contents/ui/SlidingContainer.qml index c7def8b7..7c2067da 100644 --- a/containments/panel/package/contents/ui/SlidingContainer.qml +++ b/containments/panel/package/contents/ui/SlidingContainer.qml @@ -28,8 +28,8 @@ NanoShell.FullScreenOverlay { readonly property int openedContentY: wideScreen || offset > (collapsedHeight + openThreshold) ? -topEmptyAreaHeight : offsetToContentY(collapsedHeight) readonly property int closedContentY: mainFlickable.contentHeight - readonly property bool wideScreen: width > height || width > units.gridUnit * 45 - readonly property int drawerWidth: wideScreen ? contentItem.implicitWidth : width + readonly property bool wideScreen: false//width > height || width > units.gridUnit * 45 + readonly property int drawerWidth: 400//wideScreen ? contentItem.implicitWidth : width property int drawerX: 0 property alias fixedArea: mainScope @@ -88,6 +88,11 @@ NanoShell.FullScreenOverlay { closeAnim.restart(); initiallyOpened = false; } + function expand() { + cancelAnimations(); + expandAnim.restart(); + initiallyOpened = true; + } function updateState() { cancelAnimations(); if (window.offset <= 0) { @@ -140,6 +145,14 @@ NanoShell.FullScreenOverlay { easing.type: Easing.InOutQuad to: window.openedContentY } + PropertyAnimation { + id: expandAnim + target: mainFlickable + properties: "contentY" + duration: PlasmaCore.Units.longDuration + easing.type: Easing.InOutQuad + to: 0 + } // fullscreen background Rectangle { @@ -203,13 +216,13 @@ NanoShell.FullScreenOverlay { width: parent.width height: mainFlickable.contentHeight onClicked: window.close(); - + // actual sliding contents PlasmaComponents.Control { id: contentArea z: 1 - x: drawerX - width: drawerWidth + x: Math.max(0, Math.min(window.drawerX, window.width - window.drawerWidth)) + width: Math.min(window.width, window.drawerWidth) } } } diff --git a/containments/panel/package/contents/ui/main.qml b/containments/panel/package/contents/ui/main.qml index 2ef44927..c2c45df6 100644 --- a/containments/panel/package/contents/ui/main.qml +++ b/containments/panel/package/contents/ui/main.qml @@ -70,7 +70,7 @@ Item { fullContainer = fullContainerComponent.createObject(fullRepresentationView.contentItem, {"fullRepresentationModel": fullRepresentationModel, "fullRepresentationView": fullRepresentationView}); } - applet.fullRepresentationItem.parent = fullContainer; + // applet.fullRepresentationItem.parent = fullContainer; fullContainer.applet = applet; fullContainer.contentItem = applet.fullRepresentationItem; //applet.fullRepresentationItem.anchors.fill = fullContainer; @@ -209,12 +209,12 @@ Item { contentItem: MouseArea { // mousearea captures touch presses so that the flickable picks them up for swiping - implicitWidth: slidingPanel.width + implicitWidth: slidingPanel.wideScreen ? panelContents.implicitWidth : slidingPanel.width implicitHeight: Math.min(slidingPanel.height, quickSettings.implicitHeight) GridLayout { id: panelContents - anchors.fill: parent + width: slidingPanel.wideScreen ? Math.min(parent.width, implicitWidth) : parent.width columns: slidingPanel.wideScreen ? 2 : 1 rows: slidingPanel.wideScreen ? 1 : 2 @@ -229,18 +229,21 @@ Item { Layout.preferredWidth: slidingPanel.wideScreen ? Math.min(slidingPanel.width/2, units.gridUnit * 25) : panelContents.width parentSlidingPanel: slidingPanel - onCloseRequested: slidingPanel.hide() + onExpandRequested: slidingPanel.expand() + onCloseRequested: slidingPanel.close() } // notifications ListView { id: fullRepresentationView implicitHeight: units.gridUnit * 20 - Layout.topMargin: slidingPanel.wideScreen ? 0 : Math.round(Kirigami.Units.gridUnit * 1.5) // add height of bottom bar Layout.preferredWidth: slidingPanel.wideScreen ? Math.min(slidingPanel.width/2, quickSettings.width*fullRepresentationModel.count) : panelContents.width - Layout.preferredHeight: Math.min(plasmoid.screenGeometry.height - quickSettings.implicitHeight - bottomBar.height + slidingPanel.topEmptyAreaHeight, implicitHeight) + Layout.preferredHeight: slidingPanel.wideScreen + ? Math.min(units.gridUnit * 20, Math.max(units.gridUnit * 15, quickSettings.implicitHeight)) + : Math.min(plasmoid.screenGeometry.height - quickSettings.implicitHeight - bottomBar.height + slidingPanel.topEmptyAreaHeight, implicitHeight) + z: 1 - interactive: count > 0 && width < contentWidth + interactive: true//count > 0 && width < contentWidth clip: slidingPanel.wideScreen y: slidingPanel.wideScreen ? 0 : quickSettings.trueHeight @@ -251,11 +254,11 @@ Item { return fullRepresentationModel.count > 0 && slidingPanel.offset / slidingPanel.collapsedHeight; } } - preferredHighlightBegin: slidingPanel.drawerX + //preferredHighlightBegin: slidingPanel.drawerX cacheBuffer: width * 100 highlightFollowsCurrentItem: true - highlightRangeMode: ListView.StrictlyEnforceRange + highlightRangeMode: ListView.ApplyRange highlightMoveDuration: units.longDuration snapMode: slidingPanel.wideScreen ? ListView.NoSnap : ListView.SnapOneItem model: ObjectModel { @@ -279,8 +282,6 @@ Item { right: parent.right bottom: parent.bottom } - backgroundColor: Kirigami.ColorUtils.adjustColor(PlasmaCore.Theme.backgroundColor, {"alpha": 0.8*255}) - parent: slidingPanel.fixedArea opacity: fullRepresentationView.opacity visible: !slidingPanel.wideScreen && fullRepresentationModel.count > 1 diff --git a/containments/panel/package/contents/ui/quicksettings/QuickSettingsPanel.qml b/containments/panel/package/contents/ui/quicksettings/QuickSettingsPanel.qml index 3f8840dd..19e585af 100644 --- a/containments/panel/package/contents/ui/quicksettings/QuickSettingsPanel.qml +++ b/containments/panel/package/contents/ui/quicksettings/QuickSettingsPanel.qml @@ -24,19 +24,23 @@ import "../" Item { id: root implicitWidth: column.implicitWidth + PlasmaCore.Units.smallSpacing * 6 - implicitHeight: column.implicitHeight + PlasmaCore.Units.smallSpacing * 2 + implicitHeight: background.implicitHeight + signal expandRequested signal closeRequested signal closed property bool expandedMode: parentSlidingPanel.wideScreen - readonly property real expandedRatio: expandedMode ? 1 : Math.max(0, Math.min(1, (parentSlidingPanel.offset - (parentSlidingPanel.topPanelHeight + firstRowHeight) - parentSlidingPanel.topPanelHeight) / otherRowsHeight + 0.05)) // HACK: add 0.05 to prevent jumping since this height isn't exact + readonly property real expandedRatio: expandedMode + ? 1 + // This counts also all spacings in form of Lyout.topMargin that some elements has + : Math.max(0, Math.min(1, (parentSlidingPanel.offset - firstRowHeight - indicatorsRow.height - Kirigami.Units.largeSpacing - Kirigami.Units.smallSpacing * 2 - bottomBar.height - background.margins.top -background.fixedMargins.bottom) / otherRowsHeight + 0.05)) // HACK: add 0.05 to prevent jumping since this height isn't exact readonly property real topEmptyAreaHeight: parentSlidingPanel.userInteracting ? (root.height - collapsedHeight) * (1 - expandedRatio) : (expandedMode ? 0 : root.height - collapsedHeight) - readonly property real collapsedHeight: parentSlidingPanel.topPanelHeight + firstRowHeight + PlasmaCore.Units.smallSpacing * 2 + readonly property real collapsedHeight: parentSlidingPanel.topPanelHeight + firstRowHeight + bottomBar.height + background.margins.top + background.fixedMargins.bottom readonly property real firstRowHeight: flow.children[0].height readonly property real otherRowsHeight: column.implicitHeight - firstRowHeight - parentSlidingPanel.topPanelHeight @@ -67,80 +71,65 @@ Item { property QuickSettingsModel quickSettingsModel: QuickSettingsModel {} - // shadow below panel (only if not widescreen) - Rectangle { - visible: !parentSlidingPanel.wideScreen - anchors.bottom: background.bottom - anchors.left: background.left - anchors.right: background.right - height: PlasmaCore.Units.gridUnit - gradient: Gradient { - GradientStop { - position: 0.0 - color: Qt.rgba(0, 0, 0, 0.05) - } - GradientStop { - position: 1.0 - color: "transparent" - } - } - } - // shadow for bottom bar - RectangularGlow { - z: 1 - anchors.topMargin: 1 - anchors.fill: bottomBar - cached: true - glowRadius: 4 - spread: 0.2 - color: Qt.rgba(0, 0, 0, 0.1) - } - // shadow for whole panel (only if widescreen) - RectangularGlow { - visible: parentSlidingPanel.wideScreen - anchors.topMargin: 1 - anchors.top: background.top - anchors.left: background.left - anchors.right: background.right - anchors.bottom: bottomBar.bottom - cached: true - glowRadius: 4 - spread: 0.2 - color: Qt.rgba(0, 0, 0, 0.1) - } // bottom "handle bar" - Rectangle { + Item { id: bottomBar - anchors.top: background.bottom - anchors.left: background.left - anchors.right: background.right - color: PlasmaCore.Theme.backgroundColor - height: Math.round(PlasmaCore.Units.gridUnit * 1.3) + anchors { + bottom: background.bottom + left: background.left + right: background.right + leftMargin: background.fixedMargins.left + rightMargin: background.fixedMargins.right + bottomMargin: background.fixedMargins.bottom + } + visible: !parentSlidingPanel.wideScreen + height: visible ? Math.round(PlasmaCore.Units.gridUnit * 1.3) : 0 z: 1 - - Kirigami.Icon { - visible: !parentSlidingPanel.wideScreen + Kirigami.Separator { + anchors { + left: parent.left + right: parent.right + } color: PlasmaCore.Theme.disabledTextColor - source: expandedRatio >= 1 ? "go-up-symbolic" : "go-down-symbolic" + opacity: 0.3 + } + Kirigami.Icon { + color: PlasmaCore.Theme.disabledTextColor + source: expandedRatio >= 0.5 ? "go-up-symbolic" : "go-down-symbolic" implicitWidth: PlasmaCore.Units.gridUnit implicitHeight: width anchors.centerIn: parent } + TapHandler { + onTapped: { + if (root.expandedMode) { + root.closeRequested(); + } else { + root.expandRequested(); + root.expandedMode = true; + } + } + } } - Rectangle { + PlasmaCore.FrameSvgItem { id: background - color: PlasmaCore.Theme.backgroundColor + implicitHeight: column.implicitHeight + bottomBar.height + margins.top + fixedMargins.bottom + enabledBorders: parentSlidingPanel.wideScreen ? PlasmaCore.FrameSvg.AllBorders : PlasmaCore.FrameSvg.BottomBorder anchors.fill: parent - + imagePath: "widgets/background" + ColumnLayout { id: column - anchors.leftMargin: PlasmaCore.Units.smallSpacing - anchors.rightMargin: PlasmaCore.Units.smallSpacing - anchors.left: parent.left - anchors.right: parent.right - anchors.bottom: parent.bottom + anchors { + leftMargin: parent.fixedMargins.left + rightMargin: parent.fixedMargins.right + bottomMargin: parent.fixedMargins.bottom + bottomBar.height + left: parent.left + right: parent.right + bottom: parent.bottom + } spacing: 0 clip: expandedRatio > 0 && expandedRatio < 1 // only clip when necessary to improve performance @@ -157,7 +146,7 @@ Item { showGradientBackground: false showDropShadow: false transform: Translate { - y: otherRowsHeight * (1 - root.expandedRatio) - PlasmaCore.Units.smallSpacing + y: otherRowsHeight * (1 - root.expandedRatio) } } @@ -165,14 +154,14 @@ Item { id: flow Layout.alignment: Qt.AlignHCenter Layout.fillWidth: true - Layout.leftMargin: units.smallSpacing + (units.largeSpacing - units.smallSpacing) * root.expandedRatio - Layout.rightMargin: units.smallSpacing + (units.largeSpacing - units.smallSpacing) * root.expandedRatio + Layout.leftMargin: root.expandedRatio < 0.4 ? -background.fixedMargins.left * (1 - root.expandedRatio) : 0 + Layout.rightMargin: root.expandedRatio < 0.4 ? -background.fixedMargins.right * (1 - root.expandedRatio) : 0 Layout.topMargin: units.largeSpacing readonly property real cellSizeHint: units.iconSizes.large + units.smallSpacing * 6 readonly property real columns: Math.floor(width / cellSizeHint) readonly property real columnsWhenCollapsed: 1.05 // .05 to account for the fact that we have an overshoot on the panel on first flick, we don't want the movement to be jarring - readonly property real columnWidth: Math.floor(width / (columns + (columnsWhenCollapsed - columnsWhenCollapsed * root.expandedRatio))) + readonly property real columnWidth: Math.floor(width / columns) spacing: 0 Repeater {