From 2ed4578a55da1eb23fdff65b1311eb13303bc9a5 Mon Sep 17 00:00:00 2001 From: Marco Martin Date: Fri, 25 Sep 2015 14:04:28 +0200 Subject: [PATCH] wallpaper and applets config as a sidepanel --- .../configuration/AppletConfiguration.qml | 368 ++++++++++-------- shell/contents/explorer/WidgetExplorer.qml | 8 +- 2 files changed, 213 insertions(+), 163 deletions(-) diff --git a/shell/contents/configuration/AppletConfiguration.qml b/shell/contents/configuration/AppletConfiguration.qml index 3a625069..7fc74cf5 100644 --- a/shell/contents/configuration/AppletConfiguration.qml +++ b/shell/contents/configuration/AppletConfiguration.qml @@ -30,7 +30,7 @@ Rectangle { Layout.minimumHeight: units.gridUnit * 20 //BEGIN properties - color: syspal.window + color: Qt.rgba(0, 0, 0, 1 - panel.x/width) width: units.gridUnit * 40 height: units.gridUnit * 30 @@ -109,14 +109,44 @@ Rectangle { main.sourceFile = globalConfigModel.get(0).source main.title = globalConfigModel.get(0).name } -// root.width = mainColumn.implicitWidth -// root.height = mainColumn.implicitHeight } //END connections //BEGIN UI components SystemPalette {id: syspal} + NumberAnimation { + id: openAnim + running: true + target: panel + properties: "x" + duration: units.longDuration + easing.type: Easing.InOutQuad + to: root.width/6 + } + SequentialAnimation { + id: closeAnim + NumberAnimation { + target: panel + properties: "x" + duration: units.longDuration + easing.type: Easing.InOutQuad + to: root.width + } + ScriptAction { + script: cancelAction.trigger(); + } + } + + Timer { + running: true + interval: 250 + onTriggered: { + openAnim.running = true; + } + } + onWidthChanged: panel.x = root.width/6 + MessageDialog { id: messageDialog icon: StandardIcon.Warning @@ -133,189 +163,205 @@ Rectangle { } } - ColumnLayout { - id: mainColumn - anchors { - fill: parent - margins: mainColumn.spacing //margins are hardcoded in QStyle we should match that here + MouseArea { + anchors.fill: parent + drag.filterChildren: true + drag.target: panel + drag.axis: Drag.XAxis + drag.maximumX: width + drag.minimumX: width/6 + onReleased: { + if (panel.x > root.width/2) { + closeAnim.running = true; + } else { + openAnim.running = true; + } } - property int implicitWidth: Math.max(contentRow.implicitWidth, buttonsRow.implicitWidth) + 8 - property int implicitHeight: contentRow.implicitHeight + buttonsRow.implicitHeight + 8 - - RowLayout { - id: contentRow - anchors { - left: parent.left - right: parent.right + onClicked: { + if (mouse.x < width / 6) { + closeAnim.running = true; } - spacing: units.largeSpacing - Layout.fillHeight: true - Layout.preferredHeight: parent.height - buttonsRow.height - - QtControls.ScrollView { - id: categoriesScroll - frameVisible: true - Layout.fillHeight: true - visible: (configDialog.configModel ? configDialog.configModel.count : 0) + globalConfigModel.count > 1 - width: visible ? units.gridUnit * 7 : 0 - implicitWidth: width - flickableItem.interactive: false - - Rectangle { - width: categoriesScroll.viewport.width - height: Math.max(categoriesScroll.viewport.height, categories.height) - color: syspal.base - - Column { - id: categories - width: parent.width - height: childrenRect.height - - property Item currentItem: children[1] - - Repeater { - model: root.isContainment ? globalConfigModel : undefined - delegate: ConfigCategoryDelegate {} - } - Repeater { - model: configDialog.configModel - delegate: ConfigCategoryDelegate {} - } - Repeater { - model: !root.isContainment ? globalConfigModel : undefined - delegate: ConfigCategoryDelegate {} - } - } + } + Rectangle { + id: panel + width: root.width - root.width/6 + x: root.width + height: root.height + color: syspal.window + ColumnLayout { + id: mainColumn + anchors { + fill: parent + margins: mainColumn.spacing //margins are hardcoded in QStyle we should match that here } - } - QtControls.ScrollView { - id: scroll - Layout.fillHeight: true - Layout.fillWidth: true - Column { - spacing: units.largeSpacing / 2 + property int implicitWidth: Math.max(contentRow.implicitWidth, buttonsRow.implicitWidth) + 8 + property int implicitHeight: contentRow.implicitHeight + buttonsRow.implicitHeight + 8 - QtControls.Label { - id: pageTitle - width: scroll.viewport.width - font.pointSize: theme.defaultFont.pointSize*2 - font.weight: Font.Light - text: main.title + RowLayout { + id: contentRow + anchors { + left: parent.left + right: parent.right } + spacing: units.largeSpacing + Layout.fillHeight: true + Layout.preferredHeight: parent.height - buttonsRow.height - QtControls.StackView { - id: main - property string title: "" - property bool invertAnimations: false + QtControls.ScrollView { + id: categoriesScroll + frameVisible: true + Layout.fillHeight: true + visible: (configDialog.configModel ? configDialog.configModel.count : 0) + globalConfigModel.count > 1 + width: visible ? units.gridUnit * 7 : 0 + implicitWidth: width + flickableItem.interactive: false - height: Math.max((scroll.viewport.height - pageTitle.height - parent.spacing), (main.currentItem ? (main.currentItem.implicitHeight ? main.currentItem.implicitHeight : main.currentItem.childrenRect.height) : 0)) - width: scroll.viewport.width + Rectangle { + width: categoriesScroll.viewport.width + height: Math.max(categoriesScroll.viewport.height, categories.height) + color: syspal.base - property string sourceFile + Column { + id: categories + width: parent.width + height: childrenRect.height - onSourceFileChanged: { -// print("Source file changed in flickable" + sourceFile); - replace(Qt.resolvedUrl(sourceFile)); - root.restoreConfig() - for (var prop in currentItem) { - if (prop.indexOf("cfg_") === 0 && prop.indexOf("Changed") > 0 ) { - currentItem[prop].connect(root.settingValueChanged) + property Item currentItem: children[1] + + Repeater { + model: root.isContainment ? globalConfigModel : undefined + delegate: ConfigCategoryDelegate {} + } + Repeater { + model: configDialog.configModel + delegate: ConfigCategoryDelegate {} + } + Repeater { + model: !root.isContainment ? globalConfigModel : undefined + delegate: ConfigCategoryDelegate {} } } - if (currentItem["configurationChanged"]) { - currentItem["configurationChanged"].connect(root.settingValueChanged) - } - /* - * This is not needed on a desktop shell that has ok/apply/cancel buttons, i'll leave it here only for future reference until we have a prototype for the active shell. - * root.pageChanged will start a timer, that in turn will call saveConfig() when triggered - - for (var prop in currentItem) { - if (prop.indexOf("cfg_") === 0) { - currentItem[prop+"Changed"].connect(root.pageChanged) - } - }*/ } + } + QtControls.ScrollView { + id: scroll + Layout.fillHeight: true + Layout.fillWidth: true + Column { + spacing: units.largeSpacing / 2 - delegate: QtControls.StackViewDelegate { - function transitionFinished(properties) - { - properties.exitItem.opacity = 1 + QtControls.Label { + id: pageTitle + width: scroll.viewport.width + font.pointSize: theme.defaultFont.pointSize*2 + font.weight: Font.Light + text: main.title } - pushTransition: QtControls.StackViewTransition { - PropertyAnimation { - target: enterItem - property: "opacity" - from: 0 - to: 1 - duration: units.longDuration - easing.type: Easing.InOutQuad + QtControls.StackView { + id: main + property string title: "" + property bool invertAnimations: false + + height: Math.max((scroll.viewport.height - pageTitle.height - parent.spacing), (main.currentItem ? (main.currentItem.implicitHeight ? main.currentItem.implicitHeight : main.currentItem.childrenRect.height) : 0)) + width: scroll.viewport.width + + property string sourceFile + + onSourceFileChanged: { + // print("Source file changed in flickable" + sourceFile); + replace(Qt.resolvedUrl(sourceFile)); + root.restoreConfig() + for (var prop in currentItem) { + if (prop.indexOf("cfg_") === 0 && prop.indexOf("Changed") > 0 ) { + currentItem[prop].connect(root.settingValueChanged) + } + } + if (currentItem["configurationChanged"]) { + currentItem["configurationChanged"].connect(root.settingValueChanged) + } + /* + * This is not needed on a desktop shell that has ok/apply/cancel buttons, i'll leave it here only for future reference until we have a prototype for the active shell. + * root.pageChanged will start a timer, that in turn will call saveConfig() when triggered + + for (var prop in currentItem) { + if (prop.indexOf("cfg_") === 0) { + currentItem[prop+"Changed"].connect(root.pageChanged) + } + }*/ } - PropertyAnimation { - target: enterItem - property: "x" - from: main.invertAnimations ? -target.width/3: target.width/3 - to: 0 - duration: units.longDuration - easing.type: Easing.InOutQuad - } - PropertyAnimation { - target: exitItem - property: "opacity" - from: 1 - to: 0 - duration: units.longDuration - easing.type: Easing.InOutQuad - } - PropertyAnimation { - target: exitItem - property: "x" - from: 0 - to: main.invertAnimations ? target.width/3 : -target.width/3 - duration: units.longDuration - easing.type: Easing.InOutQuad + + delegate: QtControls.StackViewDelegate { + function transitionFinished(properties) + { + properties.exitItem.opacity = 1 + } + + pushTransition: QtControls.StackViewTransition { + PropertyAnimation { + target: enterItem + property: "opacity" + from: 0 + to: 1 + duration: units.longDuration + easing.type: Easing.InOutQuad + } + PropertyAnimation { + target: enterItem + property: "x" + from: main.invertAnimations ? -target.width/3: target.width/3 + to: 0 + duration: units.longDuration + easing.type: Easing.InOutQuad + } + PropertyAnimation { + target: exitItem + property: "opacity" + from: 1 + to: 0 + duration: units.longDuration + easing.type: Easing.InOutQuad + } + PropertyAnimation { + target: exitItem + property: "x" + from: 0 + to: main.invertAnimations ? target.width/3 : -target.width/3 + duration: units.longDuration + easing.type: Easing.InOutQuad + } + } } } } } } - } - } - QtControls.Action { - id: acceptAction - onTriggered: { - applyAction.trigger(); - configDialog.close(); - } - shortcut: "Return" - } - - QtControls.Action { - id: applyAction - onTriggered: { - if (main.currentItem.saveConfig !== undefined) { - main.currentItem.saveConfig(); - } else { - root.saveConfig(); + QtControls.Action { + id: acceptAction + onTriggered: { + applyAction.trigger(); + configDialog.close(); + } + shortcut: "Return" } - } - } - QtControls.Action { - id: cancelAction - onTriggered: configDialog.close(); - shortcut: "Escape" - } + QtControls.Action { + id: applyAction + onTriggered: { + if (main.currentItem.saveConfig !== undefined) { + main.currentItem.saveConfig(); + } else { + root.saveConfig(); + } + } + } - RowLayout { - id: buttonsRow - Layout.alignment: Qt.AlignVCenter | Qt.AlignRight - - QtControls.Button { - iconName: "window-close" - text: i18nd("plasma_shell_org.kde.plasma.desktop", "Close") - onClicked: cancelAction.trigger() + QtControls.Action { + id: cancelAction + onTriggered: configDialog.close(); + shortcut: "Escape" + } } } } diff --git a/shell/contents/explorer/WidgetExplorer.qml b/shell/contents/explorer/WidgetExplorer.qml index 3809c033..0c4e6a37 100644 --- a/shell/contents/explorer/WidgetExplorer.qml +++ b/shell/contents/explorer/WidgetExplorer.qml @@ -34,7 +34,7 @@ import org.kde.plasma.private.shell 2.0 Rectangle { id: root - color: Qt.rgba(0, 0, 0, main.opacity * 0.8) + color: Qt.rgba(0, 0, 0, (1 - Math.abs(main.x / (main.width/2))) * 0.8) signal closed() MouseArea { @@ -50,6 +50,11 @@ Rectangle { openAnim.running = true; } } + onClicked: { + if (mouse.x > main.width) { + removeAnim.running = true; + } + } NumberAnimation { id: openAnim @@ -81,7 +86,6 @@ Rectangle { height: parent.height color: theme.backgroundColor - opacity: 1 - Math.abs(x / (width/2)) property alias containment: widgetExplorer.containment //external drop events can cause a raise event causing us to lose focus and