菜单元素的 ListView 信号和槽

我正在尝试使用自定义元素实现某种自定义菜单。最终目标是创建某种带有文本和图标的弹出菜单。但在创作过程中我遇到了一些问题。我可以展示两个主要问题：

1. 有一个带有标题的奇怪菜单元素Hello world在第一个位置（看起来像是读取应用程序窗口的标题）：

2. 有时我会遇到类似的错误qrc:/BreezeQuickMenu.qml:45: TypeError: Property 'clicked' of object QQuickListView(0x1120830) is not a function

这是我的实际代码：

main.qml

import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Window 2.2

ApplicationWindow {
    title: qsTr("Hello World")
    width: Screen.width
    height: Screen.height
    visible: true
    id: win
    color: brPalette.normalBackground
BreezeQuickMenu{
    id: brMenu
    x: 490
    y: 199
    width: 128
    height: 256
    palette: brPalette
    menuFont.pointSize: 16
    BreezeQuickMenuItem{
        title: "Item 1"
        onClicked: mbox.show()
    }
    BreezeQuickMenuItem{
        title: "Item 2"
    }
    BreezeQuickMenuItem{
        title: "Item 3"
    }
  }
}

微风QuickMenu.qml

import QtQuick 2.4

Item {
    id: root
    property BreezeQuickPalette palette: BreezeQuickPalette
    property alias currentIndex: menuList.currentIndex
    property font menuFont
    property bool menuVisible: false
    implicitWidth: 128
    implicitHeight: menuList.height
    ListView{
        id: menuList
        anchors.fill: parent
        model: root.children
        clip: true
        delegate: Component {
            id: menuItem
            Rectangle {
                id: menuElement
                property bool isCurrentItem: ListView.isCurrentItem
                anchors {
                    left: parent.left
                    right: parent.right
                }
                color: palette.normalBackground
                height: menuText.font.pixelSize*1.2
                Text {
                    id: menuText
                    anchors.fill: parent
                    text: title
                    color: palette.normalText
                    font: menuFont
                }
                MouseArea {
                    anchors.fill: parent
                    hoverEnabled: true
                    onClicked: {
                        menuList.currentIndex = index
                        menuList.model[index].clicked()
                    }
                }
            }
        }
    }
}

微风QuickMenuItem.qml

import QtQuick 2.4

Item {
    id: root
    property string title: "Menu Element"
    signal clicked
}

正如您所看到的，我正在尝试使用自己的信号来实现菜单列表和菜单项。我有两个问题：

• 我怎样才能正确地摆脱使用父元素的标题属性，因为我需要读取子元素的标题属性

• 在菜单元素中使用信号和槽以避免上述错误的正确方法是什么？

请帮助我理解。完整的项目可以在这里拉：

git clone git://git.code.sf.net/p/breezequick/code breezequick-code

问题与signal与其声明有关。信号总是被声明为函数：带有签名。换句话说，一个signal不带参数的形式为

signal <signal_name>()

这也是您收到错误的原因“is not a function除此之外，信号/信号处理程序的使用是正确的。无论如何，仔细阅读文档不会有什么坏处。这一页详细阐述了论点。

谈到另一个问题，您做出了错误的假设：组件内声明的任何内容is的一部分children组件本身。在这里你声明了一个BreezeQuickMenu有一个孩子ListView。当你使用它并添加BreezeQuickMenuItems，您将它们添加到same设置为ListView属于.最后你有four中的元素children财产。另外，通过添加ListView to itself通过model你把事情搞砸了，以至于渲染了一个完全不相关的字符串。

有几种方法可以处理Items作为视图的模型成员，包括VisualItemModel并使用对象实例化为模型。然而，通过浏览代码，很明显您想要定义一个以声明方式添加菜单项的组件。使用children在这种情况下是不够的。您还需要default财产：

对象定义可以有一个默认属性。默认属性是如果一个对象是在另一个对象的定义中声明的，则为其赋值的属性而不将其声明为特定属性的值。

因此您可以定义default为您的财产BreezeQuickMenu并利用它来获得所需的children为您的清单。常见的方法如下（代码简化）：

import QtQuick 2.4

Item {
    id: root
    property BreezeQuickPalette palette: BreezeQuickPalette
    property alias currentIndex: menuList.currentIndex

    // default declaration  (1)
    default property alias contents: addItem.children

    // Item to which the inner declared meantime will belong  (2)
    Item {
        id: addItem
    }

    property font menuFont
    property bool menuVisible: false

    implicitWidth: 128
    implicitHeight: menuList.height
    ListView{
        id: menuList
        anchors.fill: parent
        model: contents                 // usage of the default property  (3)
        clip: true
        delegate: Rectangle {
            // your current delegate code
        }
    }
}

基本思想是还利用财产alias：基本上在（1）中我们是说“所有的Items 内声明BreezeQuickMenu自动地children of addItem这是一个内部声明的Item（2）。这样一来ListView是分开的，而所有的BreezeQuickMenuItem聚集在一起，在addItem children财产。此时，使用相同的内容就足够了children财产作为model(3) 对于ListView就是这样。