0

我正在编写一个使用Qt5-QML. 为了缩小问题，我准备了一个复制问题的小例子。

1)我在Page1. 它带有Button如下面的打印屏幕所示：

发射

2）用户按下按钮后，Page2如下图所示，带有不同的Buttons。假设Button A这是用户的选择：

纽扣

3)最终画面所代表的Page1是正确的选择，也就是选择的按钮

正确选择

我遇到的问题是，在用户选择第 2 点上的选项并返回后，Page1aButton应该出现在打​​开对话窗口Page1的中间，在我的情况下，a仅与 that 相关。当然，如果用户选择打开，则应该有另一个打开另一个与之相关的对话框，并且始终是.Page1WebEngineViewButtonButton 3Page2Page1ButtonButton 3WebEngineView

我看不到Button和相关的对话框。

预期的结果是下面的打印屏幕：

在带有问题的代码片段下方：

main.qml

import QtQuick 2.12
import QtQuick.Controls 2.12
ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("Conn")
    property Page1 page1: Page1 {}
    property Page2 page2: Page2 {}
    Component.onCompleted: {
        page2.onButtonClicked.connect(function(buttonId, buttonName) {
            page1.mytext.text = buttonId;
            page1.mytext.text = buttonName;
            mystackview.pop();
        });
    }

// These buttons should appear only after the user selects the choices on `Page2` 
    Button {
        id: dialogA
        Layout.fillWidth: true
        text: "Open Dialog A"
    }
    Button {
        id: dialogB
        Layout.fillWidth: true
        text: "Open Dialog B"
    }
    Button {
        id: dialogC
        Layout.fillWidth: true
        text: "Open Dialog C"
    }

    StackView {
        id: mystackview
        anchors.fill: parent
        initialItem: page1
    }
}

page1.qml

import QtQuick 2.12
import QtQuick.Controls 2.12
Page {
    property alias mytext: mytext
    Button {
        id: button1
        text: "Select"
        anchors.left: parent.left
        anchors.right: parent.right
        anchors.top: parent.top
        onClicked: {
            mystackview.push(page2);
        }
    }
    Text {
        id: mytext
        anchors.top: button1.bottom
        anchors.left: parent.left
        anchors.right: parent.right
        anchors.bottom: parent.bottom
        font.bold: true
        font.pointSize: 30
    }
}

page2.qml

import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12

Page {
    signal onButtonClicked(var buttonId, var buttonName)

    Component.onCompleted: {
        button1.clicked.connect(function() {
            onButtonClicked(1, "A");
        });
        button2.clicked.connect(function() {
            onButtonClicked(2, "B");
        });
        button3.clicked.connect(function() {
            onButtonClicked(3, "C");
        });
    }

    ColumnLayout {
        id: mybuttons
        anchors.fill: parent
        spacing: 5
        Button {
            id: button1
            Layout.fillWidth: true
            Layout.fillHeight: true
            text: "A"
        }
        Button {
            id: button2
            Layout.fillWidth: true
            Layout.fillHeight: true
            text: "B"
        }
        Button {
            id: button3
            Layout.fillWidth: true
            Layout.fillHeight: true
            text: "C"
        }
    }

到目前为止我尝试了什么：

1）我遇到了以下对理解组件很有用的来源style。这就是我Component.onCompleted:在代码中使用的原因。在触发按钮方面做得很好Page2。我认为我也可以对其他人使用相同的理念，但他们没有出现。

2）这个来源对我了解组件的属性很有用，特别是在示例中如何突出显示单击。我认为这是我能找到的最接近我正在做的事情。

3）深入挖掘我想要实现的目标我继续阅读官方文档，该文档似乎推动使用该属性onCurrentItemChanged，这可能是触发emit信号属性的一种选择。

更新

main.qml中的以下部分用于显示一旦用户触发三个按钮之一，然后在page1其上显示被单击的字母Button，实际上可以在点3)上看到它程序。

Component.onCompleted: {
        page2.onButtonClicked.connect(function(buttonId, buttonName) {
            page1.mytext.text = buttonId;
            page1.mytext.text = buttonName;
            mystackview.pop();
        });

这是连接到page2.qmlsignal上的，如下图：

signal onButtonClicked(var buttonId, var buttonName)

Button为什么我重新打开Page1我的应用程序后看不到QML？非常感谢您指出解决此问题的正确方向。

4

1 回答 1

1

正如我在评论中提到的，“打开对话框”按钮总是被堆栈视图隐藏。如果他们没有被隐藏，他们无论如何都需要一些标志来指示他们是否应该可见，基于在Page2.

与您的 MRE 的现有结构保持一致，这是它可以工作的一种方式。我已经将“打开对话框”按钮移到了，Page1因为这似乎是最有意义的，但它们也可以在某个单独的页面上，或者如果那里有一些允许这样做的布局，它们也可以合并到 main.qml 中。我还建立了一个信号/插槽连接Page1来触发Page2main.qml 中的负载（而不是直接尝试访问 main.qml 中的对象，这是不好的做法）。我还删除了文本标签Page1以简化代码。Page2代码保持不变，所以我不包括它。

main.qml

import QtQuick 2.12
import QtQuick.Controls 2.12

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("Conn")
    property Page1 page1: Page1 {}
    property Page2 page2: Page2 {}

    Component.onCompleted: {
        page1.selectDialog.connect(function()  {
            mystackview.push(page2);
        });

        page2.onButtonClicked.connect(function(buttonId, buttonName) {
            page1.dialogId = buttonId;
            mystackview.pop();
        });
    }

    StackView {
        id: mystackview
        anchors.fill: parent
        initialItem: page1
    }
}

Page1.qml

import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12

Page {

    property int dialogId: -1;

    signal selectDialog()

    ColumnLayout {
        anchors.fill: parent
        spacing: 5

        Button {
            id: button1
            text: "Select"
            onClicked: selectDialog()
            Layout.fillWidth: true
        }

        // These buttons should appear only after the user selects the choices on `Page2`
        Button {
            id: dialogA
            text: "Open Dialog A"
            visible: dialogId === 1
            Layout.fillWidth: true
        }
        Button {
            id: dialogB
            text: "Open Dialog B"
            visible: dialogId === 2
            Layout.fillWidth: true
        }
        Button {
            id: dialogC
            text: "Open Dialog C"
            visible: dialogId === 3
            Layout.fillWidth: true
        }
    }
}

在此处输入图像描述 在此处输入图像描述 在此处输入图像描述

于 2019-11-20T03:17:10.580 回答