C++ Qt5-QML：如何使用按钮动态擦除对象_C++_Qt_Qml_Qt5

C++ Qt5-QML：如何使用按钮动态擦除对象

c++ qt qml

C++ Qt5-QML：如何使用按钮动态擦除对象,c++,qt,qml,qt5,C++,Qt,Qml,Qt5,下面是我准备的一个最小示例的布局。这是执行所有必要操作后界面的打印屏幕，如果需要，还可以找到源代码：此时，我想使用按钮“清除列表”擦除对象，我不再需要它，但我只获得了部分结果，如下所示：预期的结果是删除所有对象和按钮“清除列表”本身。单击按钮后的最终布局应如下所示：下面是我在最简单示例中使用的代码，您可以在计算机上复制/粘贴，它将按原样工作： import QtQuick 2.4 import QtQuick.Controls 2.12 import QtQuick.Dialogs

下面是我准备的一个最小示例的布局。这是执行所有必要操作后界面的打印屏幕，如果需要，还可以找到源代码：

此时，我想使用

按钮

“清除列表”擦除对象，我不再需要它，但我只获得了部分结果，如下所示：

预期的结果是删除所有对象和

按钮

“清除列表”本身。单击按钮后的最终布局应如下所示：

下面是我在最简单示例中使用的代码，您可以在计算机上复制/粘贴，它将按原样工作：

import QtQuick 2.4
import QtQuick.Controls 2.12
import QtQuick.Dialogs 1.2
import QtQuick.Layouts 1.12
import QtQuick.Controls.impl 2.12  // for IconLabel

ApplicationWindow {
    id: window
    width: 640
    height: 480
    visible: true

    function buttonClick(button)
    {
        button.text = qsTr(" YES Connecting");
        button.enabled = false;
        if (button.background && button.background instanceof Rectangle) {
            button.background.color = "green";
            button.background.gradient = null;
            button.background.visible = true;
        }
        if (button.contentItem && button.contentItem instanceof IconLabel) {
            button.contentItem.color = "white";
            button.contentItem.font.bold = true;
            button.contentItem.font.pointSize = 20;
        }
    }

    function buttonClearListOfObjects(buttonClear)
    {
        buttonClear.text = qsTr("Clear List");
        buttonClear.enabled = false;
        if (buttonClear.background && buttonClear.background instanceof Rectangle) {
            buttonClear.background.color = "red";
            buttonClear.background.gradient = null;
            buttonClear.background.visible = true;
        }
        if (buttonClear.contentItem && buttonClear.contentItem instanceof IconLabel) {
            buttonClear.contentItem.color = "white";
            buttonClear.contentItem.font.bold = true;
            buttonClear.contentItem.font.pointSize = 20;
        }
    }
    ColumnLayout {
        Button {
            id: dialogA
            text: pBar.running ? "Connecting..." : "Not - Connected"
            Layout.fillWidth: true
            font.pointSize: 20
            spacing: 10
            onClicked: {
                buttonClick(this)
                //pBar.startComputation()
            }
        }
        ColumnLayout {
            id: layout
            Layout.fillWidth: true
            spacing: 10
            GroupBox {
                id: box1
                width: parent.width
                title: "Connection"
                font.pointSize: 20
                Layout.fillWidth: parent
                spacing: 10

                GridLayout {
                    width: parent.width
                    columns: 1
                    RowLayout {
                        id: row1
                        spacing: 200
                        Layout.fillWidth: true
                        Layout.fillHeight: false
                        Label {
                            id: textField
                            text: "Connection:"
                            font.pointSize: 15
                            Layout.fillWidth: true
                        }
                        Text {
                            id: connected
                            text: qsTr("Not-Connected")
                            color: "red"
                            font.pointSize: 15
                            horizontalAlignment: Text.AlignRight
                            Layout.fillWidth: true
                            states: [
                                State {
                                    name: "connecting"
                                    //when: pBar.running
                                    PropertyChanges {
                                        target: connected
                                        text: qsTr("Connecting...")
                                        color: "blue"
                                        font.bold: true
                                    }
                                },
                                State {
                                    name: "connected"
                                    //when: !pBar.running && pBar.finished //   something.connected
                                    PropertyChanges {
                                        target: connected
                                        text: qsTr("Yes! Connected...")
                                        color: "green"
                                        font.bold: true
                                    }
                                }
                            ]
                        }
                    }
                }
            }
            GroupBox {
                id: boxprogress
                title: "Connection Progress"
                font.pointSize: 20
                Layout.fillWidth: parent
                width: parent.width
                spacing: 10
                GridLayout {
                    width: parent.width
                    columns: 1
                    RowLayout {
                        Layout.fillWidth: true
                        Layout.fillHeight: false
                        ProgressBar {
                            id: progressbar_id
                            Layout.fillWidth: true
                            Layout.fillHeight: true
                            width: parent.width
                            from: 0
                            to: 40
                            value: pBar.progress
                        }
                    }
                }
            }
        }
        Button {
            id: clist
            text: "Clear List"
            Layout.fillWidth: true
            font.pointSize: 20
            width: parent.width
            enabled: true
            onClicked: {
                buttonClearListOfObjects(this)
//                 var i = dialogA.children.length;
//                 dialogA.children[i-1].destroy()

                 var j = layout.children.length;
                 layout.children[j-1].destroy()

//                 var k = box1.children.length;
//                 box1.children[k].destroy()

//                 var l = row1.children.length;
//                 row1.children[l-1].destroy()

//                var ii = textField.children.length;
//                textField.children[ii].destroy()

                var jj = connected.children.length;
                connected.children[jj-1].destroy()

                var kk = boxprogress.children.length;
                boxprogress.children[kk-1].destroy()

                var kkk = clist.children.length;
                clist.children[kk-1].destroy()
            }
        }

    }
}

我到目前为止所做的尝试：

1）在做了大量研究之后，我发现以下内容对于理解如何动态擦除对象非常有用。但具体地说，在我的示例中，我没有使用

Qt.createQmlObject（…）

，因为我对这个不够熟悉

2）之后，我继续寻找任何其他可能的来源来帮助我前进，我发现这些来源也很有用，但没有提供我正在寻找的具体信息

我从同一篇文章中了解到，删除对象是一个删除最后添加的对象的问题，这解释了循环计数减少的原因。然而，在执行了一个类似的过程之后，我只能删除示例中的一部分

3）我从编译器那里得到了以下错误，如果这可能有用的话

TypeError:无法调用未定义的方法“destroy”

我认为这与我如何毁灭孩子有关

4）是我发现的最接近的，事实上我实现了其中的一部分

5）非常有趣，但问题仍然存在

在我的例子中，我试图继续，并在文档中选择了销毁函数来擦除孩子，但我不确定它的好处。我这样说是因为，尽管我实现了解决方案，但我只能动态地擦除部分对象

在实现上述布局的过程中，我遗漏了什么？

感谢您直接指向右侧

您不应该破坏非动态创建的对象

关于

TypeError:无法调用未定义的方法'destroy'，这是因为connected
对象没有子对象，因此jj
为0且已连接。子对象[-1]
为未定义的

总之，如果您想创建动态模板，您应该熟悉Qt.createQmlObject（…）
和其他类似的方法。如果不是在资源受限的嵌入式设备中运行应用程序，还可以使这些控件不可见
要使所需组件不可见，您将有三个主要选项

将visible
绑定到一个或多个条件，该条件应使那些可能变得相当复杂和不易维护的组件不可见
通过函数设置这些对象的visible
属性，这可能会破坏以前可能的绑定
通过相关父级的状态
属性完成整个工作，并在这些状态
中添加属性更改，只需在函数中更改状态名称即可

你会发现这三个选项中有很多例子。但是为了让自己保持在正确的轨道上，我强烈建议你选择状态路径
下面是从Qml类型文档复制的示例
import QtQuick 2.0

Rectangle {
    id: myRect
    width: 100; height: 100
    color: "black"

    MouseArea {
        id: mouseArea
        anchors.fill: parent
        onClicked: myRect.state == 'clicked' ? myRect.state = "" : myRect.state = 'clicked';
    }

    states: [
        State {
            name: "clicked"
            PropertyChanges { target: myRect; color: "red" }
        }
    ]
}

您不应该销毁不是动态创建的对象
关于TypeError:无法调用未定义的方法'destroy'，这是因为connected
对象没有子对象，因此jj
为0且已连接。子对象[-1]
为未定义的

总之，如果您想创建动态模板，您应该熟悉Qt.createQmlObject（…）
和其他类似的方法。如果不是在资源受限的嵌入式设备中运行应用程序，还可以使这些控件不可见
要使所需组件不可见，您将有三个主要选项

将visible
绑定到一个或多个条件，该条件应使那些可能变得相当复杂和不易维护的组件不可见
通过函数设置这些对象的visible
属性，这可能会破坏以前可能的绑定
通过相关父级的状态
属性完成整个工作，并在这些状态
中添加属性更改，只需在函数中更改状态名称即可

你会发现这三个选项中有很多例子。但是为了让自己保持在正确的轨道上，我强烈建议你选择状态路径
下面是从Qml类型文档复制的示例
import QtQuick 2.0

Rectangle {
    id: myRect
    width: 100; height: 100
    color: "black"

    MouseArea {
        id: mouseArea
        anchors.fill: parent
        onClicked: myRect.state == 'clicked' ? myRect.state = "" : myRect.state = 'clicked';
    }

    states: [
        State {
            name: "clicked"
            PropertyChanges { target: myRect; color: "red" }
        }
    ]
}

你真的需要销毁它们还是让它们可见：false足够了？我认为使用隐形属性就足够了。但是，目标是，如果我再次单击未连接的按钮，我将再次看到我发布的第一个打印屏幕上的所有控件。不可见会产生这样的结果吗？另外，非常感谢你花时间阅读Amfasis的问题：）你真的需要销毁它们还是让它们可见：false足够了？我认为使用不可见属性就足够了。但是，目标是，如果我再次单击未连接的按钮，我将再次看到我发布的第一个打印屏幕上的所有控件。无形会产生这样的结果吗？同时，非常感谢你花时间阅读这个问题