Выпадающий подпункт в меню при нажатии. Разработка под QML

меню, qml, выпадающий пункт меню

ColumnLayout
{
    Rectangle
    {
        id: menuItem1
        Layout.alignment: Qt.AlignCenter
        Layout.fillWidth: true
        anchors.top: parent.top
        height: dp(30)
        Text
        {
            id: textItem1
            anchors.fill: parent
        }
        MouseArea
        {
            anchors.fill: parent
            onPressed: parent.color = "lightblue"
            onReleased: parent.color = "red"
        }
    }
    //контент который должен появится при нажатии на пункт меню
    Rectangle 
    {
        id: rectMenuContent1
        Layout.alignment: Qt.AlignCenter
        Layout.fillWidth: true
        anchors.top: menuItem1.bottom
        Loader 
        {
            id: loader1
            anchors.fill: parent
            source: "menucontent1.qml" //Подгружаемый внешний файл с пунктами настроек
        }
    }
    //
    Rectangle
    {
        id: menuItem2
        Layout.alignment: Qt.AlignCenter
        Layout.fillWidth: true
        anchors.margins: dp(3)
        anchors.top: rectMenuContent1.bottom
        height: dp(30)
        Text
        {
            id: textItem2
            anchors.fill: parent
        }
    }
 
    Rectangle
    {
        id: menuItem3
        Layout.alignment: Qt.AlignCenter
        Layout.fillWidth: true
        anchors.margins: dp(3)
        anchors.top: menuItem2.bottom
        height: dp(30)
        Text
        {
            id: textItem3
            anchors.fill: parent
        }
    }
 
}

Рекомендуем хостинг TIMEWEB

Стабильный хостинг, на котором располагается социальная сеть EVILEG. Для проектов на Django рекомендуем VDS хостинг.

Это неполное решение, но работает.

main.qml

Window {
    visible: true
    width: 640
    height: 480
 
    Flickable{
        anchors.fill: parent
        contentHeight: controlsColumn.height
        Column{
            id: controlsColumn
            spacing: 5
            anchors{
                left: parent.left
                right: parent.right
                margins: 5
            }
            MyItem{ text: "MyItem1"; source: "Controll/one.qml"}
            MyItem{ text: "MyItem2"; source: "Controll/two.qml"}
            MyItem{ text: "MyItem3"; source: "Controll/three.qml"}
 
        }
    }
}

MyItem.qml

import QtQuick 2.0
 
Rectangle{
    property alias text: textItem.text
    height: container.visible ? columns.height+5 : 30
    property alias source: loader.source
    anchors { left: parent.left; right: parent.right }
    color: "#53d769"
    clip: true
    Column{
        id: columns
        anchors.left: parent.left
        anchors.right: parent.right
        Text {
            x: 5
            id: textItem
            height: 30
            verticalAlignment: Text.AlignVCenter
        }
        Rectangle{
            id: container
            visible: false
            color: Qt.darker("#53d769", 1.2)
            anchors { left: parent.left; right: parent.right; margins: 5}
            height: loader.height+10
            Loader{
                y: 5
                anchors { left: parent.left; right: parent.right; margins: 5}
                id: loader
                source: loadCmp
            }
        }
 
    }
    Behavior on height {
        NumberAnimation { duration: 100 }
    }
 
    MouseArea{
        height: 30
        anchors { left: parent.left; right: parent.right }
        onClicked: {
            container.visible = !container.visible
        }
 
    }
}

listcontroll.zip

Это неполное решение но работает

А вы пробовали собрать?
И как понять что это не полное решение?
У меня почему то при сборке с этим кодом ошибка [main.o] Error2 вылетает(

мздец
1 способ (без сборки)
Открыть файл ListControll.qmlproject в QtCreator-ре и запустить проект

2 способ (без сборки)
Запустить файл main.qml c помощью qmlscene.exe
например:
d:\temp\Qt\5.6\msvc2015_64\bin\qmlscene.exe main.qml

3 способ
Тот которым пользуетесь вы
[main.o] Error2 никакого отношения к qml не имеет

У меня почему то при сборке с этим кодом ошибка [main.o] Error2 вылетает(

Чаще всего такая ошибка появляется из-за мусорных недособранных выходных файлов.
Обычно помогает очистка проекта и его пересборка.

а файлы скопировал
Controll/one.qml
Controll/two.qml
Controll/three.qml

Это понятно. Я посмотрел ваш пример, и как написал, что в вашем случае панель подменю раскрывается на высоту того контента, что передается с другого файла. Но у меня при тех же настройках он не открывается настолько.

Чаще всего такая ошибка появляется из-за мусорных недособранных выходных файлов.
Обычно помогает очистка проекта и его пересборка.

Ошибка оказалась в том, что я сделал копию каталога с проектом, и в нем оказалась часть названия на русском. Удалил русскую надпись, и все норм стало).

скорее всего rectangle имеет некорректную высоту.

rectangle.height: ColumnLayout.height

Возможно снова с наследованием и якорями

Я немного прикопаюсь, но в данном случае наследования не происходит. Родительский и дочерний объекты здесь подразумеваются в том плане, что дочерний объект вложен в родительский. Это снова отсылка к древовидной json-структуре.