Material: move DropShadows back to layer.effect

QTBUG-49979 was fixed, so we can switch back to using layer.effect,
which typically leads to one less item and much less bindings.

Change-Id: I7d1d1462a90c674b5f849134bb6ac8fe6ff0f231
Reviewed-by: Mitch Curtis <mitch.curtis@theqtcompany.com>

4 files changed, 37 insertions, 73 deletions

diff --git a/src/imports/controls/material/Button.qml b/src/imports/controls/material/Button.qml
index 1256e3e1..77128861 100644
--- a/src/imports/controls/material/Button.qml
+++ b/src/imports/controls/material/Button.qml
@@ -71,36 +71,28 @@ T.Button {
     //! [label]
 
     //! [background]
-    background: Item {
+    background: Rectangle {
         implicitWidth: 64
         implicitHeight: 48
 
-        Rectangle {
-            id: rect
-            // external vertical padding is 6 (to increase touch area)
-            y: 6
-            width: parent.width
-            height: parent.height - 12
-            radius: 2
-            color: !control.enabled ? (control.highlighted ? control.Material.raisedHighlightedButtonDisabledColor : control.Material.raisedButtonDisabledColor) :
-                (control.pressed ? (control.highlighted ? control.Material.raisedHighlightedButtonPressColor : control.Material.raisedButtonPressColor) :
-                (control.activeFocus ? (control.highlighted ? control.Material.raisedHighlightedButtonHoverColor : control.Material.raisedButtonHoverColor) :
-                (control.highlighted ? control.Material.raisedHighlightedButtonColor : control.Material.raisedButtonColor)))
+        // external vertical padding is 6 (to increase touch area)
+        y: 6
+        width: parent.width
+        height: parent.height - 12
+        radius: 2
+        color: !control.enabled ? (control.highlighted ? control.Material.raisedHighlightedButtonDisabledColor : control.Material.raisedButtonDisabledColor) :
+            (control.pressed ? (control.highlighted ? control.Material.raisedHighlightedButtonPressColor : control.Material.raisedButtonPressColor) :
+            (control.activeFocus ? (control.highlighted ? control.Material.raisedHighlightedButtonHoverColor : control.Material.raisedButtonHoverColor) :
+            (control.highlighted ? control.Material.raisedHighlightedButtonColor : control.Material.raisedButtonColor)))
 
-            Behavior on color {
-                ColorAnimation {
-                    duration: 400
-                }
+        Behavior on color {
+            ColorAnimation {
+                duration: 400
             }
         }
 
-        DropShadow {
-            source: rect
-            visible: control.enabled
-            x: rect.x
-            y: rect.y
-            width: rect.width
-            height: rect.height
+        layer.enabled: control.enabled
+        layer.effect: DropShadow {
             verticalOffset: 1
             color: control.Material.dropShadowColor
             samples: control.pressed ? 15 : 9
diff --git a/src/imports/controls/material/ComboBox.qml b/src/imports/controls/material/ComboBox.qml
index 2d1e2899..634b5ed4 100644
--- a/src/imports/controls/material/ComboBox.qml
+++ b/src/imports/controls/material/ComboBox.qml
@@ -74,29 +74,21 @@ T.ComboBox {
     //! [contentItem]
 
     //! [background]
-    background: Item {
+    background: Rectangle {
         implicitWidth: 120
         implicitHeight: 32
 
-        Rectangle {
-            id: rect
-            width: parent.width
-            height: parent.height
-            radius: 2
-            color: control.Material.dialogColor
+        radius: 2
+        color: control.Material.dialogColor
 
-            Behavior on color {
-                ColorAnimation {
-                    duration: 400
-                }
+        Behavior on color {
+            ColorAnimation {
+                duration: 400
             }
         }
 
-        DropShadow {
-            source: rect
-            visible: control.enabled
-            width: parent.width
-            height: parent.height
+        layer.enabled: control.enabled
+        layer.effect: DropShadow {
             verticalOffset: 1
             color: control.Material.dropShadowColor
             samples: control.pressed ? 15 : 9
@@ -140,19 +132,11 @@ T.ComboBox {
 //            ScrollIndicator.vertical: ScrollIndicator { }
         }
 
-        background: Item {
-            Rectangle {
-                id: panel
-                width: parent.width
-                height: parent.height
-                color: control.Material.dialogColor
-            }
+        background: Rectangle {
+            color: control.Material.dialogColor
 
-            DropShadow {
-                source: panel
-                visible: control.enabled
-                width: parent.width
-                height: parent.height
+            layer.enabled: control.enabled
+            layer.effect: DropShadow {
                 verticalOffset: 1
                 color: control.Material.dropShadowColor
                 samples: 15
diff --git a/src/imports/controls/material/Menu.qml b/src/imports/controls/material/Menu.qml
index 6dc645a9..1b4eaf81 100644
--- a/src/imports/controls/material/Menu.qml
+++ b/src/imports/controls/material/Menu.qml
@@ -78,21 +78,14 @@ T.Menu {
     //! [contentItem]
 
     //! [background]
-    background: Item {
+    background: Rectangle {
         implicitWidth: 200
         implicitHeight: 200
 
-        Rectangle {
-            id: panel
-            width: parent.width
-            height: parent.height
-            color: control.Material.dialogColor
-        }
+        color: control.Material.dialogColor
 
-        DropShadow {
-            source: panel
-            width: parent.width
-            height: parent.height
+        layer.enabled: true
+        layer.effect: DropShadow {
             verticalOffset: 1
             color: control.Material.dropShadowColor
             samples: 15
diff --git a/src/imports/controls/material/Switch.qml b/src/imports/controls/material/Switch.qml
index d2658de6..7c8e4395 100644
--- a/src/imports/controls/material/Switch.qml
+++ b/src/imports/controls/material/Switch.qml
@@ -96,19 +96,14 @@ T.Switch {
                     duration: 300
                 }
             }
-        }
 
-        DropShadow {
-            x: handle.x
-            y: handle.y
-            width: handle.width
-            height: handle.height
-            source: handle
-            verticalOffset: 1
-            color: control.Material.dropShadowColor
-            spread: 0.3
+            layer.enabled: true
+            layer.effect: DropShadow {
+                verticalOffset: 1
+                color: control.Material.dropShadowColor
+                spread: 0.3
+            }
         }
-
     }
     //! [indicator]