marcoallegretti/shift-shell
1
0
Fork 0
mirror of https://invent.kde.org/marcoa/shift-shell.git synced 2026-06-11 00:47:22 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Move homescreens to shared motion

Browse source 
Use Motion wrappers and state layers across Folio and Halcyon delegates, drawers, folders, resize handles, and dock feedback. Also align Folio edit/drop highlights with theme colors instead of fixed white overlays.
This commit is contained in:
Marco Allegretti 2026-05-21 11:13:36 +02:00
parent 7f9087f342
commit a37734b74a
29 changed files with 230 additions and 179 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
containments/homescreens/folio/qml/AppDrawerGrid.qml
View file

@ -32,6 +32,7 @@ MobileShell.GridView {
property real headerHeight
readonly property int reservedSpaceForLabel: folio.HomeScreenState.pageDelegateLabelHeight
readonly property int scrollBarAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.SpatialExtended)
readonly property real effectiveContentWidth: width - leftMargin - rightMargin
readonly property real horizontalMargin: Math.round(width * 0.05)
@ -139,8 +140,8 @@ MobileShell.GridView {
Behavior on opacity {
OpacityAnimator {
duration: Kirigami.Units.longDuration * 2
easing.type: Easing.InOutQuad
duration: root.scrollBarAnimationDuration
easing.type: MobileShell.Motion.easing(MobileShell.Motion.Standard)
}
}

3
containments/homescreens/folio/qml/AppDrawerHeader.qml
View file

@ -8,6 +8,7 @@ import QtQuick.Layouts
import org.kde.kirigami as Kirigami
import org.kde.plasma.components 3.0 as PlasmaComponents
import org.kde.plasma.private.mobileshell as MobileShell
import plasma.applet.org.kde.plasma.mobile.homescreen.folio as Folio
import './delegate'
@ -64,7 +65,7 @@ Item {
Kirigami.Theme.textColor.b,
(searchField.hovered || searchField.focus) ? 0.2 : 0.1)
Behavior on color { ColorAnimation {} }
Behavior on color { MobileShell.MotionColorAnimation { type: MobileShell.Motion.EffectsFast } }
}
topPadding: Kirigami.Units.largeSpacing + Kirigami.Units.smallSpacing

17
containments/homescreens/folio/qml/DelegateDragItem.qml
View file

@ -22,6 +22,7 @@ Item {
height: folio.HomeScreenState.pageCellHeight
readonly property real dropAnimationRunning: dragXAnim.running || dragYAnim.running
readonly property int dropAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.EffectsDefault)
// ignore widget dragging, that is not handled by this component
readonly property bool isWidgetDrag: folio.HomeScreenState.dragState.dropDelegate && folio.HomeScreenState.dragState.dropDelegate.type === Folio.FolioDelegate.Widget
@ -38,11 +39,11 @@ Item {
}
// animate drop x
NumberAnimation on x {
MobileShell.MotionNumberAnimation on x {
id: dragXAnim
type: MobileShell.Motion.EffectsDefault
running: false
duration: Kirigami.Units.longDuration
easing.type: Easing.OutCubic
duration: root.dropAnimationDuration
onFinished: {
root.visible = false;
root.setXBinding();
@ -50,11 +51,11 @@ Item {
}
// animate drop y
NumberAnimation on y {
MobileShell.MotionNumberAnimation on y {
id: dragYAnim
type: MobileShell.Motion.EffectsDefault
running: false
duration: Kirigami.Units.longDuration
easing.type: Easing.OutCubic
duration: root.dropAnimationDuration
onFinished: {
root.visible = false;
root.setYBinding();
@ -66,8 +67,8 @@ Item {
id: scaleAnim
to: 0
running: false
duration: Kirigami.Units.longDuration
easing.type: Easing.InOutCubic
duration: root.dropAnimationDuration
easing.type: MobileShell.Motion.easing(MobileShell.Motion.EffectsDefault)
}
Connections {

124
containments/homescreens/folio/qml/FavouritesBar.qml
View file

@ -35,20 +35,22 @@ MouseArea {
readonly property bool convergenceMode: ShellSettings.Settings.convergenceModeEnabled
readonly property bool showRunningTasks: convergenceMode && !suppressRunningTasks
readonly property int totalItemCount: repeater.count + (showRunningTasks ? taskRepeater.count : 0)
readonly property int longAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.SpatialDefault)
readonly property int shortAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.EffectsFast)
// In convergence mode, size icons to fit the dock bar instead of using page grid cells
property real dockCellWidth: convergenceMode ? root.height : folio.HomeScreenState.pageCellWidth
property real dockCellHeight: convergenceMode ? root.height : folio.HomeScreenState.pageCellHeight
Behavior on dockCellWidth { NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutCubic } }
Behavior on dockCellHeight { NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutCubic } }
Behavior on dockCellWidth { MobileShell.MotionNumberAnimation { type: MobileShell.Motion.SpatialDefault; duration: root.longAnimationDuration } }
Behavior on dockCellHeight { MobileShell.MotionNumberAnimation { type: MobileShell.Motion.SpatialDefault; duration: root.longAnimationDuration } }
// Navigation buttons width (used to offset center positioning)
property real navButtonWidth: convergenceMode ? root.height : 0
property real dockItemInset: convergenceMode ? Math.max(2, Kirigami.Units.smallSpacing / 2) : 0
property real dockIconSize: Math.min(root.height * 0.56, Kirigami.Units.iconSizes.large)
Behavior on navButtonWidth { NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutCubic } }
Behavior on dockItemInset { NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutCubic } }
Behavior on dockIconSize { NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutCubic } }
Behavior on navButtonWidth { MobileShell.MotionNumberAnimation { type: MobileShell.Motion.SpatialDefault; duration: root.longAnimationDuration } }
Behavior on dockItemInset { MobileShell.MotionNumberAnimation { type: MobileShell.Motion.SpatialDefault; duration: root.longAnimationDuration } }
Behavior on dockIconSize { MobileShell.MotionNumberAnimation { type: MobileShell.Motion.SpatialDefault; duration: root.longAnimationDuration } }
function dockItemColor(pressed, hovered, active) {
if (pressed) {
@ -67,7 +69,7 @@ MouseArea {
readonly property bool showSpacer: showRunningTasks && repeater.count > 0 && taskRepeater.count > 0
property real spacerWidth: showSpacer ? Kirigami.Units.largeSpacing * 2 : 0
Behavior on spacerWidth {
NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutQuad }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.SpatialDefault; duration: root.longAnimationDuration }
}
// Thumbnail popup hover tracking
@ -102,10 +104,10 @@ MouseArea {
readonly property real dockCenterX: convergenceMode
? leftControlsWidth + (root.width - leftControlsWidth - rightControlsWidth) / 2
: root.width / 2
Behavior on pagerButtonWidth { NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutCubic } }
Behavior on desktopButtonWidth { NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutCubic } }
Behavior on trashButtonWidth { NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutCubic } }
Behavior on searchButtonWidth { NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutCubic } }
Behavior on pagerButtonWidth { MobileShell.MotionNumberAnimation { type: MobileShell.Motion.SpatialDefault; duration: root.longAnimationDuration } }
Behavior on desktopButtonWidth { MobileShell.MotionNumberAnimation { type: MobileShell.Motion.SpatialDefault; duration: root.longAnimationDuration } }
Behavior on trashButtonWidth { MobileShell.MotionNumberAnimation { type: MobileShell.Motion.SpatialDefault; duration: root.longAnimationDuration } }
Behavior on searchButtonWidth { MobileShell.MotionNumberAnimation { type: MobileShell.Motion.SpatialDefault; duration: root.longAnimationDuration } }
property Item pendingDockToolTipItem: null
property Item activeDockToolTipItem: null
@ -294,7 +296,7 @@ MouseArea {
color: "transparent"
Behavior on opacity {
NumberAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.InOutQuad }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.EffectsFast; duration: root.shortAnimationDuration }
}
Accessible.role: Accessible.Button
@ -313,15 +315,13 @@ MouseArea {
visible: homeButton.activeFocus
}
Rectangle {
MobileShell.MotionStateLayer {
anchors.fill: parent
anchors.margins: root.dockItemInset
radius: Kirigami.Units.cornerRadius
color: root.dockItemColor(homeMouseArea.containsPress, homeMouseArea.containsMouse, false)
Behavior on color {
ColorAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.OutCubic }
}
hovered: homeMouseArea.containsMouse
pressed: homeMouseArea.containsPress
pressedOpacity: 0.18
}
Kirigami.Icon {
@ -361,7 +361,7 @@ MouseArea {
}
Behavior on opacity {
NumberAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.InOutQuad }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.EffectsFast; duration: root.shortAnimationDuration }
}
Accessible.role: Accessible.Button
@ -385,15 +385,14 @@ MouseArea {
visible: desktopButton.activeFocus
}
Rectangle {
MobileShell.MotionStateLayer {
anchors.fill: parent
anchors.margins: root.dockItemInset
radius: Kirigami.Units.cornerRadius
color: root.dockItemColor(desktopMouseArea.containsPress, desktopMouseArea.containsMouse, WindowPlugin.WindowUtil.isShowingDesktop)
Behavior on color {
ColorAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.OutCubic }
}
hovered: desktopMouseArea.containsMouse
pressed: desktopMouseArea.containsPress
active: WindowPlugin.WindowUtil.isShowingDesktop
pressedOpacity: 0.18
}
Kirigami.Icon {
@ -476,7 +475,7 @@ MouseArea {
color: "transparent"
Behavior on opacity {
NumberAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.InOutQuad }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.EffectsFast; duration: root.shortAnimationDuration }
}
Accessible.role: Accessible.Button
@ -495,15 +494,13 @@ MouseArea {
visible: overviewButton.activeFocus
}
Rectangle {
MobileShell.MotionStateLayer {
anchors.fill: parent
anchors.margins: root.dockItemInset
radius: Kirigami.Units.cornerRadius
color: root.dockItemColor(overviewMouseArea.containsPress, overviewMouseArea.containsMouse, false)
Behavior on color {
ColorAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.OutCubic }
}
hovered: overviewMouseArea.containsMouse
pressed: overviewMouseArea.containsPress
pressedOpacity: 0.18
}
Kirigami.Icon {
@ -539,7 +536,7 @@ MouseArea {
color: "transparent"
Behavior on opacity {
NumberAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.InOutQuad }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.EffectsFast; duration: root.shortAnimationDuration }
}
Accessible.role: Accessible.Button
@ -563,15 +560,13 @@ MouseArea {
visible: searchButton.activeFocus
}
Rectangle {
MobileShell.MotionStateLayer {
anchors.fill: parent
anchors.margins: root.dockItemInset
radius: Kirigami.Units.cornerRadius
color: root.dockItemColor(searchMouseArea.containsPress, searchMouseArea.containsMouse, false)
Behavior on color {
ColorAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.OutCubic }
}
hovered: searchMouseArea.containsMouse
pressed: searchMouseArea.containsPress
pressedOpacity: 0.18
}
Kirigami.Icon {
@ -638,15 +633,16 @@ MouseArea {
width: root.pagerButtonWidth
height: root.height
Rectangle {
MobileShell.MotionStateLayer {
anchors.fill: parent
anchors.margins: root.dockItemInset
radius: Kirigami.Units.cornerRadius
color: leftDesktopBtn.isCurrent || leftDesktopBtn.isDragTarget
? Qt.rgba(Kirigami.Theme.highlightColor.r, Kirigami.Theme.highlightColor.g, Kirigami.Theme.highlightColor.b,
leftPagerHover.containsMouse || leftDesktopBtn.isDragTarget ? 0.25 : 0.18)
: root.dockItemColor(leftPagerHover.containsPress, leftPagerHover.containsMouse, false)
Behavior on color { ColorAnimation { duration: Kirigami.Units.shortDuration } }
hovered: leftPagerHover.containsMouse
pressed: leftPagerHover.containsPress
active: leftDesktopBtn.isCurrent || leftDesktopBtn.isDragTarget
pressedOpacity: 0.18
activeOpacity: 0.18
activeHoverOpacity: 0.25
}
PC3.Label {
@ -746,15 +742,16 @@ MouseArea {
width: root.pagerButtonWidth
height: root.height
Rectangle {
MobileShell.MotionStateLayer {
anchors.fill: parent
anchors.margins: root.dockItemInset
radius: Kirigami.Units.cornerRadius
color: rightDesktopBtn.isCurrent || rightDesktopBtn.isDragTarget
? Qt.rgba(Kirigami.Theme.highlightColor.r, Kirigami.Theme.highlightColor.g, Kirigami.Theme.highlightColor.b,
rightPagerHover.containsMouse || rightDesktopBtn.isDragTarget ? 0.25 : 0.18)
: root.dockItemColor(rightPagerHover.containsPress, rightPagerHover.containsMouse, false)
Behavior on color { ColorAnimation { duration: Kirigami.Units.shortDuration } }
hovered: rightPagerHover.containsMouse
pressed: rightPagerHover.containsPress
active: rightDesktopBtn.isCurrent || rightDesktopBtn.isDragTarget
pressedOpacity: 0.18
activeOpacity: 0.18
activeHoverOpacity: 0.25
}
PC3.Label {
@ -875,7 +872,7 @@ MouseArea {
color: "transparent"
Behavior on opacity {
NumberAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.InOutQuad }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.EffectsFast; duration: root.shortAnimationDuration }
}
Accessible.role: Accessible.Button
@ -891,14 +888,13 @@ MouseArea {
visible: trashButton.activeFocus
}
Rectangle {
MobileShell.MotionStateLayer {
anchors.fill: parent
anchors.margins: root.dockItemInset
radius: Kirigami.Units.cornerRadius
color: root.dockItemColor(trashMouseArea.containsPress, trashMouseArea.containsMouse, false)
Behavior on color {
ColorAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.OutCubic }
}
hovered: trashMouseArea.containsMouse
pressed: trashMouseArea.containsPress
pressedOpacity: 0.18
}
Kirigami.Icon {
@ -1049,7 +1045,7 @@ MouseArea {
// get the normalized index position value from the center so we can animate it
property double fromCenterValue: model.index - (root.totalItemCount / 2)
Behavior on fromCenterValue {
NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutQuad; }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.SpatialDefault; duration: root.longAnimationDuration }
}
// multiply the 'fromCenterValue' by the cell size to get the actual position
@ -1070,7 +1066,7 @@ MouseArea {
}
Behavior on dragVisualShift {
enabled: root.dragReorderIndex !== -1 && delegate.index !== root.dragReorderIndex
NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutQuad }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.SpatialDefault; duration: root.longAnimationDuration }
}
property real taskPinVisualShift: root.taskPinCanDrop && delegate.index >= root.taskPinTargetIndex ? root.dockCellWidth : 0
@ -1426,10 +1422,10 @@ MouseArea {
visible: showing || fadeAnim.running
opacity: showing ? 1 : 0
Behavior on opacity {
NumberAnimation {
MobileShell.MotionNumberAnimation {
id: fadeAnim
duration: Kirigami.Units.shortDuration
easing.type: Easing.InOutQuad
type: MobileShell.Motion.EffectsFast
duration: root.shortAnimationDuration
}
}
@ -1718,7 +1714,7 @@ MouseArea {
// Position after all favourites
property double fromCenterValue: (repeater.count + taskDelegate.index) - (root.totalItemCount / 2)
Behavior on fromCenterValue {
NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutQuad; }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.SpatialDefault; duration: root.longAnimationDuration }
}
readonly property int centerPosition: (isLocationBottom ? root.dockCellWidth : root.dockCellHeight) * fromCenterValue
@ -1740,7 +1736,7 @@ MouseArea {
color: root.dockItemColor(taskMouseArea.containsPress, taskMouseArea.containsMouse, taskDelegate.model.IsActive === true)
Behavior on color {
ColorAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.OutCubic }
MobileShell.MotionColorAnimation { type: MobileShell.Motion.EffectsFast; duration: root.shortAnimationDuration }
}
}
@ -1825,7 +1821,7 @@ MouseArea {
opacity: taskDelegate.model.IsActive === true ? 1.0 : 0.45
Behavior on width {
NumberAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.OutCubic }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.EffectsFast; duration: root.shortAnimationDuration }
}
}
}

13
containments/homescreens/folio/qml/FolderView.qml
View file

@ -25,6 +25,9 @@ Folio.DelegateTouchArea {
property real folderPositionY
property Folio.FolioApplicationFolder folder: folio.HomeScreenState.currentFolder
readonly property int shortAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.EffectsFast)
readonly property int longAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.SpatialDefault)
readonly property color folderFeedbackColor: Qt.rgba(Kirigami.Theme.highlightColor.r, Kirigami.Theme.highlightColor.g, Kirigami.Theme.highlightColor.b, 0.24)
MobileShell.HapticsEffect {
id: haptics
@ -83,7 +86,7 @@ Folio.DelegateTouchArea {
opacity: (root.opacity === 1) ? 1 : 0
Behavior on opacity {
NumberAnimation { duration: Kirigami.Units.shortDuration }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.EffectsFast; duration: root.shortAnimationDuration }
}
}
@ -177,7 +180,7 @@ Folio.DelegateTouchArea {
Rectangle {
id: folderBackground
color: Qt.rgba(255, 255, 255, 0.3)
color: root.folderFeedbackColor
radius: Kirigami.Units.gridUnit
readonly property int gridLength: folio.HomeScreenState.folderGridLength
@ -282,9 +285,9 @@ Folio.DelegateTouchArea {
property double rowValue: model.rowIndex
property double pageValue: model.pageIndex
Behavior on columnValue { NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutQuad } }
Behavior on rowValue { NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutQuad } }
Behavior on pageValue { NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutQuad } }
Behavior on columnValue { MobileShell.MotionNumberAnimation { type: MobileShell.Motion.SpatialDefault; duration: root.longAnimationDuration } }
Behavior on rowValue { MobileShell.MotionNumberAnimation { type: MobileShell.Motion.SpatialDefault; duration: root.longAnimationDuration } }
Behavior on pageValue { MobileShell.MotionNumberAnimation { type: MobileShell.Motion.SpatialDefault; duration: root.longAnimationDuration } }
// multiply the index values by the cell size to get the actual position
readonly property int columnPosition: cellWidth * columnValue

3
containments/homescreens/folio/qml/FolioHomeScreen.qml
View file

@ -31,6 +31,7 @@ Item {
property real rightMargin: 0
property bool interactive: true
readonly property color favouritesBarScrimColor: Qt.rgba(Kirigami.Theme.highlightColor.r, Kirigami.Theme.highlightColor.g, Kirigami.Theme.highlightColor.b, 0.14)
// non-widget drop animation
readonly property bool dropAnimationRunning: delegateDragItem.dropAnimationRunning || widgetDragItem.dropAnimationRunning
@ -350,7 +351,7 @@ Item {
Rectangle {
id: favouritesBarScrim
color: Qt.rgba(255, 255, 255, 0.2)
color: root.favouritesBarScrimColor
Component.onCompleted: maskManager.assignToMask(this)

6
containments/homescreens/folio/qml/HomeScreenPage.qml
View file

@ -24,6 +24,8 @@ Item {
property var pageModel
property var homeScreen
readonly property color editFeedbackColor: Qt.rgba(Kirigami.Theme.highlightColor.r, Kirigami.Theme.highlightColor.g, Kirigami.Theme.highlightColor.b, 0.24)
readonly property color dropFeedbackColor: Qt.rgba(Kirigami.Theme.highlightColor.r, Kirigami.Theme.highlightColor.g, Kirigami.Theme.highlightColor.b, 0.28)
onActiveFocusChanged: {
if (activeFocus) {
@ -107,7 +109,7 @@ Item {
Rectangle {
id: settingsViewBackground
anchors.fill: parent
color: Qt.rgba(255, 255, 255, 0.2)
color: root.editFeedbackColor
opacity: folio.HomeScreenState.settingsOpenProgress
radius: Kirigami.Units.largeSpacing
}
@ -152,7 +154,7 @@ Item {
pageModel.canAddDelegate(dropPosition.pageRow, dropPosition.pageColumn, dropDelegate)
radius: Kirigami.Units.cornerRadius
color: Qt.rgba(255, 255, 255, 0.3)
color: root.dropFeedbackColor
x: dropPosition.pageColumn * folio.HomeScreenState.pageCellWidth
y: dropPosition.pageRow * folio.HomeScreenState.pageCellHeight

3
containments/homescreens/folio/qml/PlaceholderDelegate.qml
View file

@ -12,6 +12,7 @@ import "./delegate"
Item {
id: root
property Folio.HomeScreen folio
readonly property color placeholderColor: Qt.rgba(Kirigami.Theme.highlightColor.r, Kirigami.Theme.highlightColor.g, Kirigami.Theme.highlightColor.b, 0.28)
width: folio.HomeScreenState.pageCellWidth
height: folio.HomeScreenState.pageCellHeight
@ -24,7 +25,7 @@ Item {
// icon position placement
Rectangle {
id: loader
color: Qt.rgba(255, 255, 255, 0.3)
color: root.placeholderColor
radius: Kirigami.Units.cornerRadius
Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom

8
containments/homescreens/folio/qml/RunningAppsPanel.qml
View file

@ -6,6 +6,7 @@ import QtQuick.Layouts
import org.kde.kirigami as Kirigami
import org.kde.plasma.components 3.0 as PC3
import org.kde.plasma.private.mobileshell as MobileShell
import org.kde.taskmanager as TaskManager
import plasma.applet.org.kde.plasma.mobile.homescreen.folio as Folio
@ -16,6 +17,7 @@ Item {
required property var folio
readonly property bool hasTasks: allTasksModel.count > 0
readonly property int shortAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.EffectsFast)
property bool sortByName: false
property int dragTargetDesktopIndex: -1
property string pendingMoveTaskKey: ""
@ -280,10 +282,10 @@ Item {
: root.mixColor(Kirigami.Theme.backgroundColor, Kirigami.Theme.textColor, 0.14)
Behavior on color {
ColorAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.OutCubic }
MobileShell.MotionColorAnimation { type: MobileShell.Motion.EffectsFast; duration: root.shortAnimationDuration }
}
Behavior on scale {
NumberAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.OutCubic }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.EffectsFast; duration: root.shortAnimationDuration }
}
}
@ -509,7 +511,7 @@ Item {
: root.mixColor(Kirigami.Theme.backgroundColor, Kirigami.Theme.textColor, 0.12)
Behavior on color {
ColorAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.OutCubic }
MobileShell.MotionColorAnimation { type: MobileShell.Motion.EffectsFast; duration: root.shortAnimationDuration }
}
}

4
containments/homescreens/folio/qml/RunningAppsPanelButton.qml
View file

@ -5,6 +5,7 @@ import QtQuick
import org.kde.kirigami as Kirigami
import org.kde.plasma.components 3.0 as PC3
import org.kde.plasma.private.mobileshell as MobileShell
MouseArea {
id: button
@ -12,6 +13,7 @@ MouseArea {
property string iconName
property string toolTipText
property bool checked: false
readonly property int shortAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.EffectsFast)
signal triggered()
@ -43,7 +45,7 @@ MouseArea {
: "transparent"
Behavior on color {
ColorAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.OutCubic }
MobileShell.MotionColorAnimation { type: MobileShell.Motion.EffectsFast; duration: button.shortAnimationDuration }
}
}

10
containments/homescreens/folio/qml/WidgetDragItem.qml
View file

@ -11,6 +11,7 @@ import org.kde.plasma.core as PlasmaCore
import org.kde.ksvg 1.0 as KSvg
import org.kde.plasma.components 3.0 as PC3
import org.kde.plasma.private.mobileshell as MobileShell
import plasma.applet.org.kde.plasma.mobile.homescreen.folio as Folio
import './delegate'
@ -31,6 +32,7 @@ Item {
&& folio.HomeScreenState.dragState.dropDelegate.type === Folio.FolioDelegate.Widget
&& folio.HomeScreenState.dragState.dropDelegate.widget.visualApplet
readonly property bool dropAnimationRunning: dragXAnim.running || dragYAnim.running
readonly property int dropAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.EffectsDefault)
visible: false
x: Math.round(folio.HomeScreenState.delegateDragX)
@ -52,8 +54,8 @@ Item {
XAnimator on x {
id: dragXAnim
running: false
duration: Kirigami.Units.longDuration
easing.type: Easing.OutCubic
duration: root.dropAnimationDuration
easing.type: MobileShell.Motion.easing(MobileShell.Motion.EffectsDefault)
onFinished: {
root.visible = false;
root.widget = null;
@ -65,8 +67,8 @@ Item {
YAnimator on y {
id: dragYAnim
running: false
duration: Kirigami.Units.longDuration
easing.type: Easing.OutCubic
duration: root.dropAnimationDuration
easing.type: MobileShell.Motion.easing(MobileShell.Motion.EffectsDefault)
onFinished: {
root.visible = false;
root.widget = null;

14
containments/homescreens/folio/qml/delegate/AbstractDelegate.qml
View file

@ -32,16 +32,19 @@ Folio.DelegateTouchArea {
// grow/shrink animation
property real scaleAmount: 1
property bool clickRequested: false
readonly property int pressAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.Press)
readonly property real pressedScale: MobileShell.Motion.pressScaleIn
function keyboardFocus() {
delegateWrapper.forceActiveFocus();
}
NumberAnimation on scaleAmount {
MobileShell.MotionNumberAnimation on scaleAmount {
id: shrinkAnim
type: MobileShell.Motion.Press
running: false
duration: ShellSettings.Settings.animationsEnabled ? 80 : 1
to: ShellSettings.Settings.animationsEnabled ? 0.8 : 1
duration: root.pressAnimationDuration
to: root.pressedScale
onFinished: {
if (!root.pressed) {
growAnim.restart();
@ -49,10 +52,11 @@ Folio.DelegateTouchArea {
}
}
NumberAnimation on scaleAmount {
MobileShell.MotionNumberAnimation on scaleAmount {
id: growAnim
type: MobileShell.Motion.Press
running: false
duration: ShellSettings.Settings.animationsEnabled ? 80 : 1
duration: root.pressAnimationDuration
to: 1
onFinished: {
if (root.clickRequested) {

14
containments/homescreens/folio/qml/delegate/AppDelegate.qml
View file

@ -26,6 +26,8 @@ AbstractDelegate {
property bool turnToFolder: false
property bool turnToFolderAnimEnabled: false
readonly property int turnToFolderAnimationDuration: root.turnToFolderAnimEnabled ? MobileShell.Motion.duration(MobileShell.Motion.Standard) : 0
readonly property color folderFeedbackColor: Qt.rgba(Kirigami.Theme.highlightColor.r, Kirigami.Theme.highlightColor.g, Kirigami.Theme.highlightColor.b, 0.28)
function launchApp() {
if (!application) {
@ -59,7 +61,7 @@ AbstractDelegate {
Rectangle {
id: rect
radius: Kirigami.Units.cornerRadius
color: Qt.rgba(255, 255, 255, 0.3)
color: root.folderFeedbackColor
anchors.fill: parent
Component.onCompleted: {
@ -69,15 +71,15 @@ AbstractDelegate {
}
opacity: root.turnToFolder ? 1 : 0
property real scaleAmount: root.turnToFolder ? 1.2 : 1.0
property real scaleAmount: root.turnToFolder ? 1.08 : 1.0
Behavior on scaleAmount {
enabled: root.turnToFolderAnimEnabled
NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutQuad }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.Standard; duration: root.turnToFolderAnimationDuration }
}
Behavior on opacity {
enabled: root.turnToFolderAnimEnabled
NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutQuad }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.Standard; duration: root.turnToFolderAnimationDuration }
}
transform: Scale {
@ -95,10 +97,10 @@ AbstractDelegate {
anchors.fill: parent
source: root.application ? root.application.icon : ""
property real scaleAmount: root.turnToFolder ? 0.3 : 1.0
property real scaleAmount: root.turnToFolder ? 0.42 : 1.0
Behavior on scaleAmount {
enabled: root.turnToFolderAnimEnabled
NumberAnimation { duration: root.turnToFolderAnimEnabled ? Kirigami.Units.longDuration : 0; easing.type: Easing.InOutQuad }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.Standard; duration: root.turnToFolderAnimationDuration }
}
transform: Scale {

8
containments/homescreens/folio/qml/delegate/DelegateFolderIcon.qml
View file

@ -19,6 +19,8 @@ Item {
property Folio.FolioApplicationFolder folder
property bool expandBackground: false
readonly property int longAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.Standard)
readonly property color folderFeedbackColor: Qt.rgba(Kirigami.Theme.highlightColor.r, Kirigami.Theme.highlightColor.g, Kirigami.Theme.highlightColor.b, 0.28)
height: folio.FolioSettings.delegateIconSize
width: folio.FolioSettings.delegateIconSize
@ -26,7 +28,7 @@ Item {
Rectangle {
id: rect
radius: Kirigami.Units.cornerRadius
color: Qt.rgba(255, 255, 255, 0.3)
color: root.folderFeedbackColor
anchors.fill: parent
Component.onCompleted: {
@ -35,9 +37,9 @@ Item {
}
}
property real scaleAmount: root.expandBackground ? 1.2 : 1.0
property real scaleAmount: root.expandBackground ? 1.08 : 1.0
Behavior on scaleAmount { NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutQuad } }
Behavior on scaleAmount { MobileShell.MotionNumberAnimation { type: MobileShell.Motion.Standard; duration: root.longAnimationDuration } }
transform: Scale {
origin.x: root.width / 2

3
containments/homescreens/folio/qml/delegate/WidgetDelegate.qml
View file

@ -28,6 +28,7 @@ Folio.WidgetContainer {
readonly property real bottomWidgetBackgroundPadding: widgetBackground.margins.bottom
readonly property real leftWidgetBackgroundPadding: widgetBackground.margins.left
readonly property real rightWidgetBackgroundPadding: widgetBackground.margins.right
readonly property color placeholderColor: Qt.rgba(Kirigami.Theme.highlightColor.r, Kirigami.Theme.highlightColor.g, Kirigami.Theme.highlightColor.b, 0.28)
implicitWidth: (widget ? widget.gridWidth : 0) * folio.HomeScreenState.pageCellWidth
implicitHeight: (widget ? widget.gridHeight : 0) * folio.HomeScreenState.pageCellHeight
@ -94,7 +95,7 @@ Folio.WidgetContainer {
id: temporaryBackground
anchors.fill: parent
visible: root.widget && !root.widget.applet
color: Qt.rgba(255, 255, 255, 0.3)
color: root.placeholderColor
radius: Kirigami.Units.cornerRadius
}

6
containments/homescreens/folio/qml/delegate/WidgetDelegateConfig.qml
View file

@ -8,6 +8,7 @@ import Qt5Compat.GraphicalEffects
import org.kde.kirigami as Kirigami
import org.kde.plasma.core as PlasmaCore
import org.kde.plasma.private.mobileshell as MobileShell
import org.kde.ksvg 1.0 as KSvg
import org.kde.plasma.components 3.0 as PC3
@ -41,6 +42,7 @@ Item {
signal removeRequested()
signal closed()
readonly property int longAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.EffectsDefault)
function startOpen() {
// prevent config overlay if lock layout is enabled
@ -69,7 +71,7 @@ Item {
// in case this gets stuck open over the homescreen, just close on tap
onClicked: close()
NumberAnimation on opacity { id: configOverlayOpacityAnim; duration: Kirigami.Units.longDuration }
MobileShell.MotionNumberAnimation on opacity { id: configOverlayOpacityAnim; type: MobileShell.Motion.EffectsDefault; duration: root.longAnimationDuration }
function open() {
configOverlayOpacityAnim.to = 1;
@ -133,7 +135,7 @@ Item {
QQC2.Overlay.modal: Item {}
exit: Transition {
NumberAnimation { property: "opacity"; duration: Kirigami.Units.longDuration; from: 1.0; to: 0.0 }
MobileShell.MotionNumberAnimation { property: "opacity"; type: MobileShell.Motion.EffectsDefault; duration: root.longAnimationDuration; from: 1.0; to: 0.0 }
}
Connections {

13
containments/homescreens/folio/qml/main.qml
View file

@ -34,6 +34,7 @@ import "./private"
ContainmentItem {
id: root
property var folio: root.plasmoid
readonly property int shortAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.EffectsFast)
// Tracks whether the Game Center grid is visible within gaming mode.
// If gaming mode is already enabled at startup, open it immediately so
@ -295,6 +296,8 @@ ContainmentItem {
// maximized. The reveal strip at the screen edge brings it back.
property real dockOffset: 0
readonly property real dockHeight: MobileShell.Constants.convergenceDockHeight
readonly property int dockAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.SpatialDefault)
readonly property int dockFadeDuration: MobileShell.Motion.duration(MobileShell.Motion.EffectsFast)
// Height of the input-receive strip kept at the screen edge when
// the dock is hidden. Matches the navigation panel convention.
@ -365,14 +368,14 @@ ContainmentItem {
}
Behavior on dockOffset {
NumberAnimation {
easing.type: Easing.InOutCubic
duration: Kirigami.Units.longDuration
MobileShell.MotionNumberAnimation {
type: MobileShell.Motion.SpatialDefault
duration: dockOverlay.dockAnimationDuration
}
}
Behavior on opacity {
NumberAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.InOutQuad }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.EffectsFast; duration: dockOverlay.dockFadeDuration }
}
Rectangle {
@ -847,7 +850,7 @@ ContainmentItem {
border.color: Qt.rgba(1, 1, 1, 0.2)
Behavior on opacity {
NumberAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.InOutQuad }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.EffectsFast; duration: root.shortAnimationDuration }
}
implicitWidth: hintText.implicitWidth + Kirigami.Units.gridUnit * 2

9
containments/homescreens/folio/qml/private/WidgetResizeHandle.qml
View file

@ -4,6 +4,7 @@
import QtQuick
import org.kde.kirigami as Kirigami
import org.kde.plasma.private.mobileshell as MobileShell
import '../delegate'
@ -13,6 +14,8 @@ MouseArea {
width: 10 + touchPadding * 2
readonly property real touchPadding: 20
readonly property int pressAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.EffectsSlow)
readonly property color resizeHandleColor: Kirigami.Theme.highlightColor
property int orientation
@ -79,14 +82,14 @@ MouseArea {
id: rect
anchors.fill: parent
anchors.margins: root.touchPadding
color: 'white'
color: root.resizeHandleColor
radius: width / 2
transform: Scale {
property real scaleFactor: root.pressed ? 1.2 : 1.0
property real scaleFactor: root.pressed ? MobileShell.Motion.pressScaleOut : 1.0
Behavior on scaleFactor {
NumberAnimation { duration: Kirigami.Units.veryLongDuration; easing.type: Easing.OutExpo }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.EffectsSlow; duration: root.pressAnimationDuration }
}
xScale: scaleFactor

29
containments/homescreens/folio/qml/private/WidgetResizeHandleFrame.qml
View file

@ -7,6 +7,7 @@ import QtQuick.Controls as QQC2
import Qt5Compat.GraphicalEffects
import org.kde.kirigami as Kirigami
import org.kde.plasma.private.mobileshell as MobileShell
import plasma.applet.org.kde.plasma.mobile.homescreen.folio as Folio
import '../delegate'
@ -41,6 +42,8 @@ Item {
property int widgetGridHeightAfterDrag: 0
property var lockDrag: null
readonly property int resizeAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.SpatialDefault)
readonly property color resizeAccentColor: Qt.rgba(Kirigami.Theme.highlightColor.r, Kirigami.Theme.highlightColor.g, Kirigami.Theme.highlightColor.b, 0.85)
property alias handleContainer: handleContainer
@ -142,35 +145,35 @@ Item {
Item {
id: handleContainer
NumberAnimation on width {
MobileShell.MotionNumberAnimation on width {
id: widthAnim
duration: Kirigami.Units.longDuration
easing.type: Easing.InOutQuad
type: MobileShell.Motion.SpatialDefault
duration: root.resizeAnimationDuration
}
NumberAnimation on height {
MobileShell.MotionNumberAnimation on height {
id: heightAnim
duration: Kirigami.Units.longDuration
easing.type: Easing.InOutQuad
type: MobileShell.Motion.SpatialDefault
duration: root.resizeAnimationDuration
}
NumberAnimation on x {
MobileShell.MotionNumberAnimation on x {
id: xAnim
duration: Kirigami.Units.longDuration
easing.type: Easing.InOutQuad
type: MobileShell.Motion.SpatialDefault
duration: root.resizeAnimationDuration
}
NumberAnimation on y {
MobileShell.MotionNumberAnimation on y {
id: yAnim
duration: Kirigami.Units.longDuration
easing.type: Easing.InOutQuad
type: MobileShell.Motion.SpatialDefault
duration: root.resizeAnimationDuration
}
}
Rectangle {
id: resizeOutline
color: 'transparent'
border.color: 'white'
border.color: root.resizeAccentColor
radius: Kirigami.Units.cornerRadius
border.width: 1

9
containments/homescreens/folio/qml/settings/AppletListDelegate.qml
View file

@ -18,8 +18,11 @@ Item {
property Folio.HomeScreen folio
readonly property string pluginName: model.pluginName
readonly property int pressAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.Press)
readonly property real pressedScale: MobileShell.Motion.pressScaleIn
readonly property color hoverColor: Qt.rgba(Kirigami.Theme.highlightColor.r, Kirigami.Theme.highlightColor.g, Kirigami.Theme.highlightColor.b, 0.22)
property real zoomScale: (model.isSupported && mouseArea.pressed) ? 0.8 : 1
property real zoomScale: (model.isSupported && mouseArea.pressed) ? pressedScale : 1
transform: Scale {
origin.x: delegate.width / 2;
origin.y: delegate.height / 2;
@ -27,7 +30,7 @@ Item {
yScale: delegate.zoomScale
}
Behavior on zoomScale { NumberAnimation { duration: 80 } }
Behavior on zoomScale { MobileShell.MotionNumberAnimation { type: MobileShell.Motion.Press; duration: delegate.pressAnimationDuration } }
// Placeholder item used for implement drag & drop
Item {
@ -72,7 +75,7 @@ Item {
Rectangle {
id: background
color: Qt.rgba(255, 255, 255, 0.3)
color: root.hoverColor
visible: model.isSupported && mouseArea.containsMouse
radius: Kirigami.Units.cornerRadius
anchors.fill: parent

22
containments/homescreens/halcyon/qml/FavoritesAppDelegate.qml
View file

@ -12,7 +12,6 @@ import org.kde.kquickcontrolsaddons 2.0
import org.kde.plasma.private.containmentlayoutmanager 1.0 as ContainmentLayoutManager
import org.kde.plasma.private.mobileshell as MobileShell
import org.kde.plasma.private.mobileshell.shellsettingsplugin as ShellSettings
import org.kde.plasma.private.mobileshell.state as MobileShellState
import org.kde.plasma.plasmoid
@ -39,6 +38,9 @@ Item {
readonly property string applicationName: application ? application.name : ""
readonly property string applicationStorageId: application ? application.storageId : ""
readonly property string applicationIcon: application ? application.icon : ""
readonly property int pressAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.Press)
readonly property color pressFeedbackColor: Qt.rgba(Kirigami.Theme.highlightColor.r, Kirigami.Theme.highlightColor.g, Kirigami.Theme.highlightColor.b, 0.18)
readonly property color folderFeedbackColor: Qt.rgba(Kirigami.Theme.highlightColor.r, Kirigami.Theme.highlightColor.g, Kirigami.Theme.highlightColor.b, 0.24)
signal folderOpenRequested()
@ -142,11 +144,12 @@ Item {
property bool launchAppRequested: false
NumberAnimation on zoomScale {
MobileShell.MotionNumberAnimation on zoomScale {
id: shrinkAnim
type: MobileShell.Motion.Press
running: false
duration: ShellSettings.Settings.animationsEnabled ? 80 : 1
to: ShellSettings.Settings.animationsEnabled ? 0.95 : 1
duration: delegate.pressAnimationDuration
to: MobileShell.Motion.pressScaleIn
onFinished: {
if (!mouseArea.pressed) {
growAnim.restart();
@ -154,10 +157,11 @@ Item {
}
}
NumberAnimation on zoomScale {
MobileShell.MotionNumberAnimation on zoomScale {
id: growAnim
type: MobileShell.Motion.Press
running: false
duration: ShellSettings.Settings.animationsEnabled ? 80 : 1
duration: delegate.pressAnimationDuration
to: 1
onFinished: {
if (mouseArea.launchAppRequested) {
@ -188,7 +192,7 @@ Item {
Rectangle {
anchors.fill: parent
radius: height / 2
color: mouseArea.pressed ? Qt.rgba(255, 255, 255, 0.2) : "transparent"
color: mouseArea.pressed ? delegate.pressFeedbackColor : "transparent"
}
RowLayout {
@ -263,7 +267,7 @@ Item {
Rectangle {
anchors.fill: parent
anchors.margins: Kirigami.Units.smallSpacing
color: Qt.rgba(255, 255, 255, 0.2)
color: delegate.folderFeedbackColor
radius: Kirigami.Units.cornerRadius
opacity: delegate.dragFolderAnimationProgress
@ -317,7 +321,7 @@ Item {
id: rect
anchors.fill: parent
anchors.margins: Kirigami.Units.smallSpacing
color: Qt.rgba(255, 255, 255, 0.2)
color: delegate.folderFeedbackColor
radius: Kirigami.Units.cornerRadius
transform: Scale {

11
containments/homescreens/halcyon/qml/FavoritesGrid.qml
View file

@ -18,6 +18,7 @@ MobileShell.GridView {
id: root
property MobileShell.MaskManager maskManager
required property var searchWidget
readonly property int shortAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.SpatialFast)
// don't set anchors.margins since we want everywhere to be draggable
required property bool twoColumn
@ -198,11 +199,12 @@ MobileShell.GridView {
folderAnim.restart();
}
NumberAnimation {
MobileShell.MotionNumberAnimation {
id: folderAnim
target: appDelegate
properties: "dragFolderAnimationProgress"
duration: Kirigami.Units.shortDuration
type: MobileShell.Motion.SpatialFast
duration: root.shortAnimationDuration
}
}
@ -253,10 +255,11 @@ MobileShell.GridView {
// animations
displaced: Transition {
NumberAnimation {
MobileShell.MotionNumberAnimation {
id: transitionAnim
properties: "x,y"
easing.type: Easing.OutQuad
type: MobileShell.Motion.SpatialFast
duration: root.shortAnimationDuration
}
}

32
containments/homescreens/halcyon/qml/FavoritesView.qml
View file

@ -11,7 +11,6 @@ import org.kde.draganddrop 2.0 as DragDrop
import org.kde.kirigami as Kirigami
import org.kde.plasma.private.mobileshell as MobileShell
import org.kde.plasma.private.mobileshell.shellsettingsplugin as ShellSettings
Item {
id: root
@ -26,6 +25,7 @@ Item {
readonly property real cellWidth: twoColumn ? (root.width - leftMargin - rightMargin) / 2 : (root.width - leftMargin - rightMargin)
readonly property real cellHeight: delegateHeight
readonly property int longAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.SpatialDefault)
readonly property real leftMargin: Math.round(width * 0.1)
readonly property real rightMargin: Math.round(width * 0.1)
@ -150,35 +150,35 @@ Item {
}
}
NumberAnimation {
MobileShell.MotionNumberAnimation {
id: goToBeginningAnim
target: favoritesGrid
properties: 'contentY'
to: favoritesGrid.originY
duration: Kirigami.Units.longDuration
easing.type: Easing.InOutQuad
type: MobileShell.Motion.SpatialDefault
duration: root.longAnimationDuration
}
SequentialAnimation {
id: openFolderAnim
ParallelAnimation {
NumberAnimation {
MobileShell.MotionNumberAnimation {
target: favoritesGrid
properties: 'openFolderProgress'
duration: ShellSettings.Settings.animationsEnabled ? Kirigami.Units.longDuration : 0
type: MobileShell.Motion.SpatialDefault
duration: root.longAnimationDuration
to: 1
easing.type: Easing.InOutQuad
}
}
ParallelAnimation {
NumberAnimation {
MobileShell.MotionNumberAnimation {
target: folderGrid
properties: 'openProgress'
duration: ShellSettings.Settings.animationsEnabled ? Kirigami.Units.longDuration : 0
type: MobileShell.Motion.SpatialDefault
duration: root.longAnimationDuration
to: 1
easing.type: Easing.InOutQuad
}
}
}
@ -187,22 +187,22 @@ Item {
id: closeFolderAnim
ParallelAnimation {
NumberAnimation {
MobileShell.MotionNumberAnimation {
target: folderGrid
properties: 'openProgress'
duration: ShellSettings.Settings.animationsEnabled ? Kirigami.Units.longDuration : 0
type: MobileShell.Motion.SpatialDefault
duration: root.longAnimationDuration
to: 0
easing.type: Easing.InOutQuad
}
}
ParallelAnimation {
NumberAnimation {
MobileShell.MotionNumberAnimation {
target: favoritesGrid
properties: 'openFolderProgress'
duration: ShellSettings.Settings.animationsEnabled ? Kirigami.Units.longDuration : 0
type: MobileShell.Motion.SpatialDefault
duration: root.longAnimationDuration
to: 0
easing.type: Easing.InOutQuad
}
}
}

6
containments/homescreens/halcyon/qml/FolderGrid.qml
View file

@ -17,6 +17,7 @@ import plasma.applet.org.kde.plasma.mobile.homescreen.halcyon as Halcyon
MobileShell.GridView {
id: root
property Halcyon.ApplicationFolder folder: null
readonly property int shortAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.SpatialFast)
property string folderName: folder ? folder.name : ""
property var folderModel: folder ? folder.applications : []
@ -223,9 +224,10 @@ MobileShell.GridView {
// animations
displaced: Transition {
NumberAnimation {
MobileShell.MotionNumberAnimation {
properties: "x,y"
easing.type: Easing.OutQuad
type: MobileShell.Motion.SpatialFast
duration: root.shortAnimationDuration
}
}
}

15
containments/homescreens/halcyon/qml/GridAppDelegate.qml
View file

@ -15,7 +15,6 @@ import org.kde.kquickcontrolsaddons
import org.kde.plasma.plasmoid
import org.kde.plasma.private.mobileshell as MobileShell
import org.kde.plasma.private.mobileshell.shellsettingsplugin as ShellSettings
import plasma.applet.org.kde.plasma.mobile.homescreen.halcyon as Halcyon
import org.kde.kirigami as Kirigami
@ -31,6 +30,8 @@ MouseArea {
property alias iconItem: icon
readonly property real margins: Math.floor(width * 0.2)
readonly property int pressAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.Press)
readonly property real pressedScale: MobileShell.Motion.pressScaleIn
signal launch(int x, int y, var source, string title, string storageId)
@ -82,11 +83,12 @@ MouseArea {
property bool launchAppRequested: false
NumberAnimation on zoomScale {
MobileShell.MotionNumberAnimation on zoomScale {
id: shrinkAnim
type: MobileShell.Motion.Press
running: false
duration: ShellSettings.Settings.animationsEnabled ? 80 : 1
to: ShellSettings.Settings.animationsEnabled ? 0.8 : 1
duration: delegate.pressAnimationDuration
to: delegate.pressedScale
onFinished: {
if (!delegate.pressed) {
growAnim.restart();
@ -94,10 +96,11 @@ MouseArea {
}
}
NumberAnimation on zoomScale {
MobileShell.MotionNumberAnimation on zoomScale {
id: growAnim
type: MobileShell.Motion.Press
running: false
duration: ShellSettings.Settings.animationsEnabled ? 80 : 1
duration: delegate.pressAnimationDuration
to: 1
onFinished: {
if (delegate.launchAppRequested) {

7
containments/homescreens/halcyon/qml/GridAppList.qml
View file

@ -35,6 +35,7 @@ MobileShell.GridView {
readonly property int reservedSpaceForLabel: metrics.height
readonly property real effectiveContentWidth: width - leftMargin - rightMargin
readonly property int longAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.SpatialDefault)
cellWidth: gridView.effectiveContentWidth / Math.min(Math.floor(effectiveContentWidth / (Kirigami.Units.iconSizes.huge + Kirigami.Units.largeSpacing * 2)), 8)
cellHeight: cellWidth + reservedSpaceForLabel
@ -46,11 +47,11 @@ MobileShell.GridView {
goToBeginningAnim.restart();
}
NumberAnimation on contentY {
MobileShell.MotionNumberAnimation on contentY {
id: goToBeginningAnim
type: MobileShell.Motion.SpatialDefault
to: gridView.originY
duration: Kirigami.Units.longDuration
easing.type: Easing.InOutQuad
duration: gridView.longAnimationDuration
}
model: Halcyon.ApplicationListModel

3
containments/homescreens/halcyon/qml/HomeScreen.qml
View file

@ -20,6 +20,7 @@ import "settings" as Settings
Item {
id: root
property MobileShell.MaskManager maskManager
readonly property int longAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.EffectsDefault)
required property real topMargin
required property real bottomMargin
@ -37,7 +38,7 @@ Item {
signal wallpaperSelectorTriggered()
Behavior on settingsOpenFactor {
NumberAnimation { duration: Kirigami.Units.longDuration }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.EffectsDefault; duration: root.longAnimationDuration }
}
function triggerHomescreen() {

7
containments/homescreens/halcyon/qml/SearchWidget.qml
View file

@ -21,6 +21,7 @@ Item {
property real bottomPadding: 0
property real leftPadding: 0
property real rightPadding: 0
readonly property int longAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.SpatialDefault)
// Call when the gesture has started
function startGesture() {
@ -110,10 +111,10 @@ Item {
}
}
NumberAnimation on contentY {
MobileShell.MotionNumberAnimation on contentY {
id: anim
duration: Kirigami.Units.longDuration
easing.type: Easing.OutQuad
type: MobileShell.Motion.SpatialDefault
duration: root.longAnimationDuration
running: false
onFinished: {
if (anim.to === flickable.openedContentY) {

5
containments/homescreens/halcyon/qml/main.qml
View file

@ -17,6 +17,7 @@ import plasma.applet.org.kde.plasma.mobile.homescreen.halcyon as Halcyon
ContainmentItem {
id: root
readonly property int longAnimationDuration: MobileShell.Motion.duration(MobileShell.Motion.EffectsDefault)
Component.onCompleted: {
Plasmoid.settings.load();
@ -88,7 +89,7 @@ ContainmentItem {
property real darkenBackgroundFactor: halcyonHomeScreen.page == 1 ? 1 : 0
Behavior on darkenBackgroundFactor {
NumberAnimation { duration: Kirigami.Units.longDuration }
MobileShell.MotionNumberAnimation { type: MobileShell.Motion.EffectsDefault; duration: root.longAnimationDuration }
}
Rectangle {
@ -103,7 +104,7 @@ ContainmentItem {
opacity: halcyonHomeScreen.settingsOpenFactor
anchors.fill: parent
Behavior on color {
ColorAnimation { duration: Kirigami.Units.longDuration }
MobileShell.MotionColorAnimation { type: MobileShell.Motion.EffectsDefault; duration: root.longAnimationDuration }
}
}