Comment créer une boîte de dialogue de message à l'aide de QML éléments de Contrôle(telles que la zone de liste déroulante, zone de texte, case à cocher..)
Je voudrais créer une boîte de dialogue de message de la façon suivante
Par exemple:Mon combobox a 2 nom, “chkbx”(nom symbolique pour la case à cocher), “txtedt”(nom symbolique du champ de texte).
Chaque fois que je sélectionne chkbox ou txtedt de zone de liste déroulante liste déroulante, puis mon combo devrait me connecter à de véritables case et textedit élément respectivement.
J'ai un “afficher la boîte de dialogue” bouton sur la barre d'état lorsque je presse le bouton, il devrait popup sélectionné l'option(case à cocher ou à la ligne d'édition)
Veuillez me suggérer comment puis-je le faire.
MODIFIER Voici le code et le problème, je suis confronté avec zone de liste déroulante d'options est, ni je ne suis pas en mesure d'obtenir des icônes dans ma boîte de message, ni je ne sais pas comment je peux voir la case à cocher ou ligne à modifier dans la boîte de dialogue de message, je suis un débutant et qui luttent pour explorer les manières délicates utilisé dans QML..
import QtQuick 2.2
import QtQuick.Controls 1.2
import QtQuick.Dialogs 1.1
import QtQuick.Window 2.0
Item {
id: root
width: 580
height: 400
SystemPalette { id: palette }
clip: true
//! [messagedialog]
MessageDialog {
id: messageDialog
visible: messageDialogVisible.checked
modality: messageDialogModal.checked ? Qt.WindowModal : Qt.NonModal
title: windowTitleField.text
text: customizeText.checked ? textField.text : ""
informativeText: customizeInformativeText.checked ? informativeTextField.text : ""
onButtonClicked: console.log("clicked button " + clickedButton)
onAccepted: lastChosen.text = "Accepted " +
(clickedButton == StandardButton.Ok ? "(OK)" : (clickedButton == StandardButton.Retry ? "(Retry)" : "(Ignore)"))
onRejected: lastChosen.text = "Rejected " +
(clickedButton == StandardButton.Close ? "(Close)" : (clickedButton == StandardButton.Abort ? "(Abort)" : "(Cancel)"))
onHelp: lastChosen.text = "Yelped for help!"
onYes: lastChosen.text = (clickedButton == StandardButton.Yes ? "Yeessss!!" : "Yes, now and always")
onNo: lastChosen.text = (clickedButton == StandardButton.No ? "Oh No." : "No, no")
}
//! [messagedialog]
Column {
anchors.fill: parent
anchors.margins: 12
spacing: 8
Text {
color: palette.windowText
font.bold: true
text: "Message dialog properties:"
}
CheckBox {
id: messageDialogModal
text: "Modal"
checked: true
Binding on checked { value: messageDialog.modality != Qt.NonModal }
}
CheckBox {
id: customizeTitle
text: "Window Title"
checked: true
width: parent.width
TextField {
id: windowTitleField
anchors.right: parent.right
width: informativeTextField.width
text: "Alert"
}
}
Row {
Text {
text: "Combo box items and icon selection:"
}
spacing: 8
function createIcon(str) {
switch(str) {
case Critical:
messageDialog.icon = StandardIcon.Critical
console.log("Critical")
break;
case Question:
messageDialog.icon = StandardIcon.Question
break;
case checkbox:
//how to add checkbox here in order to show it in my message dialog ?
break;
case textedit:
//how to add textedit here in order to show it in message dialog ?
break;
default:
break
}
}
ComboBox {
id : cbox
editable: true
currentIndex: 0
model: ListModel {
id: cbItems
ListElement { text: "Critical"}
ListElement { text: "Question"}
ListElement { text: "checkbox"}
ListElement { text: "textedit"}
}
onCurrentIndexChanged: console.debug(cbItems.get(currentIndex).text)
onAccepted: parent.createIcon(cbItems.get(currentIndex).text)
}
}
CheckBox {
id: customizeText
text: "Primary Text"
checked: true
width: parent.width
TextField {
id: textField
anchors.right: parent.right
width: informativeTextField.width
text: "Attention Please"
}
}
CheckBox {
id: customizeInformativeText
text: "Informative Text"
checked: true
width: parent.width
TextField {
id: informativeTextField
anchors.right: parent.right
width: root.width - customizeInformativeText.implicitWidth - 20
text: "Be alert!"
}
}
Text {
text: "Buttons:"
}
Flow {
spacing: 8
width: parent.width
property bool updating: false
function updateButtons(button, checked) {
if (updating) return
updating = true
var buttons = 0
for (var i = 0; i < children.length; ++i)
if (children[i].checked)
buttons |= children[i].button
if (!buttons)
buttons = StandardButton.Ok
messageDialog.standardButtons = buttons
updating = false
}
CheckBox {
text: "Help"
property int button: StandardButton.Help
onCheckedChanged: parent.updateButtons(button, checked)
}
CheckBox {
text: "Close"
property int button: StandardButton.Close
onCheckedChanged: parent.updateButtons(button, checked)
}
CheckBox {
text: "Cancel"
property int button: StandardButton.Cancel
onCheckedChanged: parent.updateButtons(button, checked)
}
}
}
Rectangle {
anchors {
left: parent.left
right: parent.right
bottom: parent.bottom
}
height: buttonRow.height * 1.2
color: Qt.darker(palette.window, 1.1)
border.color: Qt.darker(palette.window, 1.3)
Row {
id: buttonRow
spacing: 6
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
anchors.leftMargin: 12
width: parent.width
Button {
text: "Show Dialog"
anchors.verticalCenter: parent.verticalCenter
onClicked: messageDialog.open()
}
Button {
text: "Close"
anchors.verticalCenter: parent.verticalCenter
onClicked: messageDialog.close()
}
}
}
}
Window
comme élément racine fin faire ce que vous voulez à l'intérieur deveuillez voir le modifier.
OriginalL'auteur User | 2014-07-27
Vous devez vous connecter pour publier un commentaire.
Je n'arrive toujours pas à comprendre ce que vous allez faire. Supposons, vous voulez un peu de dialogue personnalisée avec le contenu varie. Tout d'abord, je suppose que
MessageDialog
est pas une bonne idée tout simplement parce que vous ne pouvez pas définir des contrôles à l'intérieur d'elle. Mais vous pouvez en créer un personnalisé.Exemple Simple:
Popup.qml
J'utilise ici
Loader
pour charger le contenu approprié en fonction depopupType
propriété (1 - zone de liste déroulante, 2 - textedit)Alors maintenant, vous pouvez utiliser ce fichier dans n'importe quel endroit où vous voulez.
J'utilise ici
Connections
pour revenir à un résultat à partir de la boîte de dialogue. Si vous n'avez pas besoin, il suffit de retirer laConnections
élémentvous avez juste besoin de le mettre à l'intérieur de certaines gestionnaire d'événement ou de la fonction. par exemple:
Button { onClicked: {here all the code ... var component = ...}}
. Voir j'ai mis à jour ma réponse.Désolé, mais je ne pouvais imaginer que vous avez une bonne expertise en QML. Pouvez vous s'il vous plaît regardez cette question [stackoverflow.com/questions/25056883/...
Grande Réponse & bon code.
OriginalL'auteur folibis