qml 下拉菜单例子

在QML中，下拉菜单可以通过组合使用ListView和Popup来实现。下面是一个简单的下拉菜单示例：

import QtQuick 2.0

Rectangle {
    width: 200
    height: 40

    property string selectedOption: "Option 1"

    Text {
        text: selectedOption
        anchors.centerIn: parent
    }

    Popup {
        id: popup
        width: parent.width
        height: contentHeight

        ListView {
            id: listView
            anchors.fill: parent
            model: ["Option 1", "Option 2", "Option 3"]
            currentIndex: model.indexOf(selectedOption)
            highlight: Rectangle { color: "lightgray"; radius: 5 }
            delegate: Text {
                text: modelData
                padding: 5
                width: parent.width
                MouseArea {
                    anchors.fill: parent
                    onClicked: {
                        selectedOption = modelData
                        popup.close()
                    }
                }
            }
        }
    }

    MouseArea {
        anchors.fill: parent
        onClicked: popup.open()
    }
}

在上面的示例中，我们使用了Rectangle作为下拉菜单的按钮，并在其中添加了一个Text元素，用于显示当前选择的选项。当用户点击按钮时，弹出一个Popup，其中包含一个ListView，用于显示可选项列表。当用户选择一个选项时，我们将selectedOption属性设置为该选项并关闭弹出菜单。