[Interest] QML Loader component is not resized?

[ivan tkachenko]

On Saturday, January 8, 2022 1:14:14 PM MSK Alexander Dyagilev wrote:
> Hello,
> 
> I use Loader and it seems it's not resizing to its component's size.

Hi, I'll try to answer your question.

Loader attempts to resize itself and passes through implicit sizing of its 
item -- that much is true. But one important condition is that the item should 
be a QQuickItem*, which QtQuick.Controls.2/Popup, unfortunately, is not a 
subclass of.

Popup does have all the properties like width/height and margin/padding that 
make it look like an Item, but in fact it just doesn't inherit. As sad as it 
is, the Loader usecase that you found is not the only broken thing about the 
popups.

===========================================================

About your code style, I'd suggest

1) using modern & shorter syntax like

>    width = Qt.binding(() => item.width);

2) don't use imperative code at all, and use regular but conditional bindings 
instead:

>    width: item !== null ? item.width : undefined
>    height: item !== null ? item.height : undefined

No matter how I tried tweaking the condition, I'm still getting (although 
pretty harmless) binding loops. Currently I don't see how to avoid that, since 
width and height are indeed two separate properties updated one by one. 

Rather unfortunate (yet again), we can't bind Loader's implicit size manually, 
because those properties are redefined internally as read-only.

> // Invalid property assignment: "implicitHeight" is a read-only property:
> //        implicitWidth: item ? item.implicitWidth : 0
> //        implicitHeight: item ? item.implicitHeight : 0

===========================================================

Alternative route

Just wrap your Popup inside an Item, and bind their implicit & explicit sizes 
in both directions, if you wish so.

In this example I'm using sourceComponent instead of source URL, but it should 
be trivial to port between both variants.

>    Loader {
>        id: loader
>        anchors.centerIn: parent
>        sourceComponent: Component {
>            Item {
>                id: wrapper
>                implicitWidth: popup.implicitWidth
>                implicitHeight: popup.implicitHeight
>                MyPopup {
>                    id: popup
>                    width: wrapper.width
>                    height: wrapper.height
>                }
>            }
>        }
>    }

MyPopup.qml:

> import QtQuick 2.12
> import QtQuick.Controls 2.12
> 
> Popup {
>     modal: true
>     focus: true
>     visible: true
> 
>     implicitWidth: 200
>     implicitHeight: 200
> 
>     Label {
>       text: "TEST"
>     }
> }

Note: I'm declaring implicit size on the top-level components, so they could 
be reused in other code that includes them.

-- 
ivan (@ratijas)
-------------- next part --------------
A non-text attachment was scrubbed...
Name: signature.asc
Type: application/pgp-signature
Size: 833 bytes
Desc: This is a digitally signed message part.
URL: <http://lists.qt-project.org/pipermail/interest/attachments/20220109/e560eacb/attachment.sig>