How to make QML component (widget) adjusts according to data

[Craig27]

I have a Widget as QML component in Qt Quick application which is to be used in various screens to display contents.

How can I use this particular QML component to adjust according to the items in it.

Any direction to achieve above requirement is highly appreciated

[Craig27]

Hi,
I have tried to implement the above requirement with ListView, but with hard coded drop-down items.
below is the code snippet

@Rectangle {
width:400;
height: 400;

Rectangle {
        id:comboBox
        property variant items: ["Go to Inbox", "View calendar", "RSS Feeds"]

        signal comboClicked;
        width: 400;
        height: 30;
        z: 100;
        smooth:true;

        Rectangle {
            id:chosenItem
            radius:4;
            width:parent.width;
            height:comboBox.height;
            color: "lightsteelblue"
            smooth:true;
            Text {
                anchors.top: parent.top;
                anchors.left: parent.left;
                anchors.margins: 8;
                id:chosenItemText
                text:"Menu";
                font.family: "Arial"
                font.pointSize: 14;
                smooth:true
            }

            MouseArea {
                anchors.fill: parent;
                onClicked: {
                    comboBox.state = comboBox.state==="dropDown"?"":"dropDown"
                }
            }
        }

        Rectangle {
            id:dropDown
            width:comboBox.width/4;
            height:0;
            clip:true;
            radius:4;
            anchors.top: chosenItem.bottom;
            anchors.margins: 2;
            color: "lightgray"

            ListView {
                id:listView
                height:500;
                model: comboBox.items
                currentIndex: 0
                delegate: Item{
                    width:comboBox.width;
                    height: comboBox.height;

                    Text {
                        text: modelData
                        anchors.top: parent.top;
                        anchors.left: parent.left;
                        anchors.margins: 5;

                    }
                    MouseArea {
                        anchors.fill: parent;
                        onClicked: {
                            comboBox.state = ""
                        }
                    }
                }
            }
        }


        states: State {
            name: "dropDown";
            PropertyChanges { target: dropDown; height:30*comboBox.items.length }
        }

        transitions: Transition {
            NumberAnimation { target: dropDown; properties: "height"; easing.type: Easing.OutExpo; duration: 1000 }
        }
    }
}@

But I would like to use this QML component in my project.
How can I populate the ListView items dynamically.

"Reference":http://stackoverflow.com/questions/9634897/qt-qml-dropdown-list-like-in-html

Thanks