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 the StackView element 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. The StackView could look at that and say “I need to contain a single Rectangle that 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 its width and height properties, but it can work out what size it wanted ...

Get End to End GUI Development with Qt5 now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.