diff --git a/LoginFrame.qml b/LoginFrame.qml index 859e658..6559082 100644 --- a/LoginFrame.qml +++ b/LoginFrame.qml @@ -1,11 +1,10 @@ import QtQuick 2.0 import SddmComponents 2.0 -Rectangle { - property int m_sessionIndex: sessionModel.lastIndex - property string m_userName: userModel.lastUser +Item { + property int sessionIndex: sessionModel.lastIndex + property string userName: userModel.lastUser - readonly property int m_powerButtonSize: 40 function getIconByName(name) { for (var i = 0; i < userModel.count; i ++) { @@ -16,12 +15,6 @@ Rectangle { return "" } - Image { - id: powerBackground - anchors.fill: parent - source: "background.jpg" - } - Item { id: centerArea anchors.centerIn: parent @@ -64,7 +57,7 @@ Rectangle { horizontalCenter: parent.horizontalCenter } - text: m_userName + text: userName color: textColor font.pointSize: 15 } @@ -98,7 +91,7 @@ Rectangle { KeyNavigation.backtab: userButton; KeyNavigation.tab: shutdownButton Keys.onPressed: { if (event.key === Qt.Key_Return || event.key === Qt.Key_Enter) { - sddm.login(userNameText.text, passwdInput.text, m_sessionIndex) + sddm.login(userNameText.text, passwdInput.text, sessionIndex) event.accepted = true } } @@ -113,124 +106,125 @@ Rectangle { // Fixme, This is vary strange source: "icons/login_normal.png" onClicked: { - sddm.login(userNameText.text, passwdInput.text, m_sessionIndex) + sddm.login(userNameText.text, passwdInput.text, sessionIndex) } } } } } - Item { - id: timeArea +// Item { +// id: timeArea - anchors { - bottom: parent.bottom - left: parent.left - } - width: parent.width / 3 - height: parent.height / 5 +// anchors { +// bottom: parent.bottom +// left: parent.left +// } +// width: parent.width / 3 +// height: parent.height / 5 - Text { - id: timeText - anchors { - left: parent.left - leftMargin: hMargin - bottom: dateText.top - bottomMargin: 5 - } +// Text { +// id: timeText +// anchors { +// left: parent.left +// leftMargin: hMargin +// bottom: dateText.top +// bottomMargin: 5 +// } - font.pointSize: 50 - color: textColor +// font.pointSize: 50 +// color: textColor - function updateTime() { - text = new Date().toLocaleString(Qt.locale("en_US"), "hh:mm") - } - } +// function updateTime() { +// text = new Date().toLocaleString(Qt.locale("en_US"), "hh:mm") +// } +// } - Text { - id: dateText - anchors { - left: parent.left - leftMargin: hMargin - bottom: parent.bottom - bottomMargin: vMargin - } +// Text { +// id: dateText +// anchors { +// left: parent.left +// leftMargin: hMargin +// bottom: parent.bottom +// bottomMargin: vMargin +// } - font.pointSize: 18 - color: textColor +// font.pointSize: 18 +// color: textColor - function updateDate() { - text = new Date().toLocaleString(Qt.locale("en_US"), "yyyy-MM-dd dddd") - } - } +// function updateDate() { +// text = new Date().toLocaleString(Qt.locale("en_US"), "yyyy-MM-dd dddd") +// } +// } - Timer { - interval: 1000 - repeat: true - running: true - onTriggered: { - timeText.updateTime() - dateText.updateDate() - } - } +// Timer { +// interval: 1000 +// repeat: true +// running: true +// onTriggered: { +// timeText.updateTime() +// dateText.updateDate() +// } +// } - Component.onCompleted: { - timeText.updateTime() - dateText.updateDate() - } - } +// Component.onCompleted: { +// timeText.updateTime() +// dateText.updateDate() +// } +// } - Item { - id: powerArea - anchors { - bottom: parent.bottom - right: parent.right - } - width: parent.width / 3 - height: parent.height / 5 +// Item { +// id: powerArea +// anchors { +// bottom: parent.bottom +// right: parent.right +// } +// width: parent.width / 3 +// height: parent.height / 5 - readonly property int itemSpacing: 20; +// readonly property int itemSpacing: 20; - Row { - spacing: 20 - anchors.right: parent.right - anchors.rightMargin: hMargin - anchors.verticalCenter: parent.verticalCenter +// Row { +// spacing: 20 +// anchors.right: parent.right +// anchors.rightMargin: hMargin +// anchors.verticalCenter: parent.verticalCenter - ImageButton { - id: sessionButton - width: m_powerButtonSize - height: m_powerButtonSize - visible: sessionFrame.isMultipleSessions() - source: sessionFrame.getCurrentSessionIconPath() - onClicked: root.state = "stateSession" - } +// ImageButton { +// id: sessionButton +// width: m_powerButtonSize +// height: m_powerButtonSize +// visible: sessionFrame.isMultipleSessions() +// source: sessionFrame.getCurrentSessionIconPath() +// onClicked: root.state = "stateSession" +// } - ImageButton { - id: userButton - width: m_powerButtonSize - height: m_powerButtonSize - visible: userFrame.isMultipleUsers() +// ImageButton { +// id: userButton +// width: m_powerButtonSize +// height: m_powerButtonSize +// visible: userFrame.isMultipleUsers() - source: "icons/switchframe/userswitch_normal.png" - onClicked: { - console.log("Switch User...") - root.state = "stateUser" - } - } +// source: "icons/switchframe/userswitch_normal.png" +// onClicked: { +// console.log("Switch User...") +// root.state = "stateUser" +// } +// } - ImageButton { - id: shutdownButton - width: m_powerButtonSize - height: m_powerButtonSize - visible: true//sddm.canPowerOff +// ImageButton { +// id: shutdownButton +// width: m_powerButtonSize +// height: m_powerButtonSize +// visible: true//sddm.canPowerOff + +// source: "icons/switchframe/powermenu.png" +// onClicked: { +// console.log("Show shutdown menu") +// root.state = "statePower" +// } +// } +// } +// } - source: "icons/switchframe/powermenu.png" - onClicked: { - console.log("Show shutdown menu") - root.state = "statePower" - } - } - } - } } diff --git a/Main.qml b/Main.qml index 566c49e..e66f6e6 100644 --- a/Main.qml +++ b/Main.qml @@ -1,6 +1,7 @@ /***********************************************************************/ import QtQuick 2.0 +import QtGraphicalEffects 1.0 import SddmComponents 2.0 @@ -11,7 +12,8 @@ Rectangle { state: "stateLogin" readonly property int hMargin: 40 - readonly property int vMargin: 40 + readonly property int vMargin: 30 + readonly property int m_powerButtonSize: 40 readonly property color textColor: "#ffffff" TextConstants { id: textConstants } @@ -23,6 +25,7 @@ Rectangle { PropertyChanges { target: powerFrame; opacity: 1} PropertyChanges { target: sessionFrame; opacity: 0} PropertyChanges { target: userFrame; opacity: 0} + PropertyChanges { target: bgBlur; radius: 20} }, State { name: "stateSession" @@ -30,6 +33,7 @@ Rectangle { PropertyChanges { target: powerFrame; opacity: 0} PropertyChanges { target: sessionFrame; opacity: 1} PropertyChanges { target: userFrame; opacity: 0} + PropertyChanges { target: bgBlur; radius: 20} }, State { name: "stateUser" @@ -37,6 +41,7 @@ Rectangle { PropertyChanges { target: powerFrame; opacity: 0} PropertyChanges { target: sessionFrame; opacity: 0} PropertyChanges { target: userFrame; opacity: 1} + PropertyChanges { target: bgBlur; radius: 20} }, State { name: "stateLogin" @@ -44,11 +49,13 @@ Rectangle { PropertyChanges { target: powerFrame; opacity: 0} PropertyChanges { target: sessionFrame; opacity: 0} PropertyChanges { target: userFrame; opacity: 0} + PropertyChanges { target: bgBlur; radius: 0} } ] transitions: Transition { - PropertyAnimation { duration: 500; properties: "opacity"; } + PropertyAnimation { duration: 300; properties: "opacity"; } + PropertyAnimation { duration: 300; properties: "radius"; } } Repeater { @@ -65,52 +72,189 @@ Rectangle { } } - PowerFrame { - id: powerFrame - enabled: root.state == "statePower" + Item { + id: mainFrame property variant geometry: screenModel.geometry(screenModel.primary) x: geometry.x; y: geometry.y; width: geometry.width; height: geometry.height - opacity: 1 - onNeedClose: root.state = "stateLogin" - onNeedShutdown: sddm.powerOff() - onNeedRestart: sddm.reboot() - onNeedSuspend: sddm.suspend() - } - SessionFrame { - id: sessionFrame - enabled: root.state == "stateSession" - property variant geometry: screenModel.geometry(screenModel.primary) - x: geometry.x; y: geometry.y; width: geometry.width; height: geometry.height - onSelected: { - console.log("Selected session:", index) - root.state = "stateLogin" - loginFrame.m_sessionIndex = index + Image { + id: mainFrameBackground + anchors.fill: parent + source: "background.jpg" } - onNeedClose: root.state = "stateLogin" - } - UserFrame { - id: userFrame - enabled: root.state == "stateUser" - property variant geometry: screenModel.geometry(screenModel.primary) - x: geometry.x; y: geometry.y; width: geometry.width; height: geometry.height - onSelected: { - console.log("Select user:", userName) - root.state = "stateLogin" - loginFrame.m_userName = userName + FastBlur { + id: bgBlur + anchors.fill: mainFrameBackground + source: mainFrameBackground + radius: 0 } - onNeedClose: root.state = "stateLogin" - } - LoginFrame { - id: loginFrame - enabled: root.state == "stateLogin" - property variant geometry: screenModel.geometry(screenModel.primary) - x: geometry.x; y: geometry.y; width: geometry.width; height: geometry.height - color: "transparent" - opacity: 0 - transformOrigin: Item.Top - } + Item { + id: centerArea + width: parent.width + height: parent.height / 3 + anchors.centerIn: parent + PowerFrame { + id: powerFrame + anchors.fill: parent + enabled: root.state == "statePower" + onNeedClose: root.state = "stateLogin" + onNeedShutdown: sddm.powerOff() + onNeedRestart: sddm.reboot() + onNeedSuspend: sddm.suspend() + } + + SessionFrame { + id: sessionFrame + anchors.fill: parent + enabled: root.state == "stateSession" + onSelected: { + console.log("Selected session:", index) + root.state = "stateLogin" + loginFrame.sessionIndex = index + } + onNeedClose: root.state = "stateLogin" + } + + UserFrame { + id: userFrame + anchors.fill: parent + enabled: root.state == "stateUser" + onSelected: { + console.log("Select user:", userName) + root.state = "stateLogin" + loginFrame.userName = userName + } + onNeedClose: root.state = "stateLogin" + } + + LoginFrame { + id: loginFrame + anchors.fill: parent + enabled: root.state == "stateLogin" + opacity: 0 + transformOrigin: Item.Top + } + } + + Item { + id: timeArea + + anchors { + bottom: parent.bottom + left: parent.left + } + width: parent.width / 3 + height: parent.height / 5 + + Text { + id: timeText + anchors { + left: parent.left + leftMargin: hMargin + bottom: dateText.top + bottomMargin: 5 + } + + font.pointSize: 50 + color: textColor + + function updateTime() { + text = new Date().toLocaleString(Qt.locale("en_US"), "hh:mm") + } + } + + Text { + id: dateText + anchors { + left: parent.left + leftMargin: hMargin + bottom: parent.bottom + bottomMargin: vMargin + } + + font.pointSize: 18 + color: textColor + + function updateDate() { + text = new Date().toLocaleString(Qt.locale("en_US"), "yyyy-MM-dd dddd") + } + } + + Timer { + interval: 1000 + repeat: true + running: true + onTriggered: { + timeText.updateTime() + dateText.updateDate() + } + } + + Component.onCompleted: { + timeText.updateTime() + dateText.updateDate() + } + } + + Item { + id: powerArea + anchors { + bottom: parent.bottom + right: parent.right + } + width: parent.width / 3 + height: parent.height / 5 + + Row { + spacing: 20 + anchors.right: parent.right + anchors.rightMargin: hMargin + anchors.verticalCenter: parent.verticalCenter + + ImageButton { + id: sessionButton + width: m_powerButtonSize + height: m_powerButtonSize + visible: sessionFrame.isMultipleSessions() + source: sessionFrame.getCurrentSessionIconPath() + onClicked: root.state = "stateSession" + } + + ImageButton { + id: userButton + width: m_powerButtonSize + height: m_powerButtonSize + visible: userFrame.isMultipleUsers() + + source: "icons/switchframe/userswitch_normal.png" + onClicked: { + console.log("Switch User...") + root.state = "stateUser" + } + } + + ImageButton { + id: shutdownButton + width: m_powerButtonSize + height: m_powerButtonSize + visible: true//sddm.canPowerOff + + source: "icons/switchframe/powermenu.png" + onClicked: { + console.log("Show shutdown menu") + root.state = "statePower" + } + } + } + } + + MouseArea { + z: -1 + anchors.fill: parent + onClicked: root.state = "stateLogin" + } + } } diff --git a/PowerFrame.qml b/PowerFrame.qml index a7270f3..f41fae7 100644 --- a/PowerFrame.qml +++ b/PowerFrame.qml @@ -1,24 +1,12 @@ import QtQuick 2.0 import QtGraphicalEffects 1.0 -Rectangle { +Item { signal needClose() signal needShutdown() signal needRestart() signal needSuspend() - Image { - id: powerBackground - anchors.fill: parent - source: "background.jpg" - } - - FastBlur { - anchors.fill: powerBackground - source: powerBackground - radius: 20 - } - Row { spacing: 70 diff --git a/SessionFrame.qml b/SessionFrame.qml index dfd48b3..e10cbc3 100644 --- a/SessionFrame.qml +++ b/SessionFrame.qml @@ -1,7 +1,7 @@ import QtQuick 2.0 import QtGraphicalEffects 1.0 -Rectangle { +Item { id: frame signal selected(var index) signal needClose() @@ -27,18 +27,6 @@ Rectangle { return sessionList.count > 1 } - Image { - id: sessionBackground - anchors.fill: parent - source: "background.jpg" - } - - FastBlur { - anchors.fill: sessionBackground - source: sessionBackground - radius: 20 - } - ListView { id: sessionList anchors.centerIn: parent diff --git a/UserFrame.qml b/UserFrame.qml index d4a6ef5..43ba88d 100644 --- a/UserFrame.qml +++ b/UserFrame.qml @@ -1,7 +1,7 @@ import QtQuick 2.0 import QtGraphicalEffects 1.0 -Rectangle { +Item { id: frame signal selected(var userName) signal needClose() @@ -18,18 +18,6 @@ Rectangle { return usersList.count > 1 } - Image { - id: usersBackground - anchors.fill: parent - source: "background.jpg" - } - - FastBlur { - anchors.fill: usersBackground - source: usersBackground - radius: 20 - } - ListView { id: usersList anchors.centerIn: parent