Question

我想创建自定义组合框。所以我去了一个简单的项目，这是一个带有鼠标区域和文本的矩形。我的想法是根据字符串数组中的值绘制其中的多个。这是我目前为该项目的代码：

Item {

    signal itemSelected(int id);

    property int vmItemIndex: 0;
    property alias itemBody: ibody;

    Rectangle{

        id: ibody;
        property alias itemMouseArea: imouseArea;
        property alias itemText: itext;

        Text{
            id: itext
            anchors.centerIn: parent
        }

        MouseArea {
            id: imouseArea
            anchors.fill: parent
            onClicked: itemSelected(vmItemIndex);
        }

    }




}

acutual组合框

Item {

    property int vmWidth: 300;
    property int vmHeight: 50;
    property int vmCurrentIndex: 0;
    property var vmItemTexts: ["Item 1", "Item 2", "Item 3"];
    property string vmBackColor: "#ff0000";

    VMComboBoxItem {
        id: main;
        itemBody.itemText.text: vmItemTexts[vmCurrentIndex];
        itemBody.width: vmWidth
        itemBody.height: vmHeight
        itemBody.color: vmBackColor
    }

}

Hoewever引擎加载失败告诉我它无法访问itemText。那么我做错了什么？

Answer 1

我认为问题在于，在VMComboBoxItem组件中，您将内部Rectangle公开为属性。有一些hint about this in the Qt documentation。

您可以做的是直接在您的＆＃34; root＆＃34;中公开所选属性。 VMComboBoxItem中的项目：

import QtQuick 2.0

Item {

    signal itemSelected(int id);

    property int vmItemIndex: 0;
    property alias itemBody: ibody;

    // Expose the "text" property directly:
    property alias text: itext.text

    Rectangle{

        id: ibody;
        property alias itemMouseArea: imouseArea;
        property alias itemText: itext;

        Text{
            id: itext
            anchors.centerIn: parent
        }

        MouseArea {
            id: imouseArea
            anchors.fill: parent
            onClicked: itemSelected(vmItemIndex);
        }
    }
}

然后使用您的组件在QML代码中设置此属性：

import QtQuick 2.0

Item {

    property int vmWidth: 300;
    property int vmHeight: 50;
    property int vmCurrentIndex: 0;
    property var vmItemTexts: ["Item 1", "Item 2", "Item 3"];
    property string vmBackColor: "#ff0000";

    VMComboBoxItem {
        id: main;
        itemBody.width: vmWidth
        itemBody.height: vmHeight
        itemBody.color: vmBackColor

        // Set Text property directly:
        text: vmItemTexts[vmCurrentIndex];
    }    
}

通常最好只公开组件中的选定属性，因为这会缩小组件公开的界面（如果您需要重构代码，这反过来会更容易）。

如何在QML中访问子组件

1 个答案: