Search code examples
qtdialogqmlqtquick2qtquickcontrols

QML reset dialog with tabview


I was trying to implement a tabbed Dialog in QML with the means to reset it to the intial values.

Since tabs are dynamically instantiated, none of the straight forward methods seem to work. The parent Dialog can not reference the inner Combobox and the Combobox can not reference the outer Dialog. How can this be achieved?

import QtQuick 2.3
import QtQuick.Controls 1.4
import QtQuick.Dialogs 1.2
import QtQuick.Layouts 1.1

Dialog {
    id: dlg
    title: "Settings"
    visible: true
    standardButtons: StandardButton.Apply | StandardButton.Reset
    property string val: ""
    onApply: console.log(val)
    onReset: {
        // RESET COMBOBOX TO DEFAULT
    }
    TabView {
        id: tabView
        anchors.fill: parent
        Tab {
            title: "ValueTab"
            id: tabVal
            GridLayout {
                id: gridVal
                anchors.fill: parent
                GroupBox {
                    title: qsTr("Choose value")
                    id: gb
                    Layout.fillWidth: true
                    ColumnLayout {
                        anchors.fill: parent
                        id: cl
                        ComboBox {
                            id: valueChooser
                            editable: false
                            model: ListModel {
                                id: listModel
                                ListElement { text: "One" }
                                ListElement { text: "Two" }
                                ListElement { text: "Three" }
                            }
                            Layout.fillWidth: true
                            onCurrentTextChanged : val = currentText
                        }
                    }
                }
            }
        }
    }
}

Solution

  • I am quite unsure, if I got your question right as you say, you can not reference the Dialog from within the Combobox. I can not see the reason why.

    Assuming the example of yours contains indeed your problem and all you want to do is to reset the values (and you know the original values) once the reset button is pressed, this is how I would solve it.
    Using the Connections-type to connect to the Dialog's reset() from within the Combobox

    import QtQuick 2.3
    import QtQuick.Controls 1.4
    import QtQuick.Dialogs 1.2
    import QtQuick.Layouts 1.1
    
    Dialog {
        id: dlg
        title: "Settings"
        visible: true
        standardButtons: StandardButton.Apply | StandardButton.Reset
        property string val: ""
        onApply: console.log(val)
        onReset: {
            // **DONT** RESET COMBOBOX TO DEFAULT **HERE**
        }
        TabView {
            id: tabView
            anchors.fill: parent
            Tab {
                title: "ValueTab"
                id: tabVal
                GridLayout {
                    id: gridVal
                    anchors.fill: parent
                    GroupBox {
                        title: qsTr("Choose value")
                        id: gb
                        Layout.fillWidth: true
                        ColumnLayout {
                            anchors.fill: parent
                            id: cl
                            ComboBox {
                                id: valueChooser
                                editable: false
                                model: ListModel {
                                    id: listModel
                                    ListElement { text: "One" }
                                    ListElement { text: "Two" }
                                    ListElement { text: "Three" }
                                }
                                Layout.fillWidth: true
                                onCurrentTextChanged : val = currentText
    
                                /// *** INTERESTING PART HERE! ***
                                Connections {
                                    target: dlg
                                    onReset: {
                                        // RESET COMBOBOX TO DEFAULT **HERE** INSTEAD
                                        valueChooser.currentIndex = 0
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }