import QtQuick 2.12 import QtQuick.Controls 2.12 Popup { id: boite_dialogue // Propriétés fixes : readonly property double pourcentage_largeur_page_popup: 0.6 readonly property double pourcentage_hauteur_page_popup: 0.7 readonly property int padding_popup: 50 readonly property double pourcentage_boite_dialogue_titre: 0.25 readonly property double pourcentage_boite_dialogue_message: 1 - pourcentage_boite_dialogue_titre - pourcentage_boite_dialogue_ligne_boutons readonly property double pourcentage_boite_dialogue_ligne_boutons: 0.15 readonly property int hauteur_progress_bar: 30 readonly property int bouton_largeur: 200 // Propriétés : property int niveau: 0 property string message: "--" property int type: 0 // Utilisé uniquement par la page appelante pour distinguer les différents appels dans la même page // Propriétés alias : property alias boutonOk: bouton_ok.visible property alias boutonAnnuler: bouton_annuler.visible property alias boutonPlusTard: bouton_plus_tard.visible property alias boutonOkTexte: bouton_ok_label.text property alias boutonAnnulerTexte: bouton_annuler_label.text property alias boutonPlusTardTexte: bouton_plus_tard_label.text property alias alignementMessage: texte_message.horizontalAlignment property alias progressBarValid: progress_bar.visible property alias progressBarValue: progress_bar.value property alias imageTitreSource: image_titre.source property alias affichageAscenseur: ascenseur.visible // Signaux : signal clicked(int bouton) // Valeur à lire lorsque le "OnClicked' est activé x: (shipheart_largeur_page * (1 - pourcentage_largeur_page_popup)) / 2; y: (shipheart_hauteur_page * (1 - pourcentage_hauteur_page_popup)) / 2; width: shipheart_largeur_page * pourcentage_largeur_page_popup; height: shipheart_hauteur_page * pourcentage_hauteur_page_popup; padding: padding_popup modal: true // focus: true // SDIR # 224 : Il ne faut PAS activer le focus. Sinon, à la fermeture, le focus précédent est réactivé (comme le dernier TextField par exemple) closePolicy: Popup.NoAutoClose //Popup.CloseOnPressOutside background: Rectangle { radius: 20 color: { switch(boite_dialogue.niveau) { default: case 0: color: shipheart_couleur_fond_boite_dialogue_niveau_0; break; case 1: color: shipheart_couleur_fond_boite_dialogue_niveau_1; break; case 2: color: shipheart_couleur_fond_boite_dialogue_niveau_2; break; } } } Column { id: affichage_boite_dialogue spacing: 20 //========================================================================= // Titre : //========================================================================= Rectangle { id: titre_boite_dialogue width: boite_dialogue.width - (2 * padding_popup) height: (boite_dialogue.height - (2 * padding_popup) - (2 * affichage_boite_dialogue.spacing)) * pourcentage_boite_dialogue_titre color: "transparent" Image { id: image_titre source: "" sourceSize.height: parent.height anchors { verticalCenter: parent.verticalCenter horizontalCenter: parent.horizontalCenter } visible: true } } //========================================================================= // Message : //========================================================================= Rectangle { id: message_boite_dialogue width: boite_dialogue.width - (2 * padding_popup) height: (boite_dialogue.height - (2 * padding_popup) - (2 * affichage_boite_dialogue.spacing)) * pourcentage_boite_dialogue_message color: "transparent" Flickable { anchors.fill: parent anchors { verticalCenter: parent.verticalCenter } contentWidth: texte_message.width contentHeight: texte_message.height flickableDirection: Flickable.VerticalFlick clip: true ScrollBar.vertical: ScrollBar { // Important car permet de voir que la partie affichée n'est pas complète dans le message... id: ascenseur policy: ScrollBar.AlwaysOn width: 10 visible: false } TextEdit { id: texte_message width: message_boite_dialogue.width - ascenseur.width - 5 // Le '-5' permet de détacher le texte de l'ascenseur height: Math.max(message_boite_dialogue.height, implicitHeight) // Permet d'avoir la hauteur de la zone si le texte est "court" (et donc de centrer verticalement) puis la hauteur totale si le texte est "long" (et pouvoir se déplacer vers la fin et pas centré sur le milieu !) verticalAlignment: Text.AlignVCenter horizontalAlignment: Text.AlignHCenter readOnly:true wrapMode: Text.Wrap textFormat: Text.RichText text: boite_dialogue.message color: { switch(boite_dialogue.niveau) { default: case 0: shipheart_couleur_texte_boite_dialogue_niveau_0; break; case 1: shipheart_couleur_texte_boite_dialogue_niveau_1; break; case 2: shipheart_couleur_texte_boite_dialogue_niveau_2; break; } } font.pixelSize:18 } } } //========================================================================= // Barre d'avancement : //========================================================================= ProgressBar { id: progress_bar width: parent.width visible: false // Par défaut background: Rectangle { implicitWidth: parent.width implicitHeight: hauteur_progress_bar color: "transparent" border.color: couleur_gris_moyen border.width: 2 radius: shipheart_rayon_bouton Text { text: (progress_bar.value * 100).toFixed(0) + "%" anchors.fill: parent verticalAlignment: Text.AlignVCenter horizontalAlignment: Text.AlignHCenter color: { switch(boite_dialogue.niveau) { default: case 0: couleur_blanc_casse; break; case 1: couleur_blanc_casse; break; case 2: couleur_blanc_casse; break; } } font.pixelSize:18 font.weight: Font.Bold } } contentItem: Item { implicitWidth: parent.width implicitHeight: hauteur_progress_bar Rectangle { width: progress_bar.value * parent.width height: parent.height radius: shipheart_rayon_bouton color: shipheart_couleur_fond_bouton_actif } } } //========================================================================= // Boutons : //========================================================================= Row { height: (boite_dialogue.height - (2 * padding_popup) - (2 * affichage_boite_dialogue.spacing)) * pourcentage_boite_dialogue_ligne_boutons anchors.horizontalCenter: parent.horizontalCenter spacing: 20 //-------------------------------------------------------------------- // Bouton Ok : Rectangle { id: bouton_ok width: bouton_largeur height: parent.height anchors.verticalCenter: parent.verticalCenter radius: shipheart_rayon_bouton color: couleur_gris_tres_fonce visible: true Label { id: bouton_ok_label anchors.centerIn: parent text: qsTr("OK") color: couleur_blanc_casse font.pixelSize:20 } MouseArea { anchors.fill: parent onClicked: { shipheart_clic(); boite_dialogue.clicked(shipheart_boite_dialogue_bouton_1); boite_dialogue.close(); } } } //-------------------------------------------------------------------- // Bouton Annuler : Rectangle { id: bouton_annuler width: bouton_largeur height: parent.height anchors.verticalCenter: parent.verticalCenter radius: shipheart_rayon_bouton color: couleur_gris_tres_fonce visible: false Label { id: bouton_annuler_label anchors.centerIn: parent text: qsTr("Annuler") color: couleur_blanc_casse font.pixelSize:20 } MouseArea { anchors.fill: parent onClicked: { shipheart_clic(); boite_dialogue.clicked(shipheart_boite_dialogue_bouton_2); boite_dialogue.close(); } } } //-------------------------------------------------------------------- // Bouton Plus Tard : Rectangle { id: bouton_plus_tard width: bouton_largeur height: parent.height anchors.verticalCenter: parent.verticalCenter radius: shipheart_rayon_bouton color: couleur_gris_tres_fonce visible: false Label { id: bouton_plus_tard_label anchors.centerIn: parent text: qsTr("Plus tard") color: couleur_blanc_casse font.pixelSize:20 } MouseArea { anchors.fill: parent onClicked: { shipheart_clic(); boite_dialogue.clicked(shipheart_boite_dialogue_bouton_3); boite_dialogue.close(); } } } } } enter: Transition { ParallelAnimation { NumberAnimation { property: "opacity"; from: 0.0; to: 1.0; //easing.type: Easing.InElastic; duration: 200 } NumberAnimation { property: "scale"; from: 0.0; to: 1.0; // easing.type: Easing.OutBack duration: 200 } } } exit: Transition { ParallelAnimation { NumberAnimation { property: "opacity"; from: 1.0 to: 0.0; duration: 200 } NumberAnimation { property: "scale"; from: 1.0 to: 0.0; duration: 200 } } } }