The height of the rectangle through the Loader = 0. How to Fix

vebmaster

height rectLoader = 0. Why? Tell me what is wrong?

import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.0

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Flickable {
        id: flic
        anchors.fill: parent
        contentWidth: wrapper.width
        contentHeight: wrapper.height
        ScrollBar.vertical: ScrollBar { }
        ScrollBar.horizontal: ScrollBar { }

        Column {
            id: wrapper
            spacing: 20
//                anchors.fill: parent
//                height: 1200;

            Rectangle {
                width: 300
                height: 300
                color: "blue"
            }
            Rectangle {
                id: rectB
                width: 300
                height: 300
                color: "black"
                MouseArea {
                    anchors.fill: parent
                    onClicked: console.log(rectLoader.height)
                }
            }
            Rectangle {
                id: rectLoader
                anchors.top: rectB.bottom
                anchors.bottom: butB.top
                height: pageLoader.height
                Loader {
                    id: pageLoader
                    source: "Page1.qml"
                }
            }
            Button {
                id: butB
                //height: pageItem.height
                text: "Закрыть"
            }
        }

    }
}

Page1.qml

import QtQuick 2.7

Item {
    id: pageItem
    height: pageColumn.height
    Column {
        id: pageColumn
        spacing: 30
        Text {
            text: "111"
            font.pointSize: 20
        }
        Rectangle {
            width: 100
            height: 400
            color: "green"
        }
        Rectangle {
            width: 100
            height: 400
            color: "red"
        }
    }
}

raven-worx

@vebmaster
try the following:

Item {
    id: pageItem
    height: pageColumn.implicitHeight

    ....
}

vebmaster

@raven-worx No, fail

qnope

I guess it is :

height: pageLoader.height

try

height:pageLoader.item.height

instead

vebmaster

Solution: Move the Loader of the Rectangle:

import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.0

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Flickable {
        id: flic
        anchors.fill: parent
        contentHeight: wrapper.height
        ScrollBar.vertical: ScrollBar { }
        ScrollBar.horizontal: ScrollBar { }

        Column {
            id: wrapper
            spacing: 20
            width: flic.width

            Rectangle {
                width: 300
                height: 300
                color: "blue"
            }
            Rectangle {
                id: rectB
                width: 300
                height: 300
                color: "black"
                MouseArea {
                    anchors.fill: parent
                    onClicked: console.log(rectLoader.height)
                }
            }
            Loader {
                id: pageLoader
                source: "Page1.qml"
            }
            Button {
                id: butB
                text: "Закрыть"
            }
        }

    }
}

Page1.qml

import QtQuick 2.7

Column {
    id: pageColumn
    spacing: 30
    Text {
        text: "111"
        font.pointSize: 20
    }
    Rectangle {
        width: 100
        height: 400
        color: "green"
    }
    Rectangle {
        width: 100
        height: 400
        color: "red"
    }
}