improve calculations for panel back and mask

containment/contents/ui/PanelBox.qml

@@ -100,7 +100,7 @@ Item{
                                     automaticPanelSize + belower.height:
                                     automaticPanelSize + belower.width
 
-        property int automaticPanelSize: Math.min(root.themePanelSize, root.iconSize + units.smallSpacing)
+        property int automaticPanelSize: Math.min(root.themePanelSize, root.iconSize + root.statesLineSize)
 
         Behavior on opacity{
             NumberAnimation { duration: 200 }
@@ -109,8 +109,8 @@ Item{
         Binding {
             target: root
             property: "shadowsSize"
-            when: shadowsSvgItem && root.useThemePanel
+            value: shadowsSvgItem && root.useThemePanel ?
-            value: root.isVertical ?  shadowsSvgItem.margins.top : shadowsSvgItem.margins.bottom
+                       (root.isVertical ?  shadowsSvgItem.margins.top : shadowsSvgItem.margins.bottom) : 0
         }
 
         Binding {

containment/contents/ui/VisibilityManager.qml

@@ -51,7 +51,7 @@ Item{
 
     property int thicknessAutoHidden: 2
     property int thicknessMid: root.statesLineSize + (1 + (0.65 * (root.zoomFactor-1)))*(root.iconSize+root.iconMargin) //needed in some animations
-    property int thicknessNormal: root.statesLineSize + root.iconSize + root.iconMargin + 1
+    property int thicknessNormal: root.statesLineSize + root.iconSize + root.iconMargin + root.shadowsSize + 1
     property int thicknessZoom: root.statesLineSize + ((root.iconSize+root.iconMargin) * root.zoomFactor) + 2
     //it is used to keep thickness solid e.g. when iconSize changes from auto functions
     property int thicknessMidOriginal: statesLineSizeOriginal + (1 + (0.65 * (root.zoomFactor-1)))*(plasmoid.configuration.iconSize+iconMarginOriginal) //needed in some animations
@@ -152,7 +152,7 @@ Item{
                             layoutsContainer.height + space : mainLayout.height + space;
             }
 
-            tempThickness = thicknessNormalOriginal;
+            tempThickness = thicknessNormal;
 
             if (root.animationsNeedThickness > 0) {
                 tempThickness = windowSystem.compositingActive ? thicknessMidOriginal : thicknessNormalOriginal;

containment/contents/ui/main.qml

@@ -83,6 +83,10 @@ DragDrop.DropArea {
     property int shadowsSize: 0
     property int themePanelSize: plasmoid.configuration.panelSize
 
+    property int iconMargin: 0.12 * iconSize
+    property int statesLineSize: nowDock ?  Math.ceil( root.iconSize/13 ) : 0
+
+
     ///FIXME: <delete both> I can't remember why this is needed, maybe for the anchorings!!! In order for the Double Layout to not mess the anchorings...
     //property int mainLayoutPosition: !plasmoid.immutable ? Latte.Dock.Center : (root.isVertical ? Latte.Dock.Top : Latte.Dock.Left)
     //property int panelAlignment: plasmoid.configuration.panelPosition !== Latte.Dock.Justify ? plasmoid.configuration.panelPosition : mainLayoutPosition
@@ -124,8 +128,6 @@ DragDrop.DropArea {
 
     property int durationTime: plasmoid.configuration.durationTime
     property int nowDockHoveredIndex: nowDock ? nowDock.hoveredIndex : -1
-    property int iconMargin: nowDock ? nowDock.iconMargin : 0.12 * iconSize
-    property int statesLineSize: nowDock ? nowDock.statesLineSize : 0
     property int tasksCount: nowDock ? nowDock.tasksCount : 0
     ///END properties from nowDock
 
@@ -403,7 +405,15 @@ DragDrop.DropArea {
 
     //// BEGIN OF Behaviors
     Behavior on iconSize {
-        NumberAnimation { duration: 200 }
+        NumberAnimation {
+            duration: 200
+
+            onRunningChanged: {
+                if (!running) {
+                    delayUpdateMaskArea.start();
+                }
+            }
+        }
     }
     //// END OF Behaviors
 
@@ -506,7 +516,21 @@ DragDrop.DropArea {
         }
     }
 
-    onIconSizeChanged: visibilityManager.updateMaskArea();
+    property bool automaticSizeAnimation: false;
+    onAutomaticIconSizeBasedSizeChanged: {
+        if (!automaticSizeAnimation) {
+            automaticSizeAnimation = true;
+            slotAnimationsNeedBothAxis(1);
+        }
+
+    }
+
+    onIconSizeChanged: {
+        if (((iconSize === automaticIconSizeBasedSize) || (iconSize === plasmoid.configuration.iconSize)) && automaticSizeAnimation){
+            slotAnimationsNeedBothAxis(-1);
+            automaticSizeAnimation=false;
+        }
+    }
 
     //  onIconSizeChanged: console.log("Icon Size Changed:"+iconSize);
 
@@ -1205,5 +1229,18 @@ DragDrop.DropArea {
         }
     }
 
+    //this is a delayer to update mask area, it is used in cases
+    //that animations can not catch up with animations signals
+    //e.g. the automaicIconSize case
+    Timer{
+        id:delayUpdateMaskArea
+        repeat:false;
+        interval:300;
+
+        onTriggered: {
+            visibilityManager.updateMaskArea();
+        }
+    }
+
     ///////////////END TIMER elements
 }

plasmoid/contents/ui/main.qml

@@ -68,9 +68,6 @@ Item {
     property int clearWidth
     property int clearHeight
 
-    //property int iconMargin: 5
-    property int iconMargin: 0.12*iconSize
-
     property int newLocationDebugUse: PlasmaCore.Types.BottomPositioned
     property int newDroppedPosition: -1
     property int noInitCreatedBuffers: 0
@@ -80,7 +77,6 @@ Item {
     property int position : PlasmaCore.Types.BottomPositioned
     property int tasksStarting: 0
     property int realSize: iconSize + iconMargin
-    property int statesLineSize: Math.ceil( root.iconSize/13 )
 
     property real textColorLuma: 0.2126*theme.textColor.r + 0.7152*theme.textColor.g + 0.0722*theme.textColor.b
 
@@ -110,7 +106,9 @@ Item {
     property bool threeColorsWindows: nowDockPanel ? nowDockPanel.threeColorsWindows : plasmoid.configuration.threeColorsWindows
 
     property int durationTime: nowDockPanel ? nowDockPanel.durationTime : plasmoid.configuration.durationTime
+    property int iconMargin: nowDockPanel ? nowDockPanel.iconMargin : 0.12*iconSize
     property int iconSize: nowDockPanel ? nowDockPanel.iconSize : Math.max(plasmoid.configuration.iconSize, 16)
+    property int statesLineSize: nowDockPanel ? nowDockPanel.statesLineSize : Math.ceil( root.iconSize/13 )
     property int tasksHeight: mouseHandler.height
     property int tasksWidth: mouseHandler.width
     property int userPanelPosition: nowDockPanel ? nowDockPanel.panelAlignment : plasmoid.configuration.plasmoidPosition