Android: QtQuick for Android: Fix example scaling features

-set button and other text sizes back
-add thumb and track back to switch
-Change main relative layout gravity from center_vertical to center_horizontal
to make the topMargin take effect
-add previous topMargins back
-remove layout_margins dimension as there were already dimensions for all the places
it was used in
-change naming of some dimensions
-remove unused dimensions
-Adjust text sizes in qtquickview_kotlin and java, they were little
too small on high dpi devices
-Adjust text sizes, margins and other dimensions in Main and Second.qml files

Fixes: QTBUG-134405
Pick-to: 6.9
Change-Id: I35bc7892abe2435bd63b40bca9a21061ae9f0fa8
Reviewed-by: Petri Virkkunen <[email protected]>

16 files changed, 218 insertions, 160 deletions

diff --git a/examples/platforms/android/qtquickview/Main.qml b/examples/platforms/android/qtquickview/Main.qml
index 965472f851..f22a5490bb 100644
--- a/examples/platforms/android/qtquickview/Main.qml
+++ b/examples/platforms/android/qtquickview/Main.qml
@@ -6,74 +6,79 @@ import QtQuick.Controls
 Rectangle {
     id: mainRectangle
 
+    color: colorStringFormat
+
     property string colorStringFormat: "#1CB669"
 
     signal onClicked()
 
-    color: colorStringFormat
-
     Text {
         id: helloText
 
         text: "First QML View"
         color: "white"
         font.pointSize: 72
-        width: parent.width
         font.bold: true
-        wrapMode: Text.Wrap
+        wrapMode: Text.WordWrap
+        width: mainRectangle.width
         horizontalAlignment: Text.AlignHCenter
+
         anchors {
-            top: parent.top
-            topMargin: 50
             horizontalCenter: parent.horizontalCenter
+            top: parent.top
+            topMargin: mainRectangle.height / 40
         }
     }
 
-    Column {
-        anchors.centerIn: parent
-        width: parent.width
-        spacing: 30
 
-        Text {
-            id: changeColorText
+    Text {
+        id: changeColorText
 
-            text: "Tap button to change Java view background color"
-            wrapMode: Text.Wrap
-            color: "white"
-            width: parent.width
-            horizontalAlignment: Text.AlignHCenter
-            anchors.horizontalCenter: parent.horizontalCenter
+        text: "Tap button to change Java view background color"
+        color: "white"
+        font.pointSize: 48
+        wrapMode: Text.WordWrap
+        padding: 20
+        width: mainRectangle.width
+        horizontalAlignment: Text.AlignHCenter
+
+        anchors {
+            horizontalCenter: parent.horizontalCenter
+            top: helloText.bottom;
+            topMargin: mainRectangle.height / 10
         }
+    }
 
-        Button {
-            id: button
+    Button {
+        id: button
 
-            anchors.horizontalCenter: parent.horizontalCenter
+        anchors {
+            horizontalCenter: parent.horizontalCenter
+            top: changeColorText.bottom
+            topMargin: mainRectangle.height / 30
+        }
 
-            onClicked: mainRectangle.onClicked()
+        onClicked: mainRectangle.onClicked()
 
-            background: Rectangle {
-                id: buttonBackground
+        background: Rectangle {
+            id: buttonBackground
 
-                radius: 14
-                color: "#6200EE"
-                opacity: button.down ? 0.6 : 1
-                scale: button.down ? 0.9 : 1
-            }
+            radius: 14
+            color: "#6200EE"
+            opacity: button.down ? 0.6 : 1
+            scale: button.down ? 0.9 : 1
+        }
 
-            contentItem: Text {
-                id: buttonText
+        contentItem: Text {
+            id: buttonText
 
-                text: "CHANGE COLOR"
-                color: "white"
-                font.pixelSize: 58
-                minimumPixelSize: 10
-                fontSizeMode: Text.Fit
-                font.bold: true
-                wrapMode: Text.Wrap
-                horizontalAlignment: Text.AlignHCenter
-                verticalAlignment: Text.AlignVCenter
-            }
+            text: "CHANGE COLOR"
+            color: "white"
+            font.pointSize: 56
+            font.bold: true
+            padding: 20
+            horizontalAlignment: Text.AlignHCenter
+            verticalAlignment: Text.AlignVCenter
         }
     }
 }
diff --git a/examples/platforms/android/qtquickview/Second.qml b/examples/platforms/android/qtquickview/Second.qml
index 1fcbe8919d..e00e88ea6e 100644
--- a/examples/platforms/android/qtquickview/Second.qml
+++ b/examples/platforms/android/qtquickview/Second.qml
@@ -16,53 +16,70 @@ Rectangle {
         text: "Second QML View"
         color: "white"
         font.pointSize: 72
-        width: parent.width
         font.bold: true
-        wrapMode: Text.Wrap
+        wrapMode: Text.WordWrap
+        width: secondaryRectangle.width
         horizontalAlignment: Text.AlignHCenter
+
         anchors {
+            horizontalCenter: parent.horizontalCenter
             top: parent.top
-            topMargin: 50
+            topMargin: secondaryRectangle.height / 40
+        }
+    }
+
+    Text {
+        id: gridText
+
+        text: "QML Grid type"
+        font.pointSize: 48
+        color: "white"
+        width: secondaryRectangle.width
+        wrapMode: Text.WordWrap
+        horizontalAlignment: Text.AlignHCenter
+
+        anchors {
+            top: title.bottom
+            topMargin: secondaryRectangle.height / 10
             horizontalCenter: parent.horizontalCenter
         }
     }
 
-    Column {
-        anchors.centerIn: parent
-        width: parent.width
-        spacing: 30
-
-        Grid {
-            id: grid
-
-            columns: 3
-            rows: 3
-            spacing: 50
-            rotation: gridRotation
-            anchors.horizontalCenter: parent.horizontalCenter
-
-            Repeater {
-                id: repeater
-
-                model: [
-                    "green",
-                    "lightblue",
-                    "grey",
-                    "red",
-                    "black",
-                    "white",
-                    "pink",
-                    "yellow",
-                    "orange"
-                ]
-
-                Rectangle {
-                    required property string modelData
-
-                    height: 50
-                    width: 50
-                    color: modelData
-                }
+    Grid {
+        id: grid
+
+        columns: 3
+        rows: 3
+        spacing: secondaryRectangle.height / 15
+        rotation: gridRotation
+
+        anchors {
+            horizontalCenter: parent.horizontalCenter
+            top: gridText.bottom
+            topMargin: secondaryRectangle.height / 10
+        }
+
+        Repeater {
+            id: repeater
+
+            model: [
+                "green",
+                "lightblue",
+                "grey",
+                "red",
+                "black",
+                "white",
+                "pink",
+                "yellow",
+                "orange"
+            ]
+
+            Rectangle {
+                required property string modelData
+
+                height: secondaryRectangle.height / 15
+                width: height
+                color: modelData
             }
         }
     }
diff --git a/examples/platforms/android/qtquickview_java/app/src/main/res/layout-land/activity_main.xml b/examples/platforms/android/qtquickview_java/app/src/main/res/layout-land/activity_main.xml
index 3d31ebfd69..15f43e7945 100644
--- a/examples/platforms/android/qtquickview_java/app/src/main/res/layout-land/activity_main.xml
+++ b/examples/platforms/android/qtquickview_java/app/src/main/res/layout-land/activity_main.xml
@@ -1,5 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:tools="http://schemas.android.com/tools"
     android:id="@+id/mainLinear"
     android:layout_width="match_parent"
@@ -27,7 +28,7 @@
         android:layout_width="0dp"
         android:layout_height="match_parent"
         android:layout_weight="1"
-        android:gravity="center_vertical"
+        android:gravity="center_horizontal"
         android:background="@color/lilac">
 
         <TextView
@@ -36,6 +37,7 @@
             android:layout_height="wrap_content"
             android:layout_centerHorizontal="true"
             android:text="@string/java"
+            android:layout_marginTop="@dimen/title_margin_top"
             android:textColor="@color/white"
             android:textStyle="bold"
             android:textSize="@dimen/title_text_size"/>
@@ -46,7 +48,7 @@
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_below="@+id/header_title"
-            android:layout_marginTop="25dp"
+            android:layout_marginTop="@dimen/smaller_top_margin"
             android:layout_centerHorizontal="true"
             android:text="@string/qml_view_status"
             android:textColor="@color/white"/>
@@ -58,7 +60,7 @@
             android:orientation="horizontal"
             android:layout_centerHorizontal="true"
             android:layout_below="@id/qmlStatusText"
-            android:layout_marginTop="@dimen/layout_margins">
+            android:layout_marginTop="@dimen/bigger_top_margin">
 
             <TextView
                 android:layout_width="wrap_content"
@@ -74,14 +76,14 @@
                 android:layout_height="@dimen/color_box_height"
                 android:background="@color/cardview_shadow_start_color"
                 android:layout_gravity="center_vertical"
-                android:layout_marginStart="@dimen/layout_margins">
+                android:layout_marginStart="@dimen/color_box_margin_start">
 
                 <TextView
                     android:id="@+id/qmlViewBackgroundText"
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
                     android:textSize="@dimen/other_text_size"
-                    android:text="placeholder"
+                    android:text=""
                     android:layout_centerInParent="true"
                     android:textColor="@color/white"/>
 
@@ -93,7 +95,7 @@
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_below="@+id/qmlColorLayout"
-            android:layout_marginTop="@dimen/layout_margins"
+            android:layout_marginTop="@dimen/bigger_top_margin"
             android:layout_centerHorizontal="true">
 
             <TextView
@@ -107,7 +109,10 @@
                 android:id="@+id/disconnectQmlListenerSwitch"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                android:checked="true"/>
+                android:layout_marginStart="@dimen/switch_left_margin"
+                android:checked="true"
+                app:track="@drawable/switch_track"
+                android:thumb="@drawable/switch_thumb"/>
 
         </LinearLayout>
 
@@ -117,18 +122,23 @@
             android:orientation="vertical"
             android:gravity="center_horizontal"
             android:layout_below="@+id/switchAndTextLayout"
-            android:layout_marginTop="@dimen/layout_margins">
+            android:layout_marginTop="@dimen/bigger_top_margin">
             <Button
                 android:id="@+id/changeQmlColorButton"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_gravity="center_horizontal"
+                android:textSize="@dimen/other_text_size"
+                app:cornerRadius="@dimen/button_corner_radius"
                 android:text="@string/change_qml_background" />
             <Button
                 android:id="@+id/rotateQmlGridButton"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_gravity="center_horizontal"
+                android:layout_marginTop="@dimen/rotate_qml_grid_top_margin"
+                android:textSize="@dimen/other_text_size"
+                app:cornerRadius="@dimen/button_corner_radius"
                 android:text="@string/rotate_qml_grid"/>
         </LinearLayout>
     </RelativeLayout>
diff --git a/examples/platforms/android/qtquickview_java/app/src/main/res/layout/activity_main.xml b/examples/platforms/android/qtquickview_java/app/src/main/res/layout/activity_main.xml
index fd3f2e02ce..19f4b0b108 100644
--- a/examples/platforms/android/qtquickview_java/app/src/main/res/layout/activity_main.xml
+++ b/examples/platforms/android/qtquickview_java/app/src/main/res/layout/activity_main.xml
@@ -28,7 +28,7 @@
         android:layout_width="match_parent"
         android:layout_height="0dp"
         android:layout_weight="1"
-        android:gravity="center_vertical"
+        android:gravity="center_horizontal"
         android:background="@color/lilac">
 
         <TextView
@@ -37,6 +37,7 @@
             android:layout_height="wrap_content"
             android:layout_centerHorizontal="true"
             android:text="@string/java"
+            android:layout_marginTop="@dimen/title_margin_top"
             android:textColor="@color/white"
             android:textStyle="bold"
             android:textSize="@dimen/title_text_size"/>
@@ -47,7 +48,7 @@
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_below="@+id/header_title"
-            android:layout_marginTop="25dp"
+            android:layout_marginTop="@dimen/bigger_top_margin"
             android:layout_centerHorizontal="true"
             android:text="@string/qml_view_status"
             android:textColor="@color/white"/>
@@ -59,7 +60,7 @@
             android:orientation="horizontal"
             android:layout_centerHorizontal="true"
             android:layout_below="@id/qmlStatusText"
-            android:layout_marginTop="@dimen/layout_margins">
+            android:layout_marginTop="@dimen/bigger_top_margin">
 
             <TextView
                 android:layout_width="wrap_content"
@@ -75,14 +76,14 @@
                 android:layout_height="@dimen/color_box_height"
                 android:background="@color/cardview_shadow_start_color"
                 android:layout_gravity="center_vertical"
-                android:layout_marginStart="@dimen/layout_margins">
+                android:layout_marginStart="@dimen/color_box_margin_start">
 
                 <TextView
                     android:id="@+id/qmlViewBackgroundText"
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
                     android:textSize="@dimen/other_text_size"
-                    android:text="placeholder"
+                    android:text=""
                     android:layout_centerInParent="true"
                     android:textColor="@color/white"/>
 
@@ -94,7 +95,7 @@
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_below="@+id/qmlColorLayout"
-            android:layout_marginTop="@dimen/layout_margins"
+            android:layout_marginTop="@dimen/bigger_top_margin"
             android:layout_centerHorizontal="true">
 
             <TextView
@@ -108,6 +109,9 @@
                 android:id="@+id/disconnectQmlListenerSwitch"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
+                android:layout_marginStart="@dimen/switch_left_margin"
+                app:track="@drawable/switch_track"
+                android:thumb="@drawable/switch_thumb"
                 android:checked="true"/>
 
         </LinearLayout>
@@ -118,20 +122,25 @@
             android:orientation="horizontal"
             android:gravity="center_horizontal"
             android:layout_below="@+id/switchAndTextLayout"
-            android:layout_marginTop="@dimen/layout_margins">
+            android:layout_marginTop="@dimen/bigger_top_margin">
             <Button
                 android:id="@+id/changeQmlColorButton"
-                android:layout_width="wrap_content"
+                android:layout_width="@dimen/other_buttons_width"
                 android:layout_height="wrap_content"
                 android:layout_gravity="center_vertical"
-                android:text="@string/change_qml_background" />
+                android:text="@string/change_qml_background"
+                android:textSize="@dimen/other_text_size"
+                android:maxLines="2"
+                app:cornerRadius="@dimen/button_corner_radius"/>
             <Button
                 android:id="@+id/rotateQmlGridButton"
-                android:layout_width="wrap_content"
+                android:layout_width="@dimen/other_buttons_width"
                 android:layout_height="wrap_content"
                 android:layout_gravity="center_vertical"
                 android:text="@string/rotate_qml_grid"
-                android:layout_marginStart="@dimen/layout_margins"/>
+                android:textSize="@dimen/other_text_size"
+                app:cornerRadius="@dimen/button_corner_radius"
+                android:layout_marginStart="@dimen/rotate_qml_grid_margin_start"/>
         </LinearLayout>
     </RelativeLayout>
 </LinearLayout>
diff --git a/examples/platforms/android/qtquickview_java/app/src/main/res/values-hdpi/dimens.xml b/examples/platforms/android/qtquickview_java/app/src/main/res/values-hdpi/dimens.xml
index 090daf68c7..8fad92d00a 100644
--- a/examples/platforms/android/qtquickview_java/app/src/main/res/values-hdpi/dimens.xml
+++ b/examples/platforms/android/qtquickview_java/app/src/main/res/values-hdpi/dimens.xml
@@ -5,15 +5,15 @@
     <dimen name="title_margin_top">5dp</dimen>
     <dimen name="smaller_top_margin">10dp</dimen>
     <dimen name="bigger_top_margin">21dp</dimen>
-    <dimen name="change_color_button_width">148dp</dimen>
     <dimen name="other_buttons_width">185dp</dimen>
     <dimen name="color_box_width">132dp</dimen>
     <dimen name="color_box_height">66dp</dimen>
     <dimen name="color_box_margin_start">26dp</dimen>
     <dimen name="button_corner_radius">5dp</dimen>
-    <dimen name="load_second_button_margin_end">20dp</dimen>
+    <dimen name="rotate_qml_grid_margin_start">20dp</dimen>
     <dimen name="rotate_qml_grid_top_margin">6dp</dimen>
     <dimen name="switch_thumb_size">30dp</dimen>
-    <dimen name="switch_thumb_border">2dp</dimen>
+    <dimen name="switch_thumb_border">2sp</dimen>
     <dimen name="switch_text_size">16sp</dimen>
+    <dimen name="switch_left_margin">8dp</dimen>
 </resources>
diff --git a/examples/platforms/android/qtquickview_java/app/src/main/res/values-ldpi/dimens.xml b/examples/platforms/android/qtquickview_java/app/src/main/res/values-ldpi/dimens.xml
index 663feae303..885d4f65de 100644
--- a/examples/platforms/android/qtquickview_java/app/src/main/res/values-ldpi/dimens.xml
+++ b/examples/platforms/android/qtquickview_java/app/src/main/res/values-ldpi/dimens.xml
@@ -5,15 +5,15 @@
     <dimen name="title_margin_top">11dp</dimen>
     <dimen name="smaller_top_margin">24dp</dimen>
     <dimen name="bigger_top_margin">42dp</dimen>
-    <dimen name="change_color_button_width">300dp</dimen>
     <dimen name="other_buttons_width">360dp</dimen>
     <dimen name="color_box_width">275dp</dimen>
     <dimen name="color_box_height">130dp</dimen>
     <dimen name="color_box_margin_start">52dp</dimen>
     <dimen name="button_corner_radius">10dp</dimen>
-    <dimen name="load_second_button_margin_end">40dp</dimen>
+    <dimen name="rotate_qml_grid_margin_start">40dp</dimen>
     <dimen name="rotate_qml_grid_top_margin">16dp</dimen>
     <dimen name="switch_thumb_size">60dp</dimen>
-    <dimen name="switch_thumb_border">2dp</dimen>
+    <dimen name="switch_thumb_border">2sp</dimen>
     <dimen name="switch_text_size">32sp</dimen>
+    <dimen name="switch_left_margin">16dp</dimen>
 </resources>
diff --git a/examples/platforms/android/qtquickview_java/app/src/main/res/values-xhdpi/dimens.xml b/examples/platforms/android/qtquickview_java/app/src/main/res/values-xhdpi/dimens.xml
index d44d15fb83..d4d394adec 100644
--- a/examples/platforms/android/qtquickview_java/app/src/main/res/values-xhdpi/dimens.xml
+++ b/examples/platforms/android/qtquickview_java/app/src/main/res/values-xhdpi/dimens.xml
@@ -1,19 +1,19 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <dimen name="title_text_size">27sp</dimen>
-    <dimen name="other_text_size">15sp</dimen>
+    <dimen name="title_text_size">30sp</dimen>
+    <dimen name="other_text_size">16sp</dimen>
     <dimen name="title_margin_top">4dp</dimen>
     <dimen name="smaller_top_margin">7dp</dimen>
     <dimen name="bigger_top_margin">14dp</dimen>
-    <dimen name="change_color_button_width">110dp</dimen>
-    <dimen name="other_buttons_width">145dp</dimen>
+    <dimen name="other_buttons_width">150dp</dimen>
     <dimen name="color_box_width">95dp</dimen>
     <dimen name="color_box_height">52dp</dimen>
     <dimen name="color_box_margin_start">17dp</dimen>
     <dimen name="button_corner_radius">5dp</dimen>
-    <dimen name="load_second_button_margin_end">18dp</dimen>
+    <dimen name="rotate_qml_grid_margin_start">18dp</dimen>
     <dimen name="rotate_qml_grid_top_margin">5dp</dimen>
     <dimen name="switch_thumb_size">22dp</dimen>
-    <dimen name="switch_thumb_border">1dp</dimen>
+    <dimen name="switch_thumb_border">1sp</dimen>
     <dimen name="switch_text_size">11sp</dimen>
+    <dimen name="switch_left_margin">4dp</dimen>
 </resources>
diff --git a/examples/platforms/android/qtquickview_java/app/src/main/res/values-xxhdpi/dimens.xml b/examples/platforms/android/qtquickview_java/app/src/main/res/values-xxhdpi/dimens.xml
index f682f98396..cd533ad116 100644
--- a/examples/platforms/android/qtquickview_java/app/src/main/res/values-xxhdpi/dimens.xml
+++ b/examples/platforms/android/qtquickview_java/app/src/main/res/values-xxhdpi/dimens.xml
@@ -1,19 +1,19 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <dimen name="title_text_size">21sp</dimen>
-    <dimen name="other_text_size">10sp</dimen>
+    <dimen name="title_text_size">28sp</dimen>
+    <dimen name="other_text_size">14sp</dimen>
     <dimen name="title_margin_top">2dp</dimen>
     <dimen name="smaller_top_margin">2dp</dimen>
     <dimen name="bigger_top_margin">6dp</dimen>
-    <dimen name="change_color_button_width">85dp</dimen>
-    <dimen name="other_buttons_width">115dp</dimen>
-    <dimen name="color_box_width">70dp</dimen>
-    <dimen name="color_box_height">30dp</dimen>
+    <dimen name="other_buttons_width">130dp</dimen>
+    <dimen name="color_box_width">80dp</dimen>
+    <dimen name="color_box_height">40dp</dimen>
     <dimen name="color_box_margin_start">15dp</dimen>
     <dimen name="button_corner_radius">3dp</dimen>
-    <dimen name="load_second_button_margin_end">16dp</dimen>
+    <dimen name="rotate_qml_grid_margin_start">16dp</dimen>
     <dimen name="rotate_qml_grid_top_margin">0dp</dimen>
     <dimen name="switch_thumb_size">17dp</dimen>
-    <dimen name="switch_thumb_border">1dp</dimen>
+    <dimen name="switch_thumb_border">1sp</dimen>
     <dimen name="switch_text_size">9sp</dimen>
+    <dimen name="switch_left_margin">2dp</dimen>
 </resources>
diff --git a/examples/platforms/android/qtquickview_java/app/src/main/res/values/dimens.xml b/examples/platforms/android/qtquickview_java/app/src/main/res/values/dimens.xml
index 8e493891be..7e91b90c9b 100644
--- a/examples/platforms/android/qtquickview_java/app/src/main/res/values/dimens.xml
+++ b/examples/platforms/android/qtquickview_java/app/src/main/res/values/dimens.xml
@@ -2,19 +2,18 @@
 <resources>
     <dimen name="title_text_size">56sp</dimen>
     <dimen name="other_text_size">30sp</dimen>
-    <dimen name="title_margin_top">20dp</dimen>
+    <dimen name="title_margin_top">8dp</dimen>
     <dimen name="smaller_top_margin">16dp</dimen>
     <dimen name="bigger_top_margin">32dp</dimen>
-    <dimen name="change_color_button_width">225dp</dimen>
     <dimen name="other_buttons_width">275dp</dimen>
     <dimen name="color_box_width">200dp</dimen>
     <dimen name="color_box_height">100dp</dimen>
     <dimen name="color_box_margin_start">40dp</dimen>
     <dimen name="button_corner_radius">10dp</dimen>
-    <dimen name="load_second_button_margin_end">30dp</dimen>
+    <dimen name="rotate_qml_grid_margin_start">30dp</dimen>
     <dimen name="rotate_qml_grid_top_margin">8dp</dimen>
     <dimen name="switch_thumb_size">45dp</dimen>
-    <dimen name="switch_thumb_border">2dp</dimen>
+    <dimen name="switch_thumb_border">2sp</dimen>
     <dimen name="switch_text_size">24sp</dimen>
-    <dimen name="layout_margins">5dp</dimen>
+    <dimen name="switch_left_margin">10dp</dimen>
 </resources>
diff --git a/examples/platforms/android/qtquickview_kotlin/app/src/main/res/layout-land/activity_main.xml b/examples/platforms/android/qtquickview_kotlin/app/src/main/res/layout-land/activity_main.xml
index a6c3a173ef..344bc9d9d8 100644
--- a/examples/platforms/android/qtquickview_kotlin/app/src/main/res/layout-land/activity_main.xml
+++ b/examples/platforms/android/qtquickview_kotlin/app/src/main/res/layout-land/activity_main.xml
@@ -1,6 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:tools="http://schemas.android.com/tools"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
     android:id="@+id/mainLinear"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
@@ -27,7 +28,7 @@
         android:layout_width="0dp"
         android:layout_height="match_parent"
         android:layout_weight="1"
-        android:gravity="center_vertical"
+        android:gravity="center_horizontal"
         android:background="@color/lilac">
 
         <TextView
@@ -36,6 +37,7 @@
             android:layout_height="wrap_content"
             android:layout_centerHorizontal="true"
             android:text="@string/kotlin"
+            android:layout_marginTop="@dimen/title_margin_top"
             android:textColor="@color/white"
             android:textStyle="bold"
             android:textSize="@dimen/title_text_size"/>
@@ -46,7 +48,7 @@
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_below="@+id/header_title"
-            android:layout_marginTop="@dimen/layout_margins"
+            android:layout_marginTop="@dimen/smaller_top_margin"
             android:layout_centerHorizontal="true"
             android:text="@string/qml_view_status"
             android:textColor="@color/white"/>
@@ -59,7 +61,7 @@
             android:orientation="horizontal"
             android:layout_centerHorizontal="true"
             android:layout_below="@id/qmlStatusText"
-            android:layout_marginTop="@dimen/layout_margins">
+            android:layout_marginTop="@dimen/bigger_top_margin">
 
             <TextView
                 android:layout_width="wrap_content"
@@ -75,14 +77,14 @@
                 android:layout_height="@dimen/color_box_height"
                 android:background="@color/cardview_shadow_start_color"
                 android:layout_gravity="center_vertical"
-                android:layout_marginStart="@dimen/layout_margins">
+                android:layout_marginStart="@dimen/color_box_margin_start">
 
                 <TextView
                     android:id="@+id/qmlViewBackgroundText"
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
                     android:textSize="@dimen/other_text_size"
-                    android:text="placeholder"
+                    android:text=""
                     android:layout_centerInParent="true"
                     android:textColor="@color/white"/>
 
@@ -94,7 +96,7 @@
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_below="@+id/qmlColorLayout"
-            android:layout_marginTop="@dimen/layout_margins"
+            android:layout_marginTop="@dimen/bigger_top_margin"
             android:layout_centerHorizontal="true">
 
             <TextView
@@ -108,7 +110,10 @@
                 android:id="@+id/disconnectQmlListenerSwitch"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                android:checked="true"/>
+                android:layout_marginStart="@dimen/switch_left_margin"
+                android:checked="true"
+                app:track="@drawable/switch_track"
+                android:thumb="@drawable/switch_thumb"/>
 
         </LinearLayout>
 
@@ -118,19 +123,24 @@
             android:orientation="vertical"
             android:gravity="center_horizontal"
             android:layout_below="@+id/switchAndTextLayout"
-            android:layout_marginTop="@dimen/layout_margins">
+            android:layout_marginTop="@dimen/bigger_top_margin">
             <Button
                 android:id="@+id/changeQmlColorButton"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_gravity="center_horizontal"
+                android:textSize="@dimen/other_text_size"
+                app:cornerRadius="@dimen/button_corner_radius"
                 android:text="@string/change_qml_background" />
             <Button
                 android:id="@+id/rotateQmlGridButton"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_gravity="center_horizontal"
-                android:text="@string/rotate_qml_grid"/>
+                android:text="@string/rotate_qml_grid"
+                app:cornerRadius="@dimen/button_corner_radius"
+                android:textSize="@dimen/other_text_size"
+                android:layout_marginTop="@dimen/rotate_qml_grid_top_margin"/>
         </LinearLayout>
     </RelativeLayout>
 </LinearLayout>
diff --git a/examples/platforms/android/qtquickview_kotlin/app/src/main/res/layout/activity_main.xml b/examples/platforms/android/qtquickview_kotlin/app/src/main/res/layout/activity_main.xml
index 71ca760827..f7e8bb3fa3 100644
--- a/examples/platforms/android/qtquickview_kotlin/app/src/main/res/layout/activity_main.xml
+++ b/examples/platforms/android/qtquickview_kotlin/app/src/main/res/layout/activity_main.xml
@@ -28,7 +28,7 @@
         android:layout_width="match_parent"
         android:layout_height="0dp"
         android:layout_weight="1"
-        android:gravity="center_vertical"
+        android:gravity="center_horizontal"
         android:background="@color/lilac">
 
         <TextView
@@ -39,6 +39,7 @@
             android:text="@string/kotlin"
             android:textColor="@color/white"
             android:textStyle="bold"
+            android:layout_marginTop="@dimen/title_margin_top"
             android:textSize="@dimen/title_text_size"/>
 
         <TextView
@@ -47,7 +48,7 @@
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_below="@+id/header_title"
-            android:layout_marginTop="@dimen/layout_margins"
+            android:layout_marginTop="@dimen/smaller_top_margin"
             android:layout_centerHorizontal="true"
             android:text="@string/qml_view_status"
             android:textColor="@color/white"/>
@@ -60,7 +61,7 @@
             android:orientation="horizontal"
             android:layout_centerHorizontal="true"
             android:layout_below="@id/qmlStatusText"
-            android:layout_marginTop="@dimen/layout_margins">
+            android:layout_marginTop="@dimen/bigger_top_margin">
 
             <TextView
                 android:layout_width="wrap_content"
@@ -76,14 +77,14 @@
                 android:layout_height="@dimen/color_box_height"
                 android:background="@color/cardview_shadow_start_color"
                 android:layout_gravity="center_vertical"
-                android:layout_marginStart="@dimen/layout_margins">
+                android:layout_marginStart="@dimen/color_box_margin_start">
 
                 <TextView
                     android:id="@+id/qmlViewBackgroundText"
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
                     android:textSize="@dimen/other_text_size"
-                    android:text="placeholder"
+                    android:text=""
                     android:layout_centerInParent="true"
                     android:textColor="@color/white"/>
 
@@ -95,7 +96,7 @@
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_below="@+id/qmlColorLayout"
-            android:layout_marginTop="@dimen/layout_margins"
+            android:layout_marginTop="@dimen/bigger_top_margin"
             android:layout_centerHorizontal="true">
 
             <TextView
@@ -109,7 +110,10 @@
                 android:id="@+id/disconnectQmlListenerSwitch"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                android:checked="true"/>
+                android:layout_marginStart="@dimen/switch_left_margin"
+                android:checked="true"
+                app:track="@drawable/switch_track"
+                android:thumb="@drawable/switch_thumb"/>
 
         </LinearLayout>
 
@@ -119,20 +123,25 @@
             android:orientation="horizontal"
             android:gravity="center_horizontal"
             android:layout_below="@+id/switchAndTextLayout"
-            android:layout_marginTop="@dimen/layout_margins">
+            android:layout_marginTop="@dimen/bigger_top_margin">
             <Button
                 android:id="@+id/changeQmlColorButton"
-                android:layout_width="wrap_content"
+                android:layout_width="@dimen/other_buttons_width"
                 android:layout_height="wrap_content"
                 android:layout_gravity="center_vertical"
+                android:textSize="@dimen/other_text_size"
+                app:cornerRadius="@dimen/button_corner_radius"
+                android:maxLines="2"
                 android:text="@string/change_qml_background" />
             <Button
                 android:id="@+id/rotateQmlGridButton"
-                android:layout_width="wrap_content"
+                android:layout_width="@dimen/other_buttons_width"
                 android:layout_height="wrap_content"
                 android:layout_gravity="center_vertical"
                 android:text="@string/rotate_qml_grid"
-                android:layout_marginStart="@dimen/layout_margins"/>
+                app:cornerRadius="@dimen/button_corner_radius"
+                android:textSize="@dimen/other_text_size"
+                android:layout_marginStart="@dimen/rotate_qml_grid_margin_start"/>
         </LinearLayout>
     </RelativeLayout>
 </LinearLayout>
diff --git a/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values-hdpi/dimens.xml b/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values-hdpi/dimens.xml
index 84c7dfdb7b..8fad92d00a 100644
--- a/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values-hdpi/dimens.xml
+++ b/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values-hdpi/dimens.xml
@@ -5,15 +5,15 @@
     <dimen name="title_margin_top">5dp</dimen>
     <dimen name="smaller_top_margin">10dp</dimen>
     <dimen name="bigger_top_margin">21dp</dimen>
-    <dimen name="change_color_button_width">148dp</dimen>
     <dimen name="other_buttons_width">185dp</dimen>
     <dimen name="color_box_width">132dp</dimen>
     <dimen name="color_box_height">66dp</dimen>
     <dimen name="color_box_margin_start">26dp</dimen>
     <dimen name="button_corner_radius">5dp</dimen>
-    <dimen name="load_second_button_margin_end">20dp</dimen>
+    <dimen name="rotate_qml_grid_margin_start">20dp</dimen>
     <dimen name="rotate_qml_grid_top_margin">6dp</dimen>
     <dimen name="switch_thumb_size">30dp</dimen>
     <dimen name="switch_thumb_border">2sp</dimen>
     <dimen name="switch_text_size">16sp</dimen>
+    <dimen name="switch_left_margin">8dp</dimen>
 </resources>
diff --git a/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values-ldpi/dimens.xml b/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values-ldpi/dimens.xml
index 781c599492..885d4f65de 100644
--- a/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values-ldpi/dimens.xml
+++ b/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values-ldpi/dimens.xml
@@ -5,15 +5,15 @@
     <dimen name="title_margin_top">11dp</dimen>
     <dimen name="smaller_top_margin">24dp</dimen>
     <dimen name="bigger_top_margin">42dp</dimen>
-    <dimen name="change_color_button_width">300dp</dimen>
     <dimen name="other_buttons_width">360dp</dimen>
     <dimen name="color_box_width">275dp</dimen>
     <dimen name="color_box_height">130dp</dimen>
     <dimen name="color_box_margin_start">52dp</dimen>
     <dimen name="button_corner_radius">10dp</dimen>
-    <dimen name="load_second_button_margin_end">40dp</dimen>
+    <dimen name="rotate_qml_grid_margin_start">40dp</dimen>
     <dimen name="rotate_qml_grid_top_margin">16dp</dimen>
     <dimen name="switch_thumb_size">60dp</dimen>
     <dimen name="switch_thumb_border">2sp</dimen>
     <dimen name="switch_text_size">32sp</dimen>
+    <dimen name="switch_left_margin">16dp</dimen>
 </resources>
diff --git a/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values-xhdpi/dimens.xml b/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values-xhdpi/dimens.xml
index 8a50d3c967..d4d394adec 100644
--- a/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values-xhdpi/dimens.xml
+++ b/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values-xhdpi/dimens.xml
@@ -1,19 +1,19 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <dimen name="title_text_size">27sp</dimen>
-    <dimen name="other_text_size">15sp</dimen>
+    <dimen name="title_text_size">30sp</dimen>
+    <dimen name="other_text_size">16sp</dimen>
     <dimen name="title_margin_top">4dp</dimen>
     <dimen name="smaller_top_margin">7dp</dimen>
     <dimen name="bigger_top_margin">14dp</dimen>
-    <dimen name="change_color_button_width">110dp</dimen>
-    <dimen name="other_buttons_width">145dp</dimen>
+    <dimen name="other_buttons_width">150dp</dimen>
     <dimen name="color_box_width">95dp</dimen>
     <dimen name="color_box_height">52dp</dimen>
     <dimen name="color_box_margin_start">17dp</dimen>
     <dimen name="button_corner_radius">5dp</dimen>
-    <dimen name="load_second_button_margin_end">18dp</dimen>
+    <dimen name="rotate_qml_grid_margin_start">18dp</dimen>
     <dimen name="rotate_qml_grid_top_margin">5dp</dimen>
     <dimen name="switch_thumb_size">22dp</dimen>
     <dimen name="switch_thumb_border">1sp</dimen>
     <dimen name="switch_text_size">11sp</dimen>
+    <dimen name="switch_left_margin">4dp</dimen>
 </resources>
diff --git a/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values-xxhdpi/dimens.xml b/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values-xxhdpi/dimens.xml
index 28e87b6442..e1f288eed7 100644
--- a/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values-xxhdpi/dimens.xml
+++ b/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values-xxhdpi/dimens.xml
@@ -1,19 +1,19 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
     <dimen name="title_text_size">28sp</dimen>
-    <dimen name="other_text_size">10sp</dimen>
+    <dimen name="other_text_size">14sp</dimen>
     <dimen name="title_margin_top">2dp</dimen>
     <dimen name="smaller_top_margin">2dp</dimen>
     <dimen name="bigger_top_margin">6dp</dimen>
-    <dimen name="change_color_button_width">85dp</dimen>
-    <dimen name="other_buttons_width">115dp</dimen>
+    <dimen name="other_buttons_width">130dp</dimen>
     <dimen name="color_box_width">70dp</dimen>
     <dimen name="color_box_height">30dp</dimen>
     <dimen name="color_box_margin_start">15dp</dimen>
     <dimen name="button_corner_radius">3dp</dimen>
-    <dimen name="load_second_button_margin_end">16dp</dimen>
+    <dimen name="rotate_qml_grid_margin_start">16dp</dimen>
     <dimen name="rotate_qml_grid_top_margin">0dp</dimen>
     <dimen name="switch_thumb_size">17dp</dimen>
     <dimen name="switch_thumb_border">1sp</dimen>
     <dimen name="switch_text_size">9sp</dimen>
+    <dimen name="switch_left_margin">2dp</dimen>
 </resources>
diff --git a/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values/dimens.xml b/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values/dimens.xml
index add5608ae1..7e91b90c9b 100644
--- a/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values/dimens.xml
+++ b/examples/platforms/android/qtquickview_kotlin/app/src/main/res/values/dimens.xml
@@ -5,16 +5,15 @@
     <dimen name="title_margin_top">8dp</dimen>
     <dimen name="smaller_top_margin">16dp</dimen>
     <dimen name="bigger_top_margin">32dp</dimen>
-    <dimen name="change_color_button_width">225dp</dimen>
     <dimen name="other_buttons_width">275dp</dimen>
     <dimen name="color_box_width">200dp</dimen>
     <dimen name="color_box_height">100dp</dimen>
     <dimen name="color_box_margin_start">40dp</dimen>
     <dimen name="button_corner_radius">10dp</dimen>
-    <dimen name="load_second_button_margin_end">30dp</dimen>
+    <dimen name="rotate_qml_grid_margin_start">30dp</dimen>
     <dimen name="rotate_qml_grid_top_margin">8dp</dimen>
     <dimen name="switch_thumb_size">45dp</dimen>
     <dimen name="switch_thumb_border">2sp</dimen>
     <dimen name="switch_text_size">24sp</dimen>
-    <dimen name="layout_margins">5dp</dimen>
+    <dimen name="switch_left_margin">10dp</dimen>
 </resources>