move lock screen clock to left-aligned rotated column with slide animation
This commit is contained in:
parent
dff70f18d1
commit
da158de748
1 changed files with 82 additions and 33 deletions
|
|
@ -83,6 +83,74 @@ WlSessionLockSurface {
|
|||
}
|
||||
}
|
||||
|
||||
// Clock - rotated, left-aligned
|
||||
Item {
|
||||
id: _clockItem
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 48
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
width: _clockText.height
|
||||
height: _clockCol.implicitWidth
|
||||
|
||||
opacity: 0
|
||||
property real _slideX: -80
|
||||
|
||||
ParallelAnimation on opacity {
|
||||
NumberAnimation {
|
||||
to: 1
|
||||
duration: 400
|
||||
easing.type: Easing.OutCubic
|
||||
}
|
||||
}
|
||||
NumberAnimation on _slideX {
|
||||
to: 0
|
||||
duration: 500
|
||||
easing.type: Easing.OutCubic
|
||||
}
|
||||
|
||||
transform: Translate {
|
||||
x: _clockItem._slideX
|
||||
}
|
||||
|
||||
Column {
|
||||
id: _clockCol
|
||||
anchors.centerIn: parent
|
||||
spacing: 8
|
||||
rotation: -90
|
||||
transformOrigin: Item.Center
|
||||
|
||||
Text {
|
||||
id: _clockText
|
||||
text: Qt.formatTime(new Date(), "HH:mm")
|
||||
color: S.Theme.base05
|
||||
font.pixelSize: 72
|
||||
font.family: S.Theme.fontFamily
|
||||
font.bold: true
|
||||
|
||||
Timer {
|
||||
interval: 1000
|
||||
running: true
|
||||
repeat: true
|
||||
onTriggered: parent.text = Qt.formatTime(new Date(), "HH:mm")
|
||||
}
|
||||
}
|
||||
|
||||
Text {
|
||||
text: Qt.formatDate(new Date(), "dddd, d MMMM")
|
||||
color: S.Theme.base04
|
||||
font.pixelSize: S.Theme.fontSize + 2
|
||||
font.family: S.Theme.fontFamily
|
||||
|
||||
Timer {
|
||||
interval: 60000
|
||||
running: true
|
||||
repeat: true
|
||||
onTriggered: parent.text = Qt.formatDate(new Date(), "dddd, d MMMM")
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Center content
|
||||
Item {
|
||||
id: content
|
||||
|
|
@ -108,39 +176,6 @@ WlSessionLockSurface {
|
|||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
spacing: 24
|
||||
|
||||
// Clock
|
||||
Text {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
text: Qt.formatTime(new Date(), "HH:mm")
|
||||
color: S.Theme.base05
|
||||
font.pixelSize: 72
|
||||
font.family: S.Theme.fontFamily
|
||||
font.bold: true
|
||||
|
||||
Timer {
|
||||
interval: 1000
|
||||
running: true
|
||||
repeat: true
|
||||
onTriggered: parent.text = Qt.formatTime(new Date(), "HH:mm")
|
||||
}
|
||||
}
|
||||
|
||||
// Date
|
||||
Text {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
text: Qt.formatDate(new Date(), "dddd, d MMMM")
|
||||
color: S.Theme.base04
|
||||
font.pixelSize: S.Theme.fontSize + 2
|
||||
font.family: S.Theme.fontFamily
|
||||
|
||||
Timer {
|
||||
interval: 60000
|
||||
running: true
|
||||
repeat: true
|
||||
onTriggered: parent.text = Qt.formatDate(new Date(), "dddd, d MMMM")
|
||||
}
|
||||
}
|
||||
|
||||
// Notification pills
|
||||
Row {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
|
@ -368,6 +403,20 @@ WlSessionLockSurface {
|
|||
id: _unlockAnim
|
||||
|
||||
ParallelAnimation {
|
||||
NumberAnimation {
|
||||
target: _clockItem
|
||||
property: "opacity"
|
||||
to: 0
|
||||
duration: 200
|
||||
easing.type: Easing.InCubic
|
||||
}
|
||||
NumberAnimation {
|
||||
target: _clockItem
|
||||
property: "_slideX"
|
||||
to: -80
|
||||
duration: 200
|
||||
easing.type: Easing.InCubic
|
||||
}
|
||||
NumberAnimation {
|
||||
target: content
|
||||
property: "opacity"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue