Commit b690c533 authored by Marco Martin's avatar Marco Martin
Browse files

new shutdown screen design

parent b675eeb6
/*
* Copyright 2016 David Edmundson <davidedmundson@kde.org>
*
* This program is free software; you can redistribute it and/or modify
* it under the terms of the GNU Library General Public License as
* published by the Free Software Foundation; either version 2 or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details
*
* You should have received a copy of the GNU Library General Public
* License along with this program; if not, write to the
* Free Software Foundation, Inc.,
* 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import QtQuick 2.8
import org.kde.plasma.core 2.0 as PlasmaCore
import org.kde.plasma.components 3.0 as PlasmaComponents3
Item {
id: root
property alias text: label.text
property alias iconSource: icon.source
property alias containsMouse: mouseArea.containsMouse
property alias font: label.font
property alias labelRendering: label.renderType
property alias circleOpacity: iconCircle.opacity
property alias circleVisiblity: iconCircle.visible
property int fontSize: config.fontSize
readonly property bool softwareRendering: GraphicsInfo.api === GraphicsInfo.Software
signal clicked
activeFocusOnTab: true
property int iconSize: units.gridUnit * 3
implicitWidth: Math.max(iconSize + units.largeSpacing * 2, label.contentWidth)
implicitHeight: iconSize + units.smallSpacing + label.implicitHeight
opacity: activeFocus || containsMouse ? 1 : 0.85
Behavior on opacity {
PropertyAnimation { // OpacityAnimator makes it turn black at random intervals
duration: units.longDuration
easing.type: Easing.InOutQuad
}
}
Rectangle {
id: iconCircle
anchors.centerIn: icon
width: iconSize + units.smallSpacing
height: width
radius: width / 2
color: softwareRendering ? PlasmaCore.ColorScope.backgroundColor : PlasmaCore.ColorScope.textColor
opacity: activeFocus || containsMouse ? (softwareRendering ? 0.8 : 0.15) : (softwareRendering ? 0.6 : 0)
Behavior on opacity {
PropertyAnimation { // OpacityAnimator makes it turn black at random intervals
duration: units.longDuration
easing.type: Easing.InOutQuad
}
}
}
Rectangle {
anchors.centerIn: iconCircle
width: iconCircle.width
height: width
radius: width / 2
scale: mouseArea.containsPress ? 1 : 0
color: PlasmaCore.ColorScope.textColor
opacity: 0.15
Behavior on scale {
PropertyAnimation {
duration: units.shortDuration
easing.type: Easing.InOutQuart
}
}
}
PlasmaCore.IconItem {
id: icon
anchors {
top: parent.top
horizontalCenter: parent.horizontalCenter
}
width: iconSize
height: iconSize
colorGroup: PlasmaCore.ColorScope.colorGroup
active: mouseArea.containsMouse || root.activeFocus
}
PlasmaComponents3.Label {
id: label
font.pointSize: Math.max(fontSize + 1,theme.defaultFont.pointSize + 1)
anchors {
top: icon.bottom
topMargin: (softwareRendering ? 1.5 : 1) * units.smallSpacing
left: parent.left
right: parent.right
}
style: softwareRendering ? Text.Outline : Text.Normal
styleColor: softwareRendering ? PlasmaCore.ColorScope.backgroundColor : "transparent" //no outline, doesn't matter
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignTop
wrapMode: Text.WordWrap
font.underline: root.activeFocus
}
MouseArea {
id: mouseArea
hoverEnabled: true
onClicked: root.clicked()
anchors.fill: parent
}
Keys.onEnterPressed: clicked()
Keys.onReturnPressed: clicked()
Keys.onSpacePressed: clicked()
Accessible.onPressAction: clicked()
Accessible.role: Accessible.Button
Accessible.name: label.text
}
......@@ -32,6 +32,7 @@ import org.kde.plasma.private.sessions 2.0
PlasmaCore.ColorScope {
id: root
colorGroup: PlasmaCore.Theme.ComplementaryColorGroup
signal logoutRequested()
signal haltRequested()
signal suspendRequested(int spdMethod)
......@@ -46,69 +47,110 @@ PlasmaCore.ColorScope {
}
Rectangle {
id: background
anchors.fill: parent
color: PlasmaCore.ColorScope.backgroundColor
opacity: 0.5
opacity: 0
}
MouseArea {
anchors.fill: parent
onClicked: root.cancelRequested()
onClicked: {
closeAnim.restart();
root.cancelRequested();
}
}
KCoreAddons.KUser {
id: kuser
Component.onCompleted: openAnim.restart()
onVisibleChanged: {
if (visible) {
openAnim.restart()
}
}
Controls.Popup {
visible: true
ParallelAnimation {
id: openAnim
ScaleAnimator {
target: lay
from: 10
to: 1
duration: units.longDuration
easing.type: Easing.InOutQuad
}
OpacityAnimator {
target: lay
from: 0
to: 1
duration: units.longDuration
easing.type: Easing.InOutQuad
}
OpacityAnimator {
target: background
from: 0
to: 0.5
duration: units.longDuration
easing.type: Easing.InOutQuad
}
}
ParallelAnimation {
id: closeAnim
ScaleAnimator {
target: lay
from: 1
to: 10
duration: units.longDuration
easing.type: Easing.InOutQuad
}
OpacityAnimator {
target: lay
from: 1
to: 0
duration: units.longDuration
easing.type: Easing.InOutQuad
}
OpacityAnimator {
target: background
from: 0.5
to: 0
duration: units.longDuration
easing.type: Easing.InOutQuad
}
}
GridLayout {
id: lay
anchors.centerIn: parent
width: Math.min(units.gridUnit * 20, root.width * 0.8)
height: Math.min(units.gridUnit * 25, root.height * 0.7)
Component.onCompleted: open()
ColumnLayout {
id: contents
spacing: units.largeSpacing
anchors.fill: parent
UserDelegate {
Layout.fillWidth: true
width: units.gridUnit * 7
height: width
nameFontSize: theme.defaultFont.pointSize + 4
constrainText: false
avatarPath: kuser.faceIconUrl
iconSource: "user-identity"
isCurrent: true
name: kuser.fullName
columns: 2
rowSpacing: units.gridUnit * 2
columnSpacing: units.gridUnit * 2
scale: 2
opacity: 0
ActionButton {
iconSource: "system-reboot"
text: i18nd("plasma_lookandfeel_org.kde.lookandfeel", "Restart")
onClicked: {
closeAnim.restart();
root.rebootRequested();
}
}
ColumnLayout {
Layout.margins: 10
Controls.Button {
Layout.fillWidth: true
display: Controls.Button.TextUnderIcon
icon.name: "system-shutdown"
text: i18nd("plasma_lookandfeel_org.kde.lookandfeel", "Shut Down")
onClicked: root.haltRequested()
}
Controls.Button {
Layout.fillWidth: true
display: Controls.Button.TextUnderIcon
icon.name: "system-reboot"
text: i18nd("plasma_lookandfeel_org.kde.lookandfeel", "Restart")
onClicked: root.rebootRequested()
}
ActionButton {
iconSource: "system-shutdown"
text: i18nd("plasma_lookandfeel_org.kde.lookandfeel", "Shut Down")
onClicked: {
closeAnim.restart();
root.haltRequested();
}
}
Controls.Button {
Layout.fillWidth: true
display: Controls.Button.TextUnderIcon
icon.name: "dialog-cancel"
text: i18nd("plasma_lookandfeel_org.kde.lookandfeel", "Cancel")
onClicked: root.cancelRequested()
}
ActionButton {
//Remove this when we have more buttons
Layout.columnSpan: 2
Layout.alignment: Qt.AlignCenter
iconSource: "dialog-cancel"
text: i18nd("plasma_lookandfeel_org.kde.lookandfeel", "Cancel")
onClicked: {
closeAnim.restart();
root.cancelRequested();
}
}
}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment