Warning, /education/gcompris/src/activities/lang/MenuScreen.qml is written in an unsupported language. File is not indexed.

0001 /* GCompris - MenuScreen.qml
0002 *
0003 * Copyright (C) Siddhesh suthar <siddhesh.it@gmail.com> (Qt Quick port)
0004 *
0005 * Authors:
0006 *   Pascal Georges (pascal.georges1@free.fr) (GTK+ version)
0007 *   Holger Kaelberer <holger.k@elberer.de> (Qt Quick port of imageid)
0008 *   Siddhesh suthar <siddhesh.it@gmail.com> (Qt Quick port)
0009 *   Bruno Coudoin <bruno.coudoin@gcompris.net> (Integration Lang dataset)
0010 *
0011 *   SPDX-License-Identifier: GPL-3.0-or-later
0012 */
0013 import QtQuick 2.12
0014 import GCompris 1.0
0015 import QtGraphicalEffects 1.0
0016 import QtQuick.Controls 2.12
0017 
0018 import "../../core"
0019 import "lang.js" as Activity
0020 
0021 Item {
0022     id: menuScreen
0023     anchors.fill: parent
0024     opacity: 0
0025 
0026     property alias menuModel: menuModel
0027     property bool keyboardMode: false
0028     property bool started: opacity == 1
0029     property int spacing: Math.floor(5 * ApplicationInfo.ratio)
0030 
0031     Behavior on opacity { PropertyAnimation { duration: 200 } }
0032 
0033     function start() {
0034         focus = true
0035         forceActiveFocus()
0036         menuGrid.currentIndex = 0
0037         opacity = 1
0038     }
0039 
0040     function stop() {
0041         focus = false
0042         opacity = 0
0043     }
0044 
0045     Keys.onEscapePressed: {
0046         home()
0047     }
0048 
0049     Keys.onPressed: {
0050         if(event.key === Qt.Key_Space) {
0051             menuGrid.currentItem.selectCurrentItem()
0052             event.accepted = true
0053         }
0054         if(event.key === Qt.Key_Enter) {
0055             menuGrid.currentItem.selectCurrentItem()
0056             event.accepted = true
0057         }
0058         if(event.key === Qt.Key_Return) {
0059             menuGrid.currentItem.selectCurrentItem()
0060             event.accepted = true
0061         }
0062         if(event.key === Qt.Key_Left) {
0063             menuGrid.moveCurrentIndexLeft()
0064             event.accepted = true
0065         }
0066         if(event.key === Qt.Key_Right) {
0067             menuGrid.moveCurrentIndexRight()
0068             event.accepted = true
0069         }
0070         if(event.key === Qt.Key_Up) {
0071             menuGrid.moveCurrentIndexUp()
0072             event.accepted = true
0073         }
0074         if(event.key === Qt.Key_Down) {
0075             menuGrid.moveCurrentIndexDown()
0076             event.accepted = true
0077         }
0078     }
0079 
0080     Keys.onReleased: {
0081         keyboardMode = true
0082         event.accepted = false
0083     }
0084 
0085     // Activities
0086     property int iconSize: 180 * ApplicationInfo.ratio
0087 
0088     property int levelCellWidth: menuGrid.width / Math.floor(menuGrid.width / iconSize )
0089     property int levelCellHeight: iconSize * 1.4
0090 
0091     ListModel {
0092         id: menuModel
0093     }
0094 
0095     GridView {
0096         id: menuGrid
0097 
0098         anchors {
0099             fill: parent
0100             topMargin: menuScreen.spacing
0101             leftMargin: menuScreen.spacing
0102             bottomMargin: bar.height + menuScreen.spacing
0103         }
0104         cellWidth: levelCellWidth
0105         cellHeight: levelCellHeight
0106         clip: true
0107         model: menuModel
0108         keyNavigationWraps: true
0109         // Needed to calculate the OpacityMask offset
0110         // If not using OpenGL, this value is not used, so we save the calculation and set it to 1
0111         property real hiddenBottom: ApplicationInfo.useOpenGL ? contentHeight - height - contentY : 1
0112 
0113         delegate: Rectangle {
0114             id: delegateItem
0115             width: levelCellWidth - menuScreen.spacing
0116             height: levelCellHeight - menuScreen.spacing
0117             property string sectionName: name
0118             color: "#7FFFFFFF"
0119 
0120             Image {
0121                 id: containerImage
0122                 source: image;
0123                 anchors.top: parent.top
0124                 anchors.left: parent.left
0125                 anchors.right: parent.right
0126                 anchors.bottom: title.top
0127                 anchors.bottomMargin: title.lineCount  > 1 ? title.height * -0.5 : menuScreen.spacing
0128                 fillMode: Image.PreserveAspectFit
0129             }
0130 
0131             Rectangle {
0132                 anchors.fill: title
0133                 color: menuScreen.keyboardMode && menuGrid.currentIndex == index ?
0134                     "#80EAF8FD" : "#80C2ECF8"
0135             }
0136 
0137             GCText {
0138                 id: title
0139                 anchors.bottom: progressLang.top
0140                 anchors.bottomMargin: menuScreen.spacing
0141                 anchors.horizontalCenter: parent.horizontalCenter
0142                 horizontalAlignment: Text.AlignHCenter
0143                 width: parent.width - 4 * ApplicationInfo.ratio
0144                 fontSizeMode: Text.Fit
0145                 minimumPointSize: 7
0146                 fontSize: regularSize
0147                 elide: Text.ElideRight
0148                 maximumLineCount: 2
0149                 wrapMode: Text.WordWrap
0150                 text: Activity.items.categoriesTranslations[name]
0151             }
0152 
0153             GCProgressBar {
0154                 id: progressLang
0155                 borderSize: ApplicationInfo.ratio
0156                 anchors.bottom: parent.bottom
0157                 anchors.left: parent.left
0158                 anchors.right: parent.right
0159                 anchors.bottomMargin: menuScreen.spacing
0160                 anchors.leftMargin: ApplicationInfo.ratio * 10
0161                 anchors.rightMargin: anchors.leftMargin
0162                 height: 14 * ApplicationInfo.ratio
0163                 to: wordCount
0164                 from: 0
0165                 value: progress
0166                 displayText: false
0167             }
0168 
0169             MouseArea {
0170                 anchors.fill: parent
0171                 enabled: menuScreen.started
0172                 onClicked: selectCurrentItem()
0173             }
0174 
0175             function selectCurrentItem() {
0176                 Activity.initLevel(index)
0177             }
0178 
0179             Rectangle {
0180                 color: "#C0FFFFFF"
0181                 anchors.centerIn: favoriteButton
0182                 width: favoriteButton.width +  2 * ApplicationInfo.ratio
0183                 height: width
0184                 radius: width * 0.5
0185             }
0186             Image {
0187                 id: favoriteButton
0188                 source: "qrc:/gcompris/src/activities/menu/resource/" +
0189                         ( favorite ? "all.svg" : "all_disabled.svg" );
0190                 anchors {
0191                     top: parent.top
0192                     right: parent.right
0193                     margins: menuScreen.spacing
0194                 }
0195                 sourceSize.width: iconSize * 0.2
0196 
0197                 MouseArea {
0198                     anchors.fill: parent
0199                     onClicked: {
0200                         menuModel.get(index)['favorite'] = !menuModel.get(index)['favorite']
0201                     }
0202                 }
0203             }
0204 
0205         } //delegate close
0206 
0207         highlight: Rectangle {
0208             width: levelCellWidth - menuScreen.spacing
0209             height: levelCellHeight - menuScreen.spacing
0210             color:  "#AAFFFFFF"
0211             border.width: 2 * ApplicationInfo.ratio
0212             border.color: "#373737"
0213             visible: menuScreen.keyboardMode
0214             Behavior on x { SpringAnimation { spring: 2; damping: 0.2 } }
0215             Behavior on y { SpringAnimation { spring: 2; damping: 0.2 } }
0216         }
0217 
0218         Rectangle{
0219             id: menuMask
0220             visible: false
0221             anchors.fill: menuGrid
0222             // Dynamic position of the gradient used for OpacityMask
0223             // If the hidden bottom part of the grid is > to the maximum height of the gradient,
0224             // we use the maximum height.
0225             // Else we set the gradient start position proportionnally to the hidden bottom part,
0226             // until it disappears.
0227             // And if not using OpenGL, the mask is disabled, so we save the calculation and set it to 1
0228             property real gradientStartValue:
0229                 ApplicationInfo.useOpenGL ?
0230                 (menuGrid.hiddenBottom > menuGrid.height * 0.08 ?
0231                     0.92 : 1 - (menuGrid.hiddenBottom / menuGrid.height)) :
0232                     1
0233             gradient: Gradient {
0234                 GradientStop { position: 0.0; color: "#FFFFFFFF" }
0235                 GradientStop { position: menuMask.gradientStartValue; color: "#FFFFFFFF" }
0236                 GradientStop { position: menuMask.gradientStartValue + 0.04; color:"#00FFFFFF"}
0237             }
0238         }
0239 
0240         layer.enabled: ApplicationInfo.useOpenGL
0241         layer.effect: OpacityMask {
0242             id: activitiesOpacity
0243             source: menuGrid
0244             maskSource: menuMask
0245             anchors.fill: menuGrid
0246         }
0247 
0248     } // grid view close
0249 
0250 }