nooLight/resources/qml/SettingsForm.qml

import QtQuick 2.0
import QtQuick.Controls 2.2

import ru.ded.noolight 1.0
import ru.ded.components 1.0

Page {
    id: root

    title: qsTr("Settings")

    ListModel {
        id: settingsModel

        ListElement {
            name: "serviceUrl"
            title: qsTr("nooLite service URL")
            inputMethodHint: Qt.ImhUrlCharactersOnly
        }
        ListElement {
            name: "login"
            title: qsTr("Login")
            inputMethodHint: Qt.ImhLatinOnly
        }
        ListElement {
            name: "password"
            title: qsTr("Password")
            hideText: true
        }
    }

    ListView {
        model: settingsModel

        anchors.fill: parent

        delegate: SubtitledItemDelegate {
            width: parent.width
            text: model.title
            subtitle: model.hideText && Settings[model.name] ? qsTr("Hidden") : Settings[model.name]

            onClicked: inputDialog.open()

            Dialog {
                id: inputDialog

                anchors.centerIn: parent
                parent: ApplicationWindow.overlay

                focus: true
                modal: true
                title: model.title
                standardButtons: Dialog.Ok | Dialog.Cancel

                Column {
                    spacing: 20
                    anchors.fill: parent

                    TextField {
                        id: textField

                        width: parent.width
                        focus: true
                        inputMethodHints: model.inputMethodHint
                        echoMode: model.hideText ? TextInput.Password : TextInput.Normal
                        placeholderText: model.title
                        text: Settings[model.name]
                    }
                }

                onAccepted: {
                    Settings[model.name] = textField.text
                }
            }
        }
    }
}