github-forks
/
latte-dock
mirror of https://github.com/KDE/latte-dock.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

improve attention bouncing experience

Browse Source 
--add more animation phases in order to provide
a better experience for the inAttention bouncing
animation
--add visual debuggers for the spacers and padders
needed for the bouncing animation
v0.7
Michail Vourlakos 7 years ago
parent 2a2ccbdeda
commit 6e4321b650
8 changed files with 115 additions and 93 deletions
Show Stats Download Patch File Download Diff File

57
plasmoid/package/contents/ui/task/TaskDelegate.qml
Unescape Escape View File

@ -79,7 +79,7 @@ MouseArea{
}
acceptedButtons: Qt.LeftButton | Qt.MidButton | Qt.RightButton
hoverEnabled: visible && (inAnimation !== true) && (!IsStartup) && (!root.taskInAnimation)
hoverEnabled: visible && (!inAnimation) && (!IsStartup) && (!root.taskInAnimation)
&& (!root.editMode || root.debugLocation)&&(!inBouncingAnimation) && !isSeparator
// hoverEnabled: false
//opacity : isSeparator && (hiddenSpacerLeft.neighbourSeparator || hiddenSpacerRight.neighbourSeparator) ? 0 : 1
@ -95,6 +95,7 @@ MouseArea{
property bool inAttentionAnimation: false
property bool inBlockingAnimation: false
property bool inBouncingAnimation: false
property bool inFastRestoreAnimation: false
property bool inMimicParabolicAnimation: false
property real mimicParabolicScale: -1
property bool inPopup: false
@ -309,6 +310,7 @@ MouseArea{
height: root.vertical ? nHiddenSize : wrapper.height
visible: (index === 0) || (separatorSpace > 0) || mainItemContainer.inAttentionAnimation
|| mainItemContainer.inFastRestoreAnimation || mainItemContainer.inMimicParabolicAnimation
property bool neighbourSeparator: false
//in case there is a neighbour separator, lastValidIndex is used in order to protect from false
@ -321,7 +323,7 @@ MouseArea{
(2+root.iconMargin/2) : 0
property real nHiddenSize: {
if (!inAttentionAnimation) {
if (!inAttentionAnimation && !inMimicParabolicAnimation && !inFastRestoreAnimation) {
return (nScale > 0) ? (mainItemContainer.spacersMaxSize * nScale) + separatorSpace : separatorSpace;
} else {
return (nScale > 0) ? (root.iconSize * nScale) + separatorSpace : separatorSpace;
@ -357,27 +359,27 @@ MouseArea{
Component.onCompleted: hiddenSpacerLeft.updateNeighbour();
Behavior on nScale {
/*Behavior on nScale {
enabled: !root.globalDirectRender
NumberAnimation { duration: 3 * mainItemContainer.animationTime }
}
/*Behavior on nScale {
Behavior on nScale {
enabled: root.globalDirectRender
NumberAnimation { duration: root.directRenderAnimationTime }
}*/
Behavior on nHiddenSize {
enabled: !root.globalDirectRender || mainItemContainer.inMimicParabolicAnimation
Behavior on separatorSpace {
enabled: !root.globalDirectRender
NumberAnimation { duration: 3 * mainItemContainer.animationTime }
}
Behavior on nHiddenSize {
enabled: root.globalDirectRender && !mainItemContainer.inMimicParabolicAnimation
Behavior on separatorSpace {
enabled: root.globalDirectRender
NumberAnimation { duration: root.directRenderAnimationTime }
}
/* Rectangle{
/*Rectangle{
width: !root.vertical ? parent.width : 1
height: !root.vertical ? 1 : parent.height
x: root.vertical ? parent.width /2 : 0
@ -385,7 +387,7 @@ MouseArea{
border.width: 1
border.color: "red"
color: "transparent"
} */
}*/
}
TaskWrapper{ id: wrapper }
@ -398,6 +400,7 @@ MouseArea{
height: root.vertical ? nHiddenSize : wrapper.height
visible: (index === icList.count - 1) || (separatorSpace > 0) || mainItemContainer.inAttentionAnimation
|| mainItemContainer.inFastRestoreAnimation || mainItemContainer.inMimicParabolicAnimation
property bool neighbourSeparator: false
//in case there is a neighbour separator, lastValidIndex is used in order to protect from false
@ -410,7 +413,7 @@ MouseArea{
(2+root.iconMargin/2) : 0
property real nHiddenSize: {
if (!inAttentionAnimation) {
if (!inAttentionAnimation && !inMimicParabolicAnimation && !inFastRestoreAnimation) {
return (nScale > 0) ? (mainItemContainer.spacersMaxSize * nScale) + separatorSpace : separatorSpace;
} else {
return (nScale > 0) ? (root.iconSize * nScale) + separatorSpace : separatorSpace;
@ -448,7 +451,7 @@ MouseArea{
Component.onCompleted: hiddenSpacerRight.updateNeighbour();
Behavior on nScale {
/*Behavior on nScale {
enabled: !root.globalDirectRender
NumberAnimation { duration: 3 * mainItemContainer.animationTime }
}
@ -456,19 +459,19 @@ MouseArea{
Behavior on nScale {
enabled: root.globalDirectRender
NumberAnimation { duration: root.directRenderAnimationTime }
}
}*/
Behavior on nHiddenSize {
enabled: !root.globalDirectRender || mainItemContainer.inMimicParabolicAnimation
Behavior on separatorSpace {
enabled: !root.globalDirectRender
NumberAnimation { duration: 3 * mainItemContainer.animationTime }
}
Behavior on nHiddenSize {
enabled: root.globalDirectRender && !mainItemContainer.inMimicParabolicAnimation
Behavior on separatorSpace {
enabled: root.globalDirectRender
NumberAnimation { duration: root.directRenderAnimationTime }
}
/* Rectangle{
/*Rectangle{
width: !root.vertical ? parent.width : 1
height: !root.vertical ? 1 : parent.height
x: root.vertical ? parent.width /2 : 0
@ -476,7 +479,7 @@ MouseArea{
border.width: 1
border.color: "red"
color: "transparent"
} */
}*/
}
}// Flow with hidden spacers inside
@ -524,7 +527,7 @@ MouseArea{
wrapper.mScale = 1;
}*/
if (distanceFromHovered >= 1) {
if (distanceFromHovered >= 1 && !inAttentionAnimation && !inFastRestoreAnimation && !inMimicParabolicAnimation) {
hiddenSpacerLeft.nScale = 0;
hiddenSpacerRight.nScale = 0;
}
@ -632,7 +635,7 @@ MouseArea{
}
onPositionChanged: {
if (root.editMode || (inBlockingAnimation && !inAttentionAnimation))
if (root.editMode || (inBlockingAnimation && !(inAttentionAnimation||inFastRestoreAnimation||inMimicParabolicAnimation)))
return;
if(!root.latteDock)
@ -877,7 +880,7 @@ MouseArea{
if (root.globalDirectRender)
wrapper.mScale = 1;
else
else if (!inAttentionAnimation && !inFastRestoreAnimation && !inMimicParabolicAnimation)
restoreAnimation.start();
}
@ -1091,13 +1094,11 @@ MouseArea{
function slotMimicEnterForParabolic(){
if (containsMouse) {
if (!inBlockingAnimation || inAttentionAnimation) {
if (inMimicParabolicAnimation) {
mimicParabolicScale = root.zoomFactor;
}
wrapper.calculateScales(icList.currentSpot);
if (inMimicParabolicAnimation) {
mimicParabolicScale = root.zoomFactor;
}
wrapper.calculateScales(icList.currentSpot);
}
}

54
plasmoid/package/contents/ui/task/TaskIconItem.qml
Unescape Escape View File

@ -68,7 +68,7 @@ Item{
property Item titleTooltipVisualParent: titleTooltipParent
/* Rectangle{
/* Rectangle{
anchors.fill: parent
border.width: 1
border.color: "green"
@ -140,22 +140,38 @@ Item{
Latte.IconItem{
id: iconImageBuffer
anchors.rightMargin: root.position === PlasmaCore.Types.RightPositioned
|| (root.position === PlasmaCore.Types.LeftPositioned
&& mainItemContainer.inAddRemoveAnimation)
? root.thickMarginBase : 0
anchors.leftMargin: root.position === PlasmaCore.Types.LeftPositioned
|| (root.position === PlasmaCore.Types.RightPositioned
&& mainItemContainer.inAddRemoveAnimation)
? root.thickMarginBase : 0
anchors.topMargin: root.position === PlasmaCore.Types.TopPositioned
|| (root.position === PlasmaCore.Types.BottomPositioned
&& mainItemContainer.inAddRemoveAnimation)
? root.thickMarginBase : 0
anchors.bottomMargin: root.position === PlasmaCore.Types.BottomPositioned
|| (root.position === PlasmaCore.Types.TopPositioned
&& mainItemContainer.inAddRemoveAnimation)
? root.thickMarginBase : 0
anchors.rightMargin:{
if (root.position === PlasmaCore.Types.RightPositioned)
return root.thickMarginBase;
else if (root.position === PlasmaCore.Types.LeftPositioned)
return wrapper.mScale * root.thickMarginHigh;
else
return 0;
}
anchors.leftMargin: {
if (root.position === PlasmaCore.Types.LeftPositioned)
return root.thickMarginBase;
else if (root.position === PlasmaCore.Types.RightPositioned)
return wrapper.mScale * root.thickMarginHigh;
else
return 0;
}
anchors.topMargin: {
if (root.position === PlasmaCore.Types.TopPositioned)
return root.thickMarginBase;
else if (root.position === PlasmaCore.Types.BottomPositioned)
return wrapper.mScale * root.thickMarginHigh;
else
return 0;
}
anchors.bottomMargin:{
if (root.position === PlasmaCore.Types.BottomPositioned)
return root.thickMarginBase;
else if (root.position === PlasmaCore.Types.TopPositioned)
return wrapper.mScale * root.thickMarginHigh;
else
return 0;
}
width: Math.round(newTempSize) //+ 2*centralItem.shadowSize
height: Math.round(width)
@ -199,7 +215,7 @@ Item{
states: [
State{
name: "*"
when: !launcherAnimation.running && !newWindowAnimation.running && !mainItemContainer.inAddRemoveAnimation
when: !launcherAnimation.running && !newWindowAnimation.running && !mainItemContainer.inAddRemoveAnimation && !fastRestoreAnimation.running
AnchorChanges{
target:iconImageBuffer;
@ -229,7 +245,7 @@ Item{
State{
name: "animating"
when: (launcherAnimation.running || newWindowAnimation.running) && !mainItemContainer.inAddRemoveAnimation
when: (launcherAnimation.running || newWindowAnimation.running || fastRestoreAnimation.running) && !mainItemContainer.inAddRemoveAnimation
AnchorChanges{
target:iconImageBuffer;

45
plasmoid/package/contents/ui/task/TaskWrapper.qml
Unescape Escape View File

@ -156,7 +156,7 @@ Item{
Loader{
id: firstPadding
active: secondIndicator.active && mainItemContainer.inAttentionAnimation
active: secondIndicator.active && (mainItemContainer.inAttentionAnimation || mainItemContainer.inFastRestoreAnimation)
visible: active
sourceComponent: Component{
@ -164,7 +164,7 @@ Item{
width: root.vertical ? wrapper.maxThickness-wrapper.width : 1
height: !root.vertical ? wrapper.maxThickness-wrapper.height : 1
/* Rectangle{
/* Rectangle{
width: !root.vertical ? 1 : parent.width
height: !root.vertical ? parent.height : 1
x: !root.vertical ? wrapper.width /2 : 0
@ -183,7 +183,7 @@ Item{
Loader{
id: secondPadding
active: firstIndicator.active && mainItemContainer.inAttentionAnimation
active: firstIndicator.active && (mainItemContainer.inAttentionAnimation || mainItemContainer.inFastRestoreAnimation)
visible: active
sourceComponent: Component{
@ -191,7 +191,7 @@ Item{
width: root.vertical ? wrapper.maxThickness-wrapper.width : 1
height: !root.vertical ? wrapper.maxThickness-wrapper.height : 1
/* Rectangle{
/*Rectangle{
width: !root.vertical ? 1 : parent.width
height: !root.vertical ? parent.height : 1
x: !root.vertical ? wrapper.width/2 : 0
@ -199,7 +199,7 @@ Item{
border.width: 1
border.color: "blue"
color: "transparent"
} */
}*/
}
}
}
@ -234,12 +234,14 @@ Item{
var scales = parabolicManager.applyParabolicEffect(index, currentMousePosition, center);
//Left hiddenSpacer
if(((index === 0 )&&(icList.count > 1)) && !root.disableLeftSpacer){
if(((index === 0 )&&(icList.count > 1)) && !root.disableLeftSpacer
&& !inMimicParabolicAnimation && !inFastRestoreAnimation){
hiddenSpacerLeft.nScale = scales.leftScale - 1;
}
//Right hiddenSpacer
if(((index === icList.count - 1 )&&(icList.count>1)) && (!root.disableRightSpacer)){
if(((index === icList.count - 1 )&&(icList.count>1)) && !root.disableRightSpacer
&& !inMimicParabolicAnimation && !inFastRestoreAnimation){
hiddenSpacerRight.nScale = scales.rightScale - 1;
}
@ -249,20 +251,14 @@ Item{
} //nScale
function signalUpdateScale(nIndex, nScale, step){
if ((index === nIndex)&&(mainItemContainer.hoverEnabled)&&(waitingLaunchers.length===0)){
/*if (nScale !== 1){
if (isSeparator){
console.log("WRONG TASK SIGNAL for internal separator at pos:"+ index +" and zoom:"+nScale);
}
}*/
if ((index === nIndex)&&(mainItemContainer.hoverEnabled || inMimicParabolicAnimation)&&(waitingLaunchers.length===0)){
if (mainItemContainer.inAttentionAnimation) {
var subSpacerScale = (nScale-1)/2;
hiddenSpacerLeft.nScale = subSpacerScale;
hiddenSpacerRight.nScale = subSpacerScale;
} else if (!inBlockingAnimation) {
} else if (!inBlockingAnimation || mainItemContainer.inMimicParabolicAnimation) {
var newScale = 1;
if(nScale >= 0) {
@ -277,7 +273,6 @@ Item{
mScale = newScale;
}
// console.log(index+ ", "+mScale);
}
}
@ -293,12 +288,20 @@ Item{
root.startEnableDirectRenderTimer();
}
if (inMimicParabolicAnimation && mScale >= mimicParabolicScale){
inMimicParabolicAnimation = false;
mimicParabolicScale = -1;
if (inMimicParabolicAnimation){
if (mScale >= mimicParabolicScale) {
inMimicParabolicAnimation = false;
inAnimation = false;
inBlockingAnimation = false;
mimicParabolicScale = -1;
} else {
var tempScale = (root.zoomFactor - mScale) / 2;
hiddenSpacerLeft.nScale = tempScale;
hiddenSpacerRight.nScale = tempScale;
}
}
if ((mScale > 1) && !mainItemContainer.isZoomed) {
mainItemContainer.isZoomed = true;
root.signalAnimationsNeedBothAxis(1);

37
plasmoid/package/contents/ui/task/animations/TaskFastRestoreAnimation.qml
Unescape Escape View File

@ -30,7 +30,8 @@ SequentialAnimation{
ScriptAction {
script: {
mainItemContainer.inMimicParabolicAnimation = true;
mainItemContainer.inFastRestoreAnimation = true;
mainItemContainer.inBlockingAnimation = true;
}
}
@ -58,33 +59,25 @@ SequentialAnimation{
duration: fastRestoreAnimation.speed
easing.type: Easing.Linear
}
}
PropertyAnimation {
target: hiddenSpacerLeft
property: "nScale"
to: 0
duration: fastRestoreAnimation.speed
easing.type: Easing.Linear
onStopped: {
if (!mainItemContainer.containsMouse && !parabolicManager.neighbourIsHovered(itemIndex)) {
mainItemContainer.inMimicParabolicAnimation = false;
} else {
mainItemContainer.inMimicParabolicAnimation = true;
}
PropertyAnimation {
target: hiddenSpacerRight
property: "nScale"
to: 0
duration: fastRestoreAnimation.speed
easing.type: Easing.Linear
newWindowAnimation.stop();
if (!mainItemContainer.containsMouse && !parabolicManager.neighbourIsHovered(itemIndex)) {
mainItemContainer.inBlockingAnimation = false;
}
}
onStopped: {
if (newWindowAnimation.paused){
if (!mainItemContainer.containsMouse && !parabolicManager.neighbourIsHovered(itemIndex)) {
mainItemContainer.inMimicParabolicAnimation = false;
}
root.mimicEnterForParabolic();
newWindowAnimation.stop();
root.mimicEnterForParabolic();
}
mainItemContainer.inFastRestoreAnimation = false;
// console.log("Fast Restore Animation ended...");
}
}

5
plasmoid/package/contents/ui/task/animations/TaskNewWindowAnimation.qml
Unescape Escape View File

@ -44,7 +44,7 @@ SequentialAnimation{
duration: newWindowAnimation.speed
easing.type: Easing.OutQuad
property real thickPercentage: mainItemContainer.inAttentionAnimation ? 0.9 : 0.6
property real thickPercentage: mainItemContainer.inAttentionAnimation ? 1 : 0.6
}
PropertyAnimation {
@ -118,7 +118,7 @@ SequentialAnimation{
function bounceNewWindow(){
//if (isDemandingAttention && !root.dockIsHidden && (root.zoomFactor > 1)){
if (!root.dockIsHidden && (root.zoomFactor > 1) && (root.durationTime>0)){
if (!root.dockIsHidden && (root.zoomFactor > 1) && (root.durationTime>0) && !root.reverseLinesPositionasfa){
newWindowAnimation.init();
start();
}
@ -129,6 +129,7 @@ SequentialAnimation{
}
Component.onDestruction: {
mainItemContainer.groupWindowAdded.disconnect(bounceNewWindow);
sendEndOfNeedThicknessAnimation();
}
}

2
plasmoid/package/contents/ui/task/animations/TaskRealRemovalAnimation.qml
Unescape Escape View File

@ -62,7 +62,7 @@ SequentialAnimation {
root.signalAnimationsNeedLength(1);
if (wrapper.mScale > 1 && !taskRealRemovalAnimation.enabledAnimation) {
if (wrapper.mScale > 1 && !taskRealRemovalAnimation.enabledAnimation && !mainItemContainer.inBouncingAnimation) {
parabolicManager.setFrozenTask(mainItemContainer.launcherUrl, wrapper.mScale);
}
}

4
plasmoid/package/contents/ui/task/animations/TaskRemoveWindowFromGroupAnimation.qml
Unescape Escape View File

@ -50,6 +50,10 @@ Item{
mainItemContainer.groupWindowRemoved.connect(removeTask);
}
Component.onDestruction: {
mainItemContainer.groupWindowRemoved.disconnect(removeTask);
}
///////////// Component for animating removing window from group
Component {

4
plasmoid/package/contents/ui/task/animations/TaskRestoreAnimation.qml
Unescape Escape View File

@ -49,4 +49,8 @@ ParallelAnimation{
duration: 3 * mainItemContainer.animationTime
easing.type: Easing.Linear
}
onStarted: {
// console.log("restore animation started...");
}
}

Write Preview
Loading…
Cancel
Save