Warning, /education/gcompris/src/activities/learn_digits/Learn_digits.qml is written in an unsupported language. File is not indexed.
0001 /* GCompris - learn_digits.qml 0002 * 0003 * SPDX-FileCopyrightText: 2020 Timothée Giet <animtim@gmail.com> 0004 * 0005 * Authors: 0006 * Timothée Giet <animtim@gmail.com> 0007 * 0008 * SPDX-License-Identifier: GPL-3.0-or-later 0009 */ 0010 import QtQuick 2.12 0011 import GCompris 1.0 0012 0013 import "../../core" 0014 import "learn_digits.js" as Activity 0015 0016 ActivityBase { 0017 id: activity 0018 property bool operationMode: false 0019 0020 onStart: focus = true 0021 onStop: {} 0022 0023 Keys.onPressed: { 0024 Activity.processKey(event); 0025 } 0026 0027 pageComponent: Image { 0028 id: background 0029 source: "qrc:/gcompris/src/activities/braille_fun/resource/hillside.svg" 0030 sourceSize.width: width 0031 sourceSize.height: height 0032 fillMode: Image.PreserveAspectCrop 0033 signal start 0034 signal stop 0035 signal scoreStop 0036 0037 Component.onCompleted: { 0038 dialogActivityConfig.initialize() 0039 activity.start.connect(start) 0040 activity.stop.connect(stop) 0041 } 0042 0043 // Add here the QML items you need to access in javascript 0044 QtObject { 0045 id: items 0046 property Item activityPage: activity 0047 property GCAudio audioVoices: activity.audioVoices 0048 property GCSfx audioEffects: activity.audioEffects 0049 property alias background: background 0050 property int currentLevel: activity.currentLevel 0051 property alias bonus: bonus 0052 property alias score: score 0053 property alias circlesLine: circlesLine 0054 property alias fileId: fileId 0055 property alias locale: background.locale 0056 property alias iAmReady: iAmReady 0057 property alias errorRectangle: errorRectangle 0058 property int nbSubLevel 0059 property int answer: 0 0060 property int question: 0 0061 property string questionText: "" 0062 property int circlesModel: 3 0063 property int selectedCircle: -1 0064 property bool inputLocked: false 0065 readonly property var levels: activity.datasetLoader.data 0066 property int mode: 1 // default is arabic numerals 0067 property bool voicesEnabled: true 0068 property string imageSource: "qrc:/gcompris/src/core/resource/empty.svg" 0069 } 0070 property string locale: ApplicationSettings.locale 0071 property bool isHorizontal: layoutArea.width >= layoutArea.height 0072 0073 onStart: { 0074 Activity.start(items, operationMode); 0075 if(activity.operationMode) 0076 itemsVisible(); 0077 else 0078 itemsHidden(); 0079 } 0080 onStop: { Activity.stop() } 0081 0082 function itemsVisible() { 0083 iAmReady.visible = false; 0084 if(DownloadManager.areVoicesRegistered(ApplicationSettings.locale) && !operationMode && items.voicesEnabled) { 0085 repeatItem.visible = true; 0086 } 0087 if(items.mode === 1) { 0088 questionText.visible = true; 0089 } else { 0090 questionImage.visible = true; 0091 } 0092 scoreArea.visible = true; 0093 circlesBackground.visible = true; 0094 circlesArea.visible = true; 0095 Activity.initLevel(); 0096 } 0097 0098 function itemsHidden() { 0099 iAmReady.visible = true; 0100 repeatItem.visible = false; 0101 questionText.visible = false; 0102 questionImage.visible = false; 0103 scoreArea.visible = false; 0104 circlesBackground.visible = false; 0105 circlesArea.visible = false; 0106 } 0107 0108 ReadyButton { 0109 id: iAmReady 0110 onClicked: background.itemsVisible(); 0111 } 0112 0113 Item { 0114 id: layoutArea 0115 anchors.top: parent.top 0116 anchors.bottom: bar.top 0117 anchors.bottomMargin: bar.height * 0.2 0118 anchors.left: parent.left 0119 anchors.right: parent.right 0120 } 0121 0122 Item { 0123 id: questionArea 0124 anchors.top: layoutArea.top 0125 anchors.left: layoutArea.left 0126 } 0127 0128 Item { 0129 id: repeatArea 0130 width: textArea.width 0131 height: textArea.height 0132 } 0133 0134 BarButton { 0135 id: repeatItem 0136 visible: false 0137 source: "qrc:/gcompris/src/core/resource/bar_repeat.svg" 0138 sourceSize.width: repeatArea.height > repeatArea.width ? 0139 repeatArea.width * 0.6 : repeatArea.height * 0.6 0140 anchors.centerIn: repeatArea 0141 onClicked: { 0142 if(!items.inputLocked && !audioVoices.isPlaying()) { 0143 Activity.playLetter(items.question.toString()); 0144 } 0145 } 0146 } 0147 0148 Item { 0149 id: textArea 0150 anchors.centerIn: questionArea 0151 } 0152 GCText { 0153 id: questionText 0154 visible: false 0155 width: textArea.width 0156 height: textArea.height 0157 anchors.centerIn: textArea 0158 horizontalAlignment : Text.AlignHCenter 0159 verticalAlignment : Text.AlignVCenter 0160 text: items.questionText 0161 minimumPointSize: 12 0162 fontSize: 1024 0163 fontSizeMode: Text.Fit 0164 font.bold: true 0165 color: "#d2611d" 0166 style: Text.Outline 0167 styleColor: "white" 0168 } 0169 Image { 0170 id: questionImage 0171 visible: false 0172 anchors.centerIn: textArea 0173 height: Math.min(textArea.height, textArea.width) 0174 width: height 0175 sourceSize.width: height 0176 sourceSize.height: height 0177 fillMode: Image.PreserveAspectFit 0178 source: items.imageSource 0179 } 0180 Item { 0181 id: scoreArea 0182 width: textArea.width 0183 height: textArea.height 0184 visible: false 0185 property int scoreItemsSize: 10 0186 Score { 0187 id: score 0188 width: scoreArea.scoreItemsSize 0189 numberOfSubLevels: items.nbSubLevel 0190 currentSubLevel: 0 0191 onStop: Activity.nextSubLevel(); 0192 } 0193 BarButton { 0194 id: okButton 0195 source: "qrc:/gcompris/src/core/resource/bar_ok.svg" 0196 height: scoreArea.scoreItemsSize 0197 width: scoreArea.scoreItemsSize 0198 sourceSize.height: height 0199 sourceSize.width: height 0200 enabled: !items.inputLocked 0201 onClicked: { 0202 if(!items.inputLocked) 0203 Activity.checkAnswer(); 0204 } 0205 } 0206 states: [ 0207 State { 0208 id: scoreHorizontal 0209 when: scoreArea.width >= scoreArea.height 0210 PropertyChanges { 0211 target: scoreArea 0212 scoreItemsSize: scoreArea.width * 0.4 0213 } 0214 AnchorChanges { 0215 target: score 0216 anchors.verticalCenter: parent.verticalCenter 0217 anchors.horizontalCenter: undefined 0218 anchors.right: parent.right 0219 anchors.bottom: undefined 0220 } 0221 AnchorChanges { 0222 target: okButton 0223 anchors.verticalCenter: parent.verticalCenter 0224 anchors.horizontalCenter: undefined 0225 anchors.left: parent.left 0226 anchors.top: undefined 0227 } 0228 }, 0229 State { 0230 id: scoreVertical 0231 when: scoreArea.width < scoreArea.height 0232 PropertyChanges { 0233 target: scoreArea 0234 scoreItemsSize: scoreArea.height * 0.5 0235 } 0236 AnchorChanges { 0237 target: score 0238 anchors.verticalCenter: undefined 0239 anchors.horizontalCenter: parent.horizontalCenter 0240 anchors.right: undefined 0241 anchors.bottom: parent.bottom 0242 } 0243 AnchorChanges { 0244 target: okButton 0245 anchors.verticalCenter: undefined 0246 anchors.horizontalCenter: parent.horizontalCenter 0247 anchors.left: undefined 0248 anchors.top: parent.top 0249 } 0250 } 0251 ] 0252 } 0253 0254 Rectangle { 0255 id: circlesBackground 0256 visible: false 0257 color: "#D0FFFFFF" 0258 anchors.bottom: layoutArea.bottom 0259 anchors.right: layoutArea.right 0260 anchors.margins: 10 * ApplicationInfo.ratio 0261 radius: anchors.margins 0262 } 0263 Item { 0264 id: circlesArea 0265 visible: false 0266 property int itemWidth: 10 //temp values overriden with states 0267 width: 10 0268 height: 10 0269 anchors.centerIn: circlesBackground 0270 Rectangle { 0271 id: circlesSelector 0272 width: circlesArea.itemWidth 0273 height: circlesArea.itemWidth 0274 radius: 10 * ApplicationInfo.ratio 0275 color: "#803ACAFF" 0276 visible: items.selectedCircle > -1 0277 anchors.centerIn: circlesLine.itemAt(items.selectedCircle) 0278 } 0279 Repeater { 0280 id: circlesLine 0281 model: items.circlesModel 0282 delegate: circlesComponent 0283 } 0284 Component { 0285 id: circlesComponent 0286 Item { 0287 function resetCircle() { 0288 isFilled = false; 0289 circleColor = "#00ffffff"; 0290 } 0291 function clickCircle() { 0292 if(!isFilled) { 0293 ++items.answer; 0294 circleColor = "#ffd2611d"; 0295 } else { 0296 --items.answer; 0297 circleColor = "#00ffffff"; 0298 } 0299 isFilled = !isFilled 0300 } 0301 width: circlesArea.itemWidth 0302 height: width 0303 x: isHorizontal ? width * index : 0 0304 y: isHorizontal ? 0 : width * index 0305 property bool isFilled: false 0306 property string circleColor: "#00ffffff" 0307 Rectangle { 0308 id: circle 0309 anchors.centerIn: parent 0310 border.color: "#373737" 0311 border.width: 5 * ApplicationInfo.ratio 0312 color: circleColor 0313 width: parent.width * 0.9 0314 height: width 0315 radius: width * 0.5 0316 } 0317 MouseArea { 0318 id: circleInput 0319 anchors.fill: parent 0320 enabled: !items.inputLocked 0321 onClicked: parent.clickCircle(); 0322 } 0323 } 0324 } 0325 } 0326 0327 states: [ 0328 State { 0329 id: horizontalLayout 0330 when: isHorizontal 0331 AnchorChanges { 0332 target: questionArea 0333 anchors.bottom: layoutArea.verticalCenter 0334 anchors.right: layoutArea.right 0335 } 0336 AnchorChanges { 0337 target: circlesBackground 0338 anchors.top: layoutArea.verticalCenter 0339 anchors.left: layoutArea.left 0340 } 0341 PropertyChanges { 0342 target: textArea 0343 width: questionArea.width * 0.3 0344 height: questionArea.height * 0.8 0345 } 0346 AnchorChanges { 0347 target: repeatArea 0348 anchors.right: textArea.left 0349 anchors.bottom: undefined 0350 anchors.verticalCenter: textArea.verticalCenter 0351 anchors.horizontalCenter: undefined 0352 } 0353 AnchorChanges { 0354 target: scoreArea 0355 anchors.left: textArea.right 0356 anchors.top: undefined 0357 anchors.verticalCenter: textArea.verticalCenter 0358 anchors.horizontalCenter: undefined 0359 } 0360 PropertyChanges { 0361 target: circlesArea 0362 itemWidth: Math.min(circlesBackground.width / (items.circlesModel + 1), 0363 circlesBackground.height * 0.9) 0364 width: itemWidth * items.circlesModel 0365 height: itemWidth 0366 } 0367 PropertyChanges { 0368 target: errorRectangle 0369 imageSize: height * 0.5 0370 } 0371 }, 0372 State { 0373 id: verticaleLayout 0374 when: !isHorizontal 0375 AnchorChanges { 0376 target: questionArea 0377 anchors.bottom: layoutArea.bottom 0378 anchors.right: layoutArea.horizontalCenter 0379 } 0380 AnchorChanges { 0381 target: circlesBackground 0382 anchors.top: layoutArea.top 0383 anchors.left: layoutArea.horizontalCenter 0384 } 0385 PropertyChanges { 0386 target: textArea 0387 width: questionArea.width * 0.8 0388 height: questionArea.height * 0.3 0389 } 0390 AnchorChanges { 0391 target: repeatArea 0392 anchors.right: undefined 0393 anchors.bottom: textArea.top 0394 anchors.verticalCenter: undefined 0395 anchors.horizontalCenter: textArea.horizontalCenter 0396 } 0397 AnchorChanges { 0398 target: scoreArea 0399 anchors.left: undefined 0400 anchors.top: textArea.bottom 0401 anchors.verticalCenter: undefined 0402 anchors.horizontalCenter: textArea.horizontalCenter 0403 } 0404 PropertyChanges { 0405 target: circlesArea 0406 itemWidth: Math.min(circlesBackground.height / (items.circlesModel + 1), 0407 circlesBackground.width * 0.9) 0408 width: itemWidth 0409 height: itemWidth * items.circlesModel 0410 } 0411 PropertyChanges { 0412 target: errorRectangle 0413 imageSize: width * 0.5 0414 } 0415 } 0416 ] 0417 0418 ErrorRectangle { 0419 id: errorRectangle 0420 anchors.fill: circlesBackground 0421 radius: circlesBackground.radius 0422 imageSize: height * 0.5 0423 function releaseControls() { items.inputLocked = false; } 0424 } 0425 0426 File { 0427 id: fileId 0428 } 0429 0430 DialogHelp { 0431 id: dialogHelp 0432 onClose: home(); 0433 } 0434 0435 DialogChooseLevel { 0436 id: dialogActivityConfig 0437 currentActivity: activity.activityInfo 0438 onLoadData: { 0439 if(activityData && activityData["mode"]) { 0440 items.mode = activityData["mode"]; 0441 } 0442 if(activityData && activityData["voicesEnabled"]) { 0443 items.voicesEnabled = activityData["voicesEnabled"] === "true" ? true : false; 0444 } 0445 } 0446 onSaveData: { 0447 levelFolder = dialogActivityConfig.chosenLevels 0448 currentActivity.currentLevels = dialogActivityConfig.chosenLevels 0449 ApplicationSettings.setCurrentLevels(currentActivity.name, dialogActivityConfig.chosenLevels) 0450 } 0451 onStartActivity: { 0452 background.stop(); 0453 background.start(); 0454 } 0455 0456 onClose: home() 0457 } 0458 0459 0460 Bar { 0461 id: bar 0462 level: items.currentLevel + 1 0463 content: BarEnumContent { value: help | home | level | activityConfig} 0464 onHelpClicked: { 0465 displayDialog(dialogHelp); 0466 } 0467 onPreviousLevelClicked: { 0468 Activity.previousLevel(); 0469 } 0470 onNextLevelClicked: { 0471 Activity.nextLevel(); 0472 } 0473 onHomeClicked: activity.home(); 0474 onActivityConfigClicked: displayDialog(dialogActivityConfig); 0475 } 0476 0477 Bonus { 0478 id: bonus 0479 Component.onCompleted: win.connect(Activity.nextLevel); 0480 } 0481 } 0482 0483 }