Question

QML Window内有ListView TabView Tab { 代表是TextField：

的实例

import QtQuick 2.5
import QtQuick.Controls 1.4
import QtQuick.Layouts 1.1
import QtQuick.Window 2.2
import QtQuick.Controls.Styles 1.4

Window
{
    width: Screen.width/2
    height: Screen.height/2

    x: Screen.width/2-width/2
    y: Screen.height/2-height/2

    flags: Qt.FramelessWindowHint

    visible: true

    color: "transparent"

    property string uePropertyServerAddress:""
    property string uePropertyServerPort:""
    property string uePropertyDatabaseName:""
    property string uePropertyDatabaseUsername:""
    property string uePropertyDatabasePassword:""
    property string uePropertyHostname:""

    ColumnLayout
    {
        anchors.fill: parent

        spacing: 8

        Rectangle
        {
            Layout.fillWidth: true
            Layout.fillHeight: true
            Layout.margins: 8

            radius: 16
            border.color: "#4682b4"
            border.width: 1
            antialiasing: true

            gradient: Gradient
            {
                GradientStop
                {
                    position: 0
                    color: "#636363"
                }   // GradientStop

                GradientStop
                {
                    position: 1
                    color: "#303030"
                }   // GradientStop
            }   // Gradient

            ColumnLayout
            {
                anchors.fill: parent

                RowLayout
                {
                    spacing: 8
                    Layout.fillWidth: true
                    Layout.fillHeight: true
                    Layout.margins: 8
                    Layout.alignment: Qt.AlignHCenter|Qt.AlignTop

                    antialiasing: true

                    Text
                    {
                        text: qsTr("APPLICATION SETTINGS")
                        clip: true
                        font.bold: true
                        font.pointSize: 24
                        textFormat: Text.RichText
                        verticalAlignment: Text.AlignVCenter
                        horizontalAlignment: Text.AlignHCenter
                    }   // Text
                }   // RowLayout

                ColumnLayout
                {
                    Layout.fillWidth: true
                    Layout.fillHeight: true
                    Layout.margins: 8
                    Layout.alignment: Qt.AlignHCenter|Qt.AlignBottom

                    TabView
                    {
                        Layout.fillWidth: true
                        Layout.fillHeight: true
                        Layout.alignment: Qt.AlignHCenter|Qt.AlignVCenter

                        tabPosition: Qt.TopEdge

                        frameVisible: true

                        style: TabViewStyle
                        {
                            frameOverlap: 1

                            tab: Rectangle
                            {
                                implicitWidth: 128//Math.max(ueTabText.width+4, 120)
                                implicitHeight: 48//ueTabText.height*2

                                radius: 8

                                border.color: "#4682b4"
                                border.width: 1

                                gradient: Gradient
                                {
                                    GradientStop
                                    {
                                        position: 0
                                        color: "#ffffff"
                                    }   // GradientStop

                                    GradientStop
                                    {
                                        position: 0.418
                                        color: styleData.selected ? "steelblue" : "#000000"
                                    }   // GradientStop
                                }   // gradient

                                ColumnLayout
                                {
                                    anchors.fill:parent

                                    Text
                                    {
                                        id: ueTabText

                                        Layout.fillWidth: true
                                        Layout.fillHeight: true
                                        Layout.margins: 8

                                        text: styleData.title

                                        color: styleData.selected?"black":"white"
                                    }   // Text
                                }   // ColumnLayout
                            }   // tab

                            frame: Rectangle
                            {
                                radius: 8

                                border.color: "#4682b4"
                                border.width: 1

                                color: "black"
                            }   // frame
                        }   // TabViewStyle

                        Tab
                        {
                            asynchronous: true
                            title: qsTr("Database")

                            Layout.fillWidth: true
                            Layout.fillHeight: true
                            Layout.alignment: Qt.AlignHCenter|Qt.AlignVCenter

                            ColumnLayout
                            {
                                spacing: 8
                                Layout.fillWidth: true
                                Layout.fillHeight: true
                                Layout.alignment: Qt.AlignHCenter|Qt.AlignVCenter

                                ListModel
                                {
                                    id: ueDatabaseSettingsModel

                                    ListElement
                                    {
                                        feature: qsTr("database server address")
                                    }   // ListElement

                                    ListElement
                                    {
                                        feature: qsTr("database server port")
                                    }   // ListElement

                                    ListElement
                                    {
                                        feature: qsTr("database name")
                                    }   // ListElement

                                    ListElement
                                    {
                                        feature: qsTr("database access username")
                                    }   // ListElement

                                    ListElement
                                    {
                                        feature: qsTr("database access password")
                                    }   // ListElement
                                }   // ListModel

                                ListView
                                {
                                    id: ueDatabaseSettingListView

                                    Layout.fillWidth: true
                                    Layout.fillHeight: true
                                    Layout.alignment: Qt.AlignHCenter|Qt.AlignVCenter
                                    Layout.margins: 8

                                    spacing: 16

                                    delegate: TextField
                                    {
                                        width: ueDatabaseSettingListView.width

                                        antialiasing: true

                                        placeholderText: model.feature

                                        style: TextFieldStyle
                                        {
                                            textColor: "#C1C1C1"
                                            placeholderTextColor: "steelblue"

                                            background: Rectangle
                                            {
                                                color: "#323232"

                                                border.color: "#4682b4"
                                                border.width: 1
                                            }
                                        }   // TextFieldStyle
                                    }   // delegate

                                    Component.onCompleted:
                                    {
                                        model=ueDatabaseSettingsModel;
                                    }   // Component.OnCompleted
                                }   // ListView
                            }   // ColumnLayout
                        }   // Tab
                    }   // TabView

                    RowLayout
                    {
                        Layout.fillWidth: true
                        Layout.fillHeight: false
                        Layout.alignment: Qt.AlignLeft|Qt.AlignVCenter
                        spacing: 8

                        Button
                        {
                            Layout.fillWidth: false
                            Layout.fillHeight: true
                            Layout.alignment: Qt.AlignLeft|Qt.AlignVCenter

                            text: qsTr("Apply")

                            onClicked:
                            {
                            }   // onClicked
                        }   // Button

                        Button
                        {
                            Layout.fillWidth: false
                            Layout.fillHeight: true
                            Layout.alignment: Qt.AlignLeft|Qt.AlignVCenter

                            text: qsTr("Clear")

                            onClicked:
                            {
                            }   // onUeSignalButtonClicked
                        }   // Button
                    }   // RowLayout
                }   // ColumnLayout
            }   // ColumnLayout
        }   // Rectangle
    }   // ColumnLayout
}   // Window

这很好用，但我偶然发现保存 TextField的值进入GUI项目属性的问题：< / p>

TextField 数据库服务器地址必须将值保存到property string uePropertyServerAddress
TextField 数据库服务器端口必须将值保存到property string uePropertyServerPort
etc ...用于所有其他TextField。

问题是，我如何＆＃34;链接＆＃34; ListView（TextField个实例）的代表属于属性？

Answer 1

我认为你需要像BaCaRoZzo评论那样进行重构，但我认为问题可以通过最小的改变来解决。

首先，将目标属性名称附加到每个ListElement

中

ListModel
{
    id: ueDatabaseSettingsModel

    ListElement
    {
        feature: qsTr("database server address")
        target: "uePropertyServerAddress"
    }   // ListElement

    ListElement
    {
        feature: qsTr("database server port")
        target: "uePropertyServerPort"
    }   // ListElement

    ListElement
    {
        feature: qsTr("database name")
        target: "uePropertyDatabaseName"
    }   // ListElement

    ListElement
    {
        feature: qsTr("database access username")
        target: "uePropertyDatabaseUsername"
    }   // ListElement

    ListElement
    {
        feature: qsTr("database access password")
        target: "uePropertyDatabasePassword"
    }   // ListElement
}   // ListModel

其次，添加onEditingFinished处理程序，如下所示

delegate: TextField
{

...

    onEditingFinished: {
        window[model.target] = text;
    }
}

第三，向Window添加id以访问其属性

Window
{
    id: window

然后，您可以看到每个TextField的文本都已分配给该属性。

将数据从TextField类型ListView委托保存到属性中

1 个答案: