[prev in list] [next in list] [prev in thread] [next in thread] 

List:       kde-commits
Subject:    [gcompris/KDE/0.80] src/activities/categorization: categorization fix menu layout
From:       Timothée_Giet <null () kde ! org>
Date:       2017-08-31 13:52:40
Message-ID: E1dnPtg-0002WG-AX () code ! kde ! org
[Download RAW message or body]

Git commit 9c5189af64744e4f0f86702f9408831fade78d25 by Timothée Giet.
Committed on 31/08/2017 at 13:52.
Pushed by timotheegiet into branch 'KDE/0.80'.

categorization fix menu layout

make sure image and text are properly placed for all screen size

M  +23   -19   src/activities/categorization/MenuScreen.qml

https://commits.kde.org/gcompris/9c5189af64744e4f0f86702f9408831fade78d25

diff --git a/src/activities/categorization/MenuScreen.qml b/src/activities/categorization/MenuScreen.qml
index 1ecc9fae..b1eee412 100644
--- a/src/activities/categorization/MenuScreen.qml
+++ b/src/activities/categorization/MenuScreen.qml
@@ -104,7 +104,7 @@ Image {
     property int iconHeight: 180 * ApplicationInfo.ratio
 
     property int levelCellWidth: background.width / Math.floor(background.width / iconWidth )
-    property int levelCellHeight: iconHeight * 1.4
+    property int levelCellHeight: iconHeight * 1.2
 
     ListModel {
         id: menuModel
@@ -148,29 +148,33 @@ Image {
                 color: "white"
                 opacity: 0.5
             }
+
             Image {
                 id: containerImage
                 source: image
                 anchors.top: activityBackground.top
                 anchors.horizontalCenter: parent.horizontalCenter
-                width: activityBackground.width*0.90 - 6
-                height: width 
-                sourceSize.width: width
-                anchors.margins: 3
-
-                GCText {
-                    id: categoryName
-                    anchors.top: parent.bottom
-                    anchors.horizontalCenter: parent.horizontalCenter
-                    horizontalAlignment: Text.AlignHCenter
-                    width: activityBackground.width
-                    fontSizeMode: Text.Fit
-                    elide: Text.ElideRight
-                    maximumLineCount: 2
-                    wrapMode: Text.WordWrap
-                    text: name
-                    opacity: (items.mode == "expert") ? 0 : 1
-                }
+                height: activityBackground.height*0.8 - 6
+                width: height
+                anchors.margins: 5
+                sourceSize.height: height
+                fillMode: Image.PreserveAspectCrop
+                clip: true
+            }
+
+            GCText {
+                id: categoryName
+                anchors.top: containerImage.bottom
+                horizontalAlignment: Text.AlignHCenter
+                verticalAlignment: Text.AlignVCenter
+                width: activityBackground.width
+                height: activityBackground.height*0.2 - 6
+                fontSizeMode: Text.Fit
+                elide: Text.ElideRight
+                maximumLineCount: 2
+                wrapMode: Text.WordWrap
+                text: name
+                opacity: (items.mode == "expert") ? 0 : 1
             }
 
             ParticleSystemStarLoader {
[prev in list] [next in list] [prev in thread] [next in thread]