Skip to content
Snippets Groups Projects
Commit b416f5e2 authored by Massies Alexandre's avatar Massies Alexandre
Browse files

restructu de la page et orga focus pour remplir les cases 

le focus qui s'arrrete pour chaque ligne tant qu'on a pas fait entrée fonctionne aps encore mais ça avance
parent caefe3a5
No related branches found
No related tags found
No related merge requests found
Show whitespace changes
Inline Side-by-side
Showing
with 351 additions and 203 deletions
Motus/Main.qml
+ 351
− 203
View file @ b416f5e2
import QtQuick 2.12 import QtQuick 2.12
import QtQuick.Window 2.12 import QtQuick.Window 2.12
import QtQuick.Controls 2.12 import QtQuick.Controls 2.12
...@@ -12,105 +13,168 @@ Window { ...@@ -12,105 +13,168 @@ Window {
visibility: Window.Maximized visibility: Window.Maximized
title: qsTr("Motus") title: qsTr("Motus")
// Suppression de la déclaration initiale de caseArray car _case_1_1 etc. ne sont pas définis. // Propriétés de gestion
property int indice_case: 0 property int indice_case: 0
property var caseArray: [] // sera rempli après création de la grille property int current_essai: 0
property var caseArray: [] // Rempli lors de la création de la grille
property var case_focus: null property var case_focus: null
// L'élément Rectangle ci-dessous couvre toute la fenêtre et gère les touches property int nb_lettres: 5
property var arrayTry: [5,6,6,7,7,8,8,8,8]
property int nb_essais: arrayTry[nb_lettres - 4]
property string mot: ""
property var mot_split: []
// Rectangle principal qui couvre la fenêtre
Rectangle { Rectangle {
id: mainRect id: mainRect
anchors.fill: parent anchors.fill: parent
color: "#323232" color: "#323232"
focus: true focus: true
// Gestion des touches (attachée à un Item, pas à Window) // Gestion des touches du clavier physique (déclarée sous forme de fonction)
Keys.onPressed: { Keys.onPressed: function(event) {
// Vérification que case_focus existe et possède la propriété _textText if (case_focus != -1 && mot != ""){
if (case_focus && case_focus._textText !== undefined && /^[a-zA-Z]$/.test(event.text)) { if (case_focus && case_focus._textText !== undefined && /^[a-zA-Z]$/.test(event.text)) {
case_focus._textText = event.text; case_focus._textText = event.text.toUpperCase();
indice_case++; indice_case++;
if (indice_case < caseArray.length) { if (indice_case < nb_lettres-1){
case_focus = caseArray[indice_case]; case_focus = caseArray[indice_case+nb_lettres*current_essai];
} }
else {
case_focus = -1
}
event.accepted = true; event.accepted = true;
} else if (event.key === Qt.Key_Backspace) { }
if (indice_case > 0) {
}
if (event.key === Qt.Key_Backspace) {
if (indice_case > 0 && indice_case != nb_lettres-1) {
indice_case--; indice_case--;
case_focus = caseArray[indice_case]; case_focus = caseArray[indice_case];
case_focus._textText = " "; case_focus._textText = " ";
} }
event.accepted = true; else if (indice_case === nb_lettres-1) {
case_focus = caseArray[indice_case+nb_lettres*current_essai];;
case_focus.textText = " ";
}
}
else if (event.key === Qt.Key_Return && indice_case === nb_lettres-1) {
if (current_essai === nb_essais-1){ // on entre dans la boucle de l'endgame
// il faut bloquer toute interaction autre que relancer une partie ;
// reset les paramètres de gestion du focus des cases ;
// déclencher une animation de fin qui indique la victoire ou la défaite
// update les stats
nb_essais = 0;
}
else { // verificastr de la propal
// lettre mal placée : f0d437 (jaune) ; lettre mauvaise : 323232 (fond window) ; lettre bien placée : 23ed1c
current_essai ++;
case_focus = caseArray[indice_case+nb_lettres*current_essai];
}
indice_case = 0;
} }
event.accepted = true;
} }
// Disposition globale en colonne
Row {
id: main_row
width: 1800
height: 900
anchors.verticalCenter: parent.verticalCenter
spacing: 150
anchors.horizontalCenter: parent.horizontalCenter
Rectangle {
id: rectangle_buttons
width: 400
height: 850
color: "#323232"
border.width: 0
Column {
id: column_buttons
width: 400
height: 850
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.horizontalCenter
spacing: 20
// Bouton "Générer un mot"
Choosebutton { Choosebutton {
id: choosebutton id: choosebutton
anchors.top: parent.top anchors.horizontalCenter: parent.horizontalCenter
anchors.left: parent.left
anchors.topMargin: parent.height * 0.2
anchors.leftMargin: parent.width * 0.2
_textText: "Générer un mot" _textText: "Générer un mot"
// Exemple : affichage d'un mot généré dans un Case enfant
Case { Case {
id: case3 id: case3
_textText: "mot test" _textText: "mot test"
} }
MouseArea { MouseArea {
anchors.fill: parent anchors.fill: parent
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
onClicked: { onClicked: { // début d'une game, il faut bloquer les boutons de régénération etc
let mot = motusGame.getRandomWord(); mot = motusGame.getRandomWord();
motusGame.startTimer(); motusGame.startTimer();
case3._textText = mot; case3._textText = mot;
mot_split = mot.split("");
console.log(mot_split)
} }
} }
} }
// Fenêtre pour les langages (en dessous du bouton générer)
Rectangle { Rectangle {
id: big_rectangle_langue id: big_rectangle_langue
width: parent.width * 0.15 width: 250
height: parent.height * 0.35 height: 300
anchors.top: choosebutton.bottom
anchors.left: choosebutton.left
anchors.topMargin: parent.height * 0.3
color: "#323232" color: "#323232"
radius: 10 radius: 10
border.color: "#ffffff" border.color: "#ffffff"
border.width: 3 border.width: 3
anchors.horizontalCenter: parent.horizontalCenter
Column { Column {
id: column
anchors.fill: parent anchors.fill: parent
anchors.margins: 10 anchors.margins: 10
spacing: 10 spacing: 15
// Ne pas utiliser d'anchors conflictuels sur les enfants du Column
Text { Text {
y: 100
text: qsTr("Language/Langage") text: qsTr("Language/Langage")
font.pixelSize: 25 font.pixelSize: 25
color: "white" color: "white"
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
anchors.horizontalCenter: parent.horizontalCenter
} }
LangageButton { LangageButton {
id: langageButton
anchors.horizontalCenter: parent.horizontalCenter
_textText: "Français" _textText: "Français"
// Utilisez par exemple Layout.alignment si nécessaire
MouseArea { MouseArea {
anchors.fill: parent anchors.left: parent.left
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.horizontalCenter: parent.horizontalCenter
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
onClicked: { onClicked: {
motusGame.dictionnaryChoosed = "Motus\\mots_francais.txt"; motusGame.dictionnaryChoosed = "Motus\\mots_francais_bis.txt";
} }
} }
} }
LangageButton { LangageButton {
anchors.horizontalCenter: parent.horizontalCenter
_textText: "English" _textText: "English"
MouseArea { MouseArea {
anchors.fill: parent anchors.fill: parent
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
...@@ -122,10 +186,66 @@ Window { ...@@ -122,10 +186,66 @@ Window {
} }
} }
// Texte MOTUS Rectangle {
id: big_rectangle_nb_lettres
width: 250
height: 300
color: "#323232"
radius: 10
border.color: "#ffffff"
border.width: 3
anchors.horizontalCenter: parent.horizontalCenter
Column {
id: colonne_nb_lettres
anchors.fill: parent
spacing: 50
Text {
id: text_choix_nb_lettres
text: qsTr("Nombre de lettres / \n Number of letters")
font.pixelSize: 22
anchors.horizontalCenter: parent.horizontalCenter
color: "white"
}
NumberLetterButton {
id: numberLetterBtn
width: parent.width
height: 60
}
}
}
}
}
Rectangle {
id: rectangle_center
width: 700
height: 900
color: "#323232"
border.width: 0
Column {
id: center_column
width: 700
height: 900
anchors.verticalCenter: parent.verticalCenter
spacing: 30
anchors.horizontalCenter: parent.horizontalCenter
Rectangle {
id: rectangle_titre
width: 200
height: 70
color: "#323232"
border.width: 0
anchors.horizontalCenter: parent.horizontalCenter
Text { Text {
id: _text2 id: _text2
text: qsTr("MOTUS") text: qsTr("MOTUS")
anchors.verticalCenter: parent.verticalCenter
font.pixelSize: 50 font.pixelSize: 50
color: "white" color: "white"
font.family: "Tahoma" font.family: "Tahoma"
...@@ -133,17 +253,30 @@ Window { ...@@ -133,17 +253,30 @@ Window {
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
anchors.top: parent.top anchors.top: parent.top
anchors.topMargin: parent.height * 0.2
} }
}
Rectangle {
id: rectangle_grid
width: 450
height: 500
color: "#323232"
border.width: 0
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.horizontalCenter
// Grille de jeu (les cases seront créées dynamiquement)
Grid { Grid {
id: grid id: grid
anchors.top: _text2.bottom x: -553
anchors.topMargin: parent.height * 0.02 y: -430
anchors.horizontalCenter: parent.horizontalCenter anchors.left: parent.left
width: parent.width * 0.25 anchors.right: parent.right
height: parent.height * 0.3 anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.leftMargin: 39
anchors.rightMargin: -39
anchors.topMargin: -80
anchors.bottomMargin: 80
spacing: 5 spacing: 5
rows: 6 rows: 6
columns: 5 columns: 5
...@@ -152,116 +285,131 @@ Window { ...@@ -152,116 +285,131 @@ Window {
id: caseRepeater id: caseRepeater
model: 30 model: 30
delegate: Case { delegate: Case {
// Afin d'identifier chaque instance, on peut donner un objectName
objectName: "caseDelegate" objectName: "caseDelegate"
} }
} }
} }
// Au chargement, remplir caseArray à partir des enfants de la grille
Component.onCompleted: {
caseArray = [];
for (var i = 0; i < grid.children.length; i++) {
// On ajoute uniquement les instances générées par le Repeater
if (grid.children[i].objectName === "caseDelegate") {
caseArray.push(grid.children[i]);
}
}
if (caseArray.length > 0) {
case_focus = caseArray[0];
}
} }
// Clavier en bas centré
Rectangle { Rectangle {
id: rectangle1 id: rectangle1
width: parent.width * 0.4 width: 600
height: parent.height * 0.3 height: 220
anchors.bottom: parent.bottom
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
anchors.bottomMargin: parent.height * 0.2
color: "#323232" color: "#323232"
radius: 10 radius: 10
border.color: "#ffffff" border.color: "#ffffff"
border.width: 5 border.width: 5
anchors.bottom: parent.bottom
anchors.bottomMargin: 50
Column { Column {
anchors.fill: parent anchors.fill: parent
anchors.margins: 10 anchors.margins: 10
spacing: parent.width * 0.04 spacing: 6
anchors.topMargin: 0 topPadding: rectangle1.height * 0.05
anchors.rightMargin: 0 bottomPadding: rectangle1.height * 0.05
anchors.leftMargin: 0
anchors.bottomMargin: 0
topPadding: rectangle1.height * 0.05 // ← espace en haut
bottomPadding: rectangle1.height * 0.05 // ← espace en bas
Repeater { Repeater {
anchors.fill: parent.parent
model: [ model: [
["A", "Z", "E", "R", "T", "Y", "U", "I", "O", "P"], ["A", "Z", "E", "R", "T", "Y", "U", "I", "O", "P"],
["Q", "S", "D", "F", "G", "H", "J", "K", "L"], ["Q", "S", "D", "F", "G", "H", "J", "K", "L"],
["↑", "W", "X", "C", "V", "B", "N", "M", "<"] ["↑", "W", "X", "C", "V", "B", "N", "M", "<"]
] ]
delegate: Row { delegate: Row {
spacing: parent.width * 0.005 spacing: 5
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
Repeater { Repeater {
model: modelData model: modelData
delegate: Key { delegate: Rectangle {
width: modelData === "Entrée" || modelData === "<" ? 80 : 50 width: (modelData === "Entrée" || modelData === "<") ? 80 : 50
height: 60 height: 60
labelText: modelData color: "lightgray"
scale: 0.8 radius: 5
border.color: "gray"
Text {
anchors.centerIn: parent
text: modelData
font.pixelSize: 20
color: "black"
}
MouseArea {
anchors.fill: parent
onClicked: {
if (modelData === "<") {
if (indice_case > 0) {
indice_case--;
caseArray[indice_case]._textText = "";
case_focus = caseArray[indice_case];
}
} else if (modelData === "↑") {
// Action pour la touche "↑" si nécessaire
} else {
if (indice_case < caseArray.length) {
caseArray[indice_case]._textText = modelData.toUpperCase();
indice_case++;
if (indice_case < caseArray.length)
case_focus = caseArray[indice_case];
} }
} }
} }
} }
} }
} }
}
}
}
}
}
}
Rectangle {
id: rectangle_right
width: 400
height: 850
color: "#323232"
border.width: 0
Row {
y: 50
anchors.horizontalCenter: parent.horizontalCenter
spacing: 20
// Combobox pour le nombre de lettres // Combobox pour le nombre de lettres
Rectangle { Rectangle {
id: rectangle_combobox id: rectangle_combobox
anchors.top: parent.top width: 193
anchors.right: parent.right height: 60
width: parent.width * 0.2
height: parent.height * 0.2
anchors.topMargin: parent.height * 0.13
anchors.rightMargin: parent.width * 0.6
color: "#323232" color: "#323232"
radius: 10 radius: 10
border.color: "#ffffff" border.color: "#ffffff"
border.width: 3 border.width: 3
}
Text { // Timer (positionné à droite)
text: qsTr("Nombre de lettres / \n Number of letters") MotusTimer {
font.pixelSize: 22 id: motusTimer
color: "white" width: 100
horizontalAlignment: Text.AlignHCenter height: 100
anchors.horizontalCenter: parent.horizontalCenter }
}
} }
NumberLetterButton {
y: 49
width: parent.width
height: parent.height * 0.5
anchors.horizontalCenter: parent.horizontalCenter
anchors.bottom: parent.bottom
anchors.bottomMargin: 16
} }
} }
// Timer // Au chargement, remplir caseArray à partir des instances créées par le Repeater de la grille
MotusTimer { Component.onCompleted: {
id: motusTimer caseArray = [];
anchors.top: parent.top for (var i = 0; i < caseRepeater.count; i++) {
anchors.right: parent.right caseArray.push(caseRepeater.itemAt(i));
anchors.topMargin: parent.height * 0.07 }
anchors.rightMargin: parent.width * 0.25 if (caseArray.length > 0) {
case_focus = caseArray[0];
} }
} }
} }
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please to comment