ImageElements example: Use QQC2 and update copyright

Updating the example to use qt quick controls 2 where it makes sense, as
well as copyright headers.

Task-number: QTBUG-95737
Change-Id: Ie22ab8551926916abd0a478adc16d1d4daeb13ad
Reviewed-by: Mitch Curtis <mitch.curtis@qt.io>
(cherry picked from commit e771c12ae73d987f8bda8802e03694c425ef749c)
Reviewed-by: Qt Cherry-pick Bot <cherrypick_bot@qt-project.org>

13 files changed, 68 insertions, 50 deletions

diff --git a/examples/quick/imageelements/animatedimage.qml b/examples/quick/imageelements/animatedimage.qml
index 04bc38fe95..41c77c38d5 100644
--- a/examples/quick/imageelements/animatedimage.qml
+++ b/examples/quick/imageelements/animatedimage.qml
@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2017 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the examples of the Qt Toolkit.
@@ -47,8 +47,8 @@
 ** $QT_END_LICENSE$
 **
 ****************************************************************************/
-import QtQuick 2.12
-import "../shared" as Examples
+import QtQuick
+import QtQuick.Controls
 
 Column {
     width: 320
@@ -86,29 +86,43 @@ Column {
         }
     }
 
-    Examples.Slider {
-        id: speedSlider
-        name: "Speed"
-        min: 0
-        max: 5
-        init: 1
-        width: 240
-        x: animation.x
-        Text {
+    Row {
+        spacing: 6
+        anchors.horizontalCenter: parent.horizontalCenter
+
+        Label {
+            text: qsTr("Speed:")
+            font.pointSize: 12
+            anchors.verticalCenter: speedSlider.verticalCenter
+        }
+
+        Slider {
+            id: speedSlider
+            from: 0
+            to: 5
+            value: 1
+        }
+
+        Label {
+            font: fontMetrics.font
+            text: qsTr(Math.round(animation.speed * 100) + "%")
+            width: fontMetrics.width
+            anchors.verticalCenter: speedSlider.verticalCenter
+        }
+
+        TextMetrics {
+            id: fontMetrics
+            text: "100%"
             font.pointSize: 12
-            text: Math.round(animation.speed * 100) + "%"
-            x: animation.width - width
-            anchors.verticalCenter: parent.verticalCenter
-            anchors.margins: 6
         }
     }
 
-    Examples.Button {
-        text: "Reset"
+    Button {
+        text: qsTr("Reset")
         enabled: speedSlider.value !== 1
         anchors.horizontalCenter: parent.horizontalCenter
         onClicked: {
-            speedSlider.setValue(1)
+            speedSlider.value = 1
             animation.playing = true
         }
     }
diff --git a/examples/quick/imageelements/animatedsprite.qml b/examples/quick/imageelements/animatedsprite.qml
index 8666c2b9fc..e883f1f679 100644
--- a/examples/quick/imageelements/animatedsprite.qml
+++ b/examples/quick/imageelements/animatedsprite.qml
@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2017 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the examples of the Qt Toolkit.
@@ -47,7 +47,8 @@
 ** $QT_END_LICENSE$
 **
 ****************************************************************************/
-import QtQuick 2.0
+import QtQuick
+import QtQuick.Controls
 
 Item {
     width: 320
@@ -70,7 +71,7 @@ Item {
     }
 //! [sprite]
 
-    Text {
+    Label {
         text: "Left click to resume\nMiddle click to advance backward\nRight click to advance forward"
         visible: sprite.paused
     }
diff --git a/examples/quick/imageelements/borderimage.qml b/examples/quick/imageelements/borderimage.qml
index 00f18737f6..0df09d7aaa 100644
--- a/examples/quick/imageelements/borderimage.qml
+++ b/examples/quick/imageelements/borderimage.qml
@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2017 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the examples of the Qt Toolkit.
@@ -48,7 +48,7 @@
 **
 ****************************************************************************/
 
-import QtQuick 2.0
+import QtQuick
 import "content"
 
 Rectangle {
diff --git a/examples/quick/imageelements/content/BorderImageSelector.qml b/examples/quick/imageelements/content/BorderImageSelector.qml
index d8c2101be7..241f2b7a7e 100644
--- a/examples/quick/imageelements/content/BorderImageSelector.qml
+++ b/examples/quick/imageelements/content/BorderImageSelector.qml
@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2017 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the examples of the Qt Toolkit.
@@ -48,7 +48,7 @@
 **
 ****************************************************************************/
 
-import QtQuick 2.0
+import QtQuick
 
 Item {
     id: selector
diff --git a/examples/quick/imageelements/content/ImageCell.qml b/examples/quick/imageelements/content/ImageCell.qml
index 7804346bd4..7b88b64b88 100644
--- a/examples/quick/imageelements/content/ImageCell.qml
+++ b/examples/quick/imageelements/content/ImageCell.qml
@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2017 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the examples of the Qt Toolkit.
@@ -47,7 +47,8 @@
 ** $QT_END_LICENSE$
 **
 ****************************************************************************/
-import QtQuick 2.0
+import QtQuick
+import QtQuick.Controls
 
 Item {
     property alias mode: image.fillMode
@@ -60,7 +61,7 @@ Item {
         clip: true      // only makes a difference if mode is PreserveAspectCrop
     }
 
-    Text {
+    Label {
         id: captionItem
         anchors.horizontalCenter: parent.horizontalCenter; anchors.bottom: parent.bottom
     }
diff --git a/examples/quick/imageelements/content/MyBorderImage.qml b/examples/quick/imageelements/content/MyBorderImage.qml
index 3198de3bf1..5d11716a43 100644
--- a/examples/quick/imageelements/content/MyBorderImage.qml
+++ b/examples/quick/imageelements/content/MyBorderImage.qml
@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2017 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the examples of the Qt Toolkit.
@@ -48,8 +48,8 @@
 **
 ****************************************************************************/
 
-import QtQml 2.0
-import QtQuick 2.0
+import QtQml
+import QtQuick
 
 Item {
     id: container
diff --git a/examples/quick/imageelements/content/ShadowRectangle.qml b/examples/quick/imageelements/content/ShadowRectangle.qml
index 7bce665b23..fd02eeb8cc 100644
--- a/examples/quick/imageelements/content/ShadowRectangle.qml
+++ b/examples/quick/imageelements/content/ShadowRectangle.qml
@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2017 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the examples of the Qt Toolkit.
@@ -48,7 +48,7 @@
 **
 ****************************************************************************/
 
-import QtQuick 2.0
+import QtQuick
 
 Item {
     property alias color : rectangle.color
diff --git a/examples/quick/imageelements/framestepping.qml b/examples/quick/imageelements/framestepping.qml
index f5bad46e7b..314ee9ad5b 100644
--- a/examples/quick/imageelements/framestepping.qml
+++ b/examples/quick/imageelements/framestepping.qml
@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2019 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the examples of the Qt Toolkit.
@@ -48,7 +48,8 @@
 **
 ****************************************************************************/
 
-import QtQuick 2.14
+import QtQuick
+import QtQuick.Controls
 
 Rectangle {
     width: 480
@@ -71,7 +72,7 @@ Rectangle {
         }
     }
 
-    Text {
+    Label {
         anchors.horizontalCenter: parent.horizontalCenter
         anchors.bottom: parent.bottom
         anchors.margins: 6
diff --git a/examples/quick/imageelements/image.qml b/examples/quick/imageelements/image.qml
index 0750ea3b79..d68382f3d9 100644
--- a/examples/quick/imageelements/image.qml
+++ b/examples/quick/imageelements/image.qml
@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2017 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the examples of the Qt Toolkit.
@@ -48,7 +48,7 @@
 **
 ****************************************************************************/
 
-import QtQuick 2.0
+import QtQuick
 import "content"
 
 Rectangle {
diff --git a/examples/quick/imageelements/imageelements.qml b/examples/quick/imageelements/imageelements.qml
index 91f2e034f7..64c3603b69 100644
--- a/examples/quick/imageelements/imageelements.qml
+++ b/examples/quick/imageelements/imageelements.qml
@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2017 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the examples of the Qt Toolkit.
@@ -48,13 +48,13 @@
 **
 ****************************************************************************/
 
-import QtQuick 2.0
-import "../shared"
+import QtQuick
+import "../shared" as Shared
 
 Item {
     height: 480
     width: 320
-    LauncherList {
+    Shared.LauncherList {
         id: ll
         anchors.fill: parent
         Component.onCompleted: {
diff --git a/examples/quick/imageelements/multiframeborderimage.qml b/examples/quick/imageelements/multiframeborderimage.qml
index 0805ea4243..754bd16ef8 100644
--- a/examples/quick/imageelements/multiframeborderimage.qml
+++ b/examples/quick/imageelements/multiframeborderimage.qml
@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2019 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the examples of the Qt Toolkit.
@@ -48,7 +48,8 @@
 **
 ****************************************************************************/
 
-import QtQuick 2.14
+import QtQuick
+import QtQuick.Controls
 
 Rectangle {
     width: 480
@@ -74,7 +75,7 @@ Rectangle {
         }
     }
 
-    Text {
+    Label {
         anchors.centerIn: parent
         horizontalAlignment: Text.AlignHCenter
         text: "frame " + (img.currentFrame + 1) + " of " + img.frameCount +
diff --git a/examples/quick/imageelements/shadows.qml b/examples/quick/imageelements/shadows.qml
index 981133f725..78d4ea2ac3 100644
--- a/examples/quick/imageelements/shadows.qml
+++ b/examples/quick/imageelements/shadows.qml
@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2017 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the examples of the Qt Toolkit.
@@ -48,7 +48,7 @@
 **
 ****************************************************************************/
 
-import QtQuick 2.0
+import QtQuick
 import "content"
 
 Rectangle {
diff --git a/examples/quick/imageelements/spritesequence.qml b/examples/quick/imageelements/spritesequence.qml
index 9597ad0710..b017ade229 100644
--- a/examples/quick/imageelements/spritesequence.qml
+++ b/examples/quick/imageelements/spritesequence.qml
@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2017 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the examples of the Qt Toolkit.
@@ -47,7 +47,7 @@
 ** $QT_END_LICENSE$
 **
 ****************************************************************************/
-import QtQuick 2.0
+import QtQuick
 
 Item {
     width: 320