如何将 QML 项分配给 QML 中的组件属性,然后在组件内使用该对象?

发布于 2024-10-17 21:06:46 字数 777 浏览 1 评论 0原文

我正在尝试创建一个 QML 对象,该对象充当其他对象的包装器。这是我的 QML 文件(Container.qml):

Item {
    property string label
    property Item control

    Row {
        Label {
            text: label
        }

        // Not sure how to display the control assigned to the control property
    }
}

我想要做的(在使用此组件的 QML 中)是这样的:

Container {
    label: "My Label"
    control: Textbox {
        text: "My Value"
    }
}

当输入该 QML 时,结果(在界面中)应该类似于该 QML 的输出:

Item {
    Row {
        Label {
            text: "My Label"
        }
        Textbox {
            text: "My Value"
        }
    }
}

这可能吗?当我尝试执行此操作时,在将项目分配给控件属性时出现“无法将对象分配给属性”。我已经搜索了 Qt 论坛并无情地用谷歌搜索了这个,但没有成功。如果有人知道答案,将不胜感激。

谢谢杰克

I'm trying to create a QML object that acts like a wrapper for other objects. Here's my QML file (Container.qml):

Item {
    property string label
    property Item control

    Row {
        Label {
            text: label
        }

        // Not sure how to display the control assigned to the control property
    }
}

What I would like to do (in my QML that consumes this component) is something like this:

Container {
    label: "My Label"
    control: Textbox {
        text: "My Value"
    }
}

When fed that QML the result (in the interface) should be something resembling the output from this QML:

Item {
    Row {
        Label {
            text: "My Label"
        }
        Textbox {
            text: "My Value"
        }
    }
}

Is this possible? When I try to do this I get "cannot assign object to property" when assigning an Item to the control property. I've searched the Qt forums and Googled this mercilessly, but no success. If anybody knows the answer it would be greatly appreciated.

Thanks

Jack

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

等往事风中吹 2024-10-24 21:06:46

有更好的解决方案:

/* MyObject.qml */

Rectangle {
    default property alias data /* name can be any */ : inner_space.data

    /* ... You can put other elements here ... */
    Item {
       id: inner_space

       /* ... Params ... */
    }
    /* ... You can put other elements here ... */
}

现在我们可以做我们想做的一切!

/* main.qml */

Rectangle {
    MyObject {
        Button {
             /* ... */
        }
    }
}

感谢用户 bobbaluba 建议使用 data 属性而不是 children.

There is much better solution:

/* MyObject.qml */

Rectangle {
    default property alias data /* name can be any */ : inner_space.data

    /* ... You can put other elements here ... */
    Item {
       id: inner_space

       /* ... Params ... */
    }
    /* ... You can put other elements here ... */
}

And now we can do all we want!

/* main.qml */

Rectangle {
    MyObject {
        Button {
             /* ... */
        }
    }
}

Thanks to user bobbaluba for suggesting to use the data property rather than children.

紙鸢 2024-10-24 21:06:46

您可以使用 Loader 元素动态加载项目,然后设置 ' control' 属性为 别名直接引用加载器的 sourceComponent 属性。

因此,您的 Container.qml 可能如下所示:

Item {
    property string label
    property alias control : loader.sourceComponent

    width: 200; height: 200

    Row {
        Label { text: label }
        Loader { id: loader }
    }
}

现在,当您将图形项分配给“control”属性时,加载器将自动显示它。

You can dynamically load items using the Loader element, and then set the 'control' property to be an alias that directly refers to the loader's sourceComponent property.

So your Container.qml could look like this:

Item {
    property string label
    property alias control : loader.sourceComponent

    width: 200; height: 200

    Row {
        Label { text: label }
        Loader { id: loader }
    }
}

Now when you assign a graphical item to the 'control' property, it will automatically be displayed by the Loader.

但可醉心 2024-10-24 21:06:46

您可以使用自定义属性为其他项目创建容器:

Item
{
    id: root

    property list<Item> rectList: [
        Rectangle
        {
            parent: root
        },
        Rectangle
        {
            parent: root
        },
        Rectangle
        {
            parent: root
        },
        Rectangle
        {
            parent: root
        }
    ]
}

请注意,矩形项目的父级是手动设置的,因此它们将是容器的可视子级。

您可以将它们评估为 javascript 数组

for ( var i = 0; i < root.rectList.length; i++ )
{
   var rect = root.rectList[i];
   rect.visible = true;
}

rect.rectList[1].visible = false;

You can create a container for other items using a custom property:

Item
{
    id: root

    property list<Item> rectList: [
        Rectangle
        {
            parent: root
        },
        Rectangle
        {
            parent: root
        },
        Rectangle
        {
            parent: root
        },
        Rectangle
        {
            parent: root
        }
    ]
}

Note that the parent of the Rectangle Items is set manually so they will be visual children of the container.

You can assess them as a javascript array

for ( var i = 0; i < root.rectList.length; i++ )
{
   var rect = root.rectList[i];
   rect.visible = true;
}

or

rect.rectList[1].visible = false;
南街女流氓 2024-10-24 21:06:46

使用 QML 已经大约一个月了,恐怕我不知道该怎么做。

最好的计划是找出控件(示例中的 Textbox)可能存在的所有可能情况,创建行中每个组件的实例,并在 Item< 上设置相应的状态/代码>。然后,状态将酌情使所需组件可见或不可见。

编辑

只是想。 (尚未尝试过,但请尝试一下!)在 ItemComponent.onCompleted: 处理程序中,尝试调用 control.createObject(rowID)< /code> 其中 rowID 是您的 Row 对象的 id(您希望该对象成为 control 的父级) >)。

Been using QML for about a month now, no idea really how to do this I'm afraid.

Best plan is to figure out all possible things that the control (Textbox in your example) could be, create an instance of each component in your row, and set a corresponding state on your Item. The state would then take care of making the desired component visible or invisible as appropriate.

Edit

Just thought. (Haven't tried this but give it a go!) In your Item's Component.onCompleted: handler, try calling control.createObject(rowID) where rowID is an id for your Row object, (which you want to be the parent of control).

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文