Qml 代表一个单独的文件答案

【问题标题】：Qml Delegate on a separate fileQml 代表一个单独的文件
【发布时间】：2019-05-06 06:22:05
【问题描述】：

我有一个模仿我真实应用的最小应用程序。我有一个带有 listview 列表模型和委托在同一个文件中的主 qml 窗口：

Window {
visible: true
width: 640
height: 480
title: qsTr("Hello World")

Component{
    id:deleg
    CheckBox{
        id:chk1
        contentItem: Text {
                id: txt
                anchors.left : parent.indicator.right
                anchors.leftMargin: 10
                anchors.verticalCenter: parent.verticalCenter
                text: dataname
                color: "blue"
            }}}

ListModel {
    id: mod
    ListElement{
        dataname :'here'
    }
    ListElement{
        dataname : 'there'
    }
}
ListView{
    id: view
    width: 200
    height:100
    anchors.left: parent.left
    anchors.top: parent.top
    model: mod
    delegate: deleg//CheckDelegate {}
}    }

main.cpp 只加载那个 qml 文件，就像一个由 Qtcreator 创建的标准空 Qt Quick 应用程序。

这将显示 2 个带有蓝色文本的复选框，好吧。现在，如果我将委托的代码放在一个名为 ChkDelegate 的新 qml 文件中，并将列表视图委托替换为对 ChkDelegate 的调用（如上面的评论），我面临 1 个问题，没有文本显示，我理解，因为 dataname 没有解决。我试过在括号中使用链接，比如

CheckDelegate { txt : dataname }

但我无法访问 txt 属性，并且 Component 不允许在其中放置额外的属性别名。我该如何解决？谢谢，

【问题讨论】：

标签： qt qml

【解决方案1】：

首先我不会使用 CheckDelegate，因为它是默认项目，我将把名称更改为 MyCheckDelegate。解决问题认为 MyCheckDelegate 是一个组件，因此它必须是通用的，此外，当它被覆盖时，您必须封装，因此您不应该使用 dataname 而是使用相同的控件，因为 id 具有范围，通常您应该创建一个属性获取外部信息并更新内部元素，但在这种情况下，我们将利用 CheckBox 的 text 属性：

MyCheckDelegate.qml

import QtQuick 2.0
import QtQuick.Controls 2.4

CheckBox{
    id:control
    contentItem: Text {
        id: txt
        anchors.left : parent.indicator.right
        anchors.leftMargin: 10
        anchors.verticalCenter: parent.verticalCenter
        color: "blue"
        text: control.text
    }
}

*.qml

// ...
delegate: MyCheckDelegate{
    text: dataname
}
// ...

【讨论】：

谢谢，它有效！我什至不知道 CheckDelegate 的存在。在这种情况下，我有机会摆脱 Component “top” 元素。但是当我的代表由更多项目组成时？除了将组件放在顶部之外，我别无选择，并且不允许在其上使用任何属性...
@claudejoliat 您不必使用组件，您必须使用项目并在其中通过自定义别名或属性公开属性：Item{ id: root; property int h: 10; property alias mytxt: id_txt.text Text {id: id_txt; height: root.h} ... }
@claudejoliat - 委托总是只有一个根元素，它嵌套的数量与它的声明方式无关。如果您只需要该委托在一个地方，您既不需要Component 也不需要单独的文件，您可以直接将一个对象放在那里，例如delegate: Rectangle { width: 20; height: 20 }。如果委托很大并且您不想阻塞代码，或者如果您还需要以声明方式实例化该对象，则只有单独的文件才有意义。即使没有专门的文件，也可以重用委托。

【解决方案2】：

CheckBox 已经有一个text 属性，因此您可以从具有可见性的范围进行绑定：

  delegate: CheckDelegate { text: dataname }

在您的 Text 元素中，您可以绑定到该元素：

text: chk1.text

此外，将组件命名为与库存 QML 组件相同的名称是一个非常糟糕的主意，因为这会构成命名冲突。您必须 import 库存 QML 模块 as Identifier 才能解决它，这并不理想。并且库存 QML 组件似乎优先于用户定义的组件，但即使它们没有，它仍然不是理想的。因此，当您实例化 CheckDelegate 时，您创建的不是您定义的那个，而是 Qt 定义的那个。

【讨论】：