Qt Quick 3D - Scene Effects Example

// Copyright (C) 2022 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts

Rectangle {
    id: root
    property string title: ""
    property bool isExpanded: true
    default property alias content: container.children
    color: "transparent"
    border.width: 2
    border.color: palette.alternateBase

    Layout.fillWidth: true
    implicitHeight: outsideLayout.implicitHeight

    ColumnLayout {
        id: outsideLayout
        width: parent.width
        Rectangle {
            id: sectionHeader
            Layout.fillWidth: true
            implicitHeight: 24
            color: palette.alternateBase

            RowLayout {
                anchors.verticalCenter: parent.verticalCenter
                Image {
                    fillMode: Image.PreserveAspectFit
                    sourceSize: Qt.size(titleText.implicitHeight, titleText.implicitHeight)
                    source: root.isExpanded ? "qrc:/images/TreeExpanded.png" : "qrc:/images/TreeUnexpanded.png"
                }

                Text {
                    id: titleText
                    Layout.fillWidth: true
                    text: root.title
                }
            }

            MouseArea {
                anchors.fill: parent
                onClicked: root.isExpanded = !root.isExpanded
            }
        }

        GridLayout {
            id: container
            Layout.margins: root.border.width * 2
            visible: root.isExpanded
            Layout.fillWidth: true
            columns: 2
            uniformCellWidths: true
        }

    }

}