EffectComposer: Use a switch instead of the checkbox in code editor

Fixes: QDS-14631
Change-Id: Iea96d299429be45da1283f9c1e2da82c53c8ff2c
Reviewed-by: Henning Gründl <henning.gruendl@qt.io>

share/qtcreator/qmldesigner/effectComposerQmlSources/CodeEditorFooter.qml

@@ -22,16 +22,19 @@ Rectangle {
 
         spacing: StudioTheme.Values.controlGap
 
-        StudioControls.CheckBox {
+        StudioControls.Switch {
             id: liveUpdateButton
 
             objectName: "BtnLiveUpdate"
 
             text: qsTr("Live Update")
             actionIndicatorVisible: false
-            style: StudioTheme.Values.viewBarControlStyle
+            style: StudioTheme.ControlStyle {
+                squareControlSize: Qt.size(20, 20)
+                switchPadding: 2
+            }
             checked: root.rootEditor ? root.rootEditor.liveUpdate : false
-            onToggled: root.rootEditor.liveUpdate = checked
+            onToggled: root.rootEditor.liveUpdate = liveUpdateButton.checked
             Layout.alignment: Qt.AlignVCenter
             Layout.leftMargin: StudioTheme.Values.toolbarHorizontalMargin
         }

share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/Switch.qml

@@ -61,7 +61,7 @@ T.Switch {
         Rectangle {
             id: switchIndicator
 
-            readonly property real gap: 5
+            readonly property real gap: control.style.switchPadding
             property real size: switchBackground.implicitHeight - switchIndicator.gap * 2
 
             x: control.checked ? parent.width - width - switchIndicator.gap

share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/ControlStyle.qml

@@ -72,6 +72,8 @@ QtObject {
     property real scrollBarActivePadding: Values.scrollBarActivePadding
     property real scrollBarInactivePadding: Values.scrollBarInactivePadding
 
+    property real switchPadding: Values.controlGap
+
     property real dialogScreenMargin: Values.dialogScreenMargin
 
     // Special colors