Question

我找不到使用加载程序填充tabview中的选项卡的方法。当它在TabView之外时，加载程序工作正常（即，如果我删除mainTrial.qml顶部的多行注释字符，并且Loader plus Connections位于顶部。但是如果我将Loader移动到子行中一个选项卡，我收到错误“无法为一个单一属性分配多个值。我也不能使用menuLoader.source或column1.menuLoader.source或其他变体来解决TabView之外的Loader。这是主文件。（包含定义信号的其他两个文件，以便您可以看到信号有效。）我做错了什么？

编辑:(排列和组合的良好法则）我发现如果我做了连接声明，选项卡上的Loader的子节点，问题就会消失。我将在选项卡上分配一个“值” - 作为Loader，现在我可以为每个选项卡加载一个qml项目。

// mainTrial

import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Layouts 1.1 


Item {
    id: trial
    width: 360
    height: 360
    ColumnLayout {
        id: column1
        spacing:150
        Item {Layout.fillHeight: true}
        TabView {
            id: tabPages
            Tab {
                id: welcomePage
                title: "Welcome"
                // /*
                Loader{
                    id: menuLoader
                    source: "mainTrial1.qml"
                    anchors.top: parent.top
                    Connections {
                        id: menuConnection
                        ignoreUnknownSignals: true
                        target: menuLoader.item
                        onMainTrial3: {
                            menuLoader.source = "mainTrial3.qml"
                            console.log("originated from " + origin)
                        }
                        onMainTrial1: {
                            menuLoader.source = "mainTrial1.qml"
                            console.log("originated from " + origin)
                        }
                    }
                }        
            }
            Tab {
                id: statusPage
                title: "Status"
            }
        }
    }
}

// mainTrial1（带一个信号定义）

此文件定义用于加载下一个qml对象的信号之一。我把它包含在这里，以便您可以看到信号有效。）

import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Layouts 1.1

Item {
    id: page1
    property string origin: "Hello"
    signal mainTrial3(string origin)
    ColumnLayout {
        spacing: 15
        Rectangle {
            width: 100
            height: 62
            color: "red"

            MouseArea {
                anchors.fill: parent
                onClicked: {
                    mainTrial3("origin = from MouseArea")
                }
            }
        }

        Button {
            text: "Sorting and scanning"
            onClicked: {
                mainTrial3(origin = "from Button")
            }
        }
    }
}

// mainTrial3（使用其他信号定义）

此文件定义用于重新加载上一个qml对象的另一个信号。我把它包含在这里，以便你可以看到当点击矩形时两个信号都有效。

import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Layouts 1.1

Item {
    id: page3
    property string origin: "Hello"
    signal mainTrial1(string origin)
    GridLayout {
        columnSpacing: 5
        rowSpacing: 5
        columns: 1
        Rectangle {
            width: 100
            height: 62
            color: "blue"

            MouseArea{
                anchors.fill: parent
                onClicked: {
                    mainTrial1(origin = "from MouseArea1")
                }
            }
        }
        Rectangle {
            width: 100
            height: 62
            color: "blue"

            MouseArea{
                anchors.fill: parent
                onClicked: {
                    mainTrial1("from MouseArea2")
                }
            }
        }
    }
}

Answer 1

好的，所以我拿了你的代码，使用了一下，然后自定义其余部分来加载一个标签，以便更容易地讨论它。这不完全是你发布的内容，但它应该告诉你如何：

在标签内点击某些内容时收到信号。
加载标签的位置和方式。

有了这个，你应该有进一步自定义和添加两个，三个等标签的坚实基础，并根据我的例子中的信号动态地改变它们。

重要的是，Tab本身是Loader，因此无需定义内部Loader。接下来我还没有完全体验过QML（QWidget更像是我的事），但是你使用的Connections似乎会导致一些问题，我不确定它们是否完全需要，所以我从我的例子中删除它们

在我的示例中，我只是在选项卡中加载单个QML文件，并在单击刚刚加载的选项卡中的蓝色矩形或红色矩形时发送信号。

您将能够在控制台中看到打印输出。我在信号处理程序中留下了评论，然后您可以更改source的{{1}}并动态加载下一个Tab。

享受！

<强> TabViewTest.qml

Tab

<强> RectanglesTab.qml

import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Layouts 1.1


Item {
    id: tabViewTest
    width: 360
    height: 360

    TabView {
        id: tabView
        width: parent.width
        height: parent.height

        Tab {
            title: "Welcome"
            id: dynamicTab
            anchors.top: parent.top

            // [1] Specify the source URL to load the content.
            source: "RectanglesTab.qml"

            // [2] Define a signal within the Tab that will
            // be connected to the 'contentsClicked' signal
            // in each tab QML file.
            signal tabContentsClicked( string rectColor )

            // [3] Implement the signal handler.
            onTabContentsClicked: {
                console.log( "Clicked on a", rectColor, "rectangle." )

                // [4] Now that the user has clicked somewhere within the tab
                // you could optionally the source or sourceComponent here like
                // the comment below.
                //
                // Just make sure it also has a signal called 'contentsClicked'
                //
                // dynamicTab.source = "someOtherTab.qml"
            }

            onLoaded: {
                console.debug( "Loaded", source );

                // [4] Here's the key action, connect the signal 
                // 'contentsClicked' to our signal 
                // 'tabContentsClicked' from the loaded item 
                // i.e. RectanglesTab.qml
                dynamicTab.item.contentsClicked.connect(tabContentsClicked)
            }
        }

        Tab {
            id: statusTab
            title: "Status"
        }
    }
}

qml如何在tabview中使用loader

1 个答案: