Beautify the qquickviewcomparison example

Remove the red rectangle.
Change the background color to a gradient. (taken from rendercontrol)
Disable the transparency checkbox everywhere but Linux since it
usually will not work. (too much hassle with platform specifics like
frameless windows, etc.)

Change-Id: I21488386cddc5841a2bdc8104e7abb197b075b0d
Reviewed-by: Paul Olav Tvete <paul.tvete@digia.com>

examples/quick/quickwidgets/qquickviewcomparison/mainwindow.cpp

@@ -105,8 +105,10 @@ MainWindow::MainWindow()
 
     m_checkboxTransparent = new QCheckBox(tr("Transparent background in QQuickWidget"));
     connect(m_radioWidget, &QCheckBox::toggled, m_checkboxTransparent, &QWidget::setEnabled);
+#ifdef Q_OS_LINUX
     connect(m_checkboxTransparent, &QCheckBox::toggled, this, &MainWindow::onTransparentChanged);
     layout->addWidget(m_checkboxTransparent);
+#endif
 
     setLayout(layout);
 
@@ -184,7 +186,7 @@ void MainWindow::updateView()
     if (m_currentRootObject) {
         m_currentRootObject->setProperty("currentText", text);
         m_currentRootObject->setProperty("multisample", m_checkboxMultiSample->isChecked());
-        m_currentRootObject->setProperty("color", QColor(m_transparent ? Qt::transparent : Qt::darkCyan));
+        m_currentRootObject->setProperty("translucency", m_transparent);
     }
 
     m_overlayLabel->raise();

examples/quick/quickwidgets/qquickviewcomparison/test.qml

@@ -46,6 +46,23 @@ Rectangle {
     id: root
     property alias currentText: edit.text
     property alias multisample: fbitem.multisample
+    property bool translucency: false
+
+    gradient: Gradient {
+        id: grad
+        GradientStop { position: 0; color: "steelblue" }
+        GradientStop { position: 1; color: "black" }
+    }
+
+    onTranslucencyChanged: {
+        if (translucency) {
+            root.color = "transparent";
+            root.gradient = null;
+        } else {
+            root.color = "white";
+            root.gradient = grad;
+        }
+    }
 
     ParticleSystem {
         anchors.fill: parent
@@ -91,14 +108,6 @@ Rectangle {
         }
     }
 
-    Rectangle {
-        width: 300
-        height: 300
-        anchors.centerIn: parent
-        color: "red"
-        NumberAnimation on rotation { from: 0; to: 360; duration: 20000; loops: Animation.Infinite; }
-    }
-
     FbItem {
         id: fbitem
         anchors.fill: parent