Sizing

Our rectangle will fill its parent, so the size of the rectangle depends entirely on the size of its parent. Walking up the QML hierarchy, the component that contains the rectangle is theStackViewelement back in MasterView:

StackView {    id: contentFrame    initialItem: Qt.resolvedUrl("qrc:/views/SplashView.qml")}

Often, QML components are clever enough to size themselves based on their children. Previously, we had set our rectangle to a fixed size of 400 x 200. TheStackViewcould look at that and say “I need to contain a singleRectanglethat is 400 x 200, so I’ll make myself 400 x 200 too. Easy!”. We can always overrule that and set it to some other size using itswidthandheightproperties, but it can work out what size it wanted to be.

Back in scratchpad, create a newSizingDemo.qmlview and editmain.cppto load it on startup, just like we did withAnchorsDemo. EditSizingDemoas follows:

import QtQuick 2.9import QtQuick.Window 2.2
Window {    visible: true    width: 1024    height: 768    title...