1

Let us suppose I have a card made using Rectangle and I want to show buttons on top of it when clicked. I'm calling showMenu() function to do that and for buttons I'm using an ListView with dynamic ListModel. The problem with such is that the button gets added bellow the Rectangle instead of the top of it. The anchor is not updating after appending an item to the model. Here is my code

Item {
    width: 120
    height: 120
    Rectangle {
        id: card
        width: 50
        height: 100
        color: "pink"
        anchors.bottom: parent.bottom
        Item {
            id: rec
            width: 50
            anchors.bottom: parent.top    // This anchor is not updating after appending an item to the list.

            ListModel {
                id: menuListModel
            }

            Component {
                id: delegate
                Rectangle {
                    width: 120
                    height: 20
                    color: "blue"
                    Text {
                        anchors.fill: parent
                        anchors.centerIn: parent
                        text: commandText
                    }
                }
            }

            ListView {
                anchors.fill: parent
                model:menuListModel
                delegate: delegate
                interactive: false
            }
        }

        MouseArea {
            anchors.fill: parent
            onClicked: menuListModel.append({"commandText" : "Normal Summon"});
        }
    }
}
2
  • Can you post code that runs?
    – Mitch
    Jul 27, 2016 at 8:46
  • updated the example.
    – Vedanshu
    Jul 27, 2016 at 15:47

1 Answer 1

0

This is more or less a duplicate of this question. The Item needs a height. As mentioned in the answer to that question, you can add debug statements to the code when things like this happen. In this situation, you can also add a Rectangle as a child of the Item and make sure that it's visible:

Rectangle {
    anchors.fill: parent
    color: "transparent"
    border.color: "darkorange"
}

If it's not visible, you know that the problem lies with that (parent) item.

5
  • Adding height would solve the current example, but in my code the height is dynamic, so should I keep on updating the height each time an object is appended to the model ? Or is there any way the height of the ListView is updated from the top of it instead from the bottom ?
    – Vedanshu
    Jul 29, 2016 at 9:42
  • So the height of the item depends on the height of the ListView?
    – Mitch
    Jul 29, 2016 at 11:38
  • Yes height of the Item depends on the height of the ListView.
    – Vedanshu
    Jul 29, 2016 at 11:43
  • And the height of the ListView depends on the height of the Item. :p So, you need to give the Item a height.
    – Mitch
    Jul 29, 2016 at 12:43
  • If I add rec.height += 10; in onClicked before appending object the model, it's working correctly. But shouldn't the height be updated automatically.
    – Vedanshu
    Aug 4, 2016 at 4:07

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.