[Interest] Best practices on pinch-zoomable item container with non-zoomable item attached

[Alexander Ivash]

I need pinch-zoomable item container with non-zoomable item container
attached to the bottom. Like this:

Item {
   id: item
   Item {
     id: zoomable
    }

   Item {
     id: nonzoomable
   }
}

(anchoring, geometry omitted for simplicity)

I see at least the following solutions:

1. Change 'scale' of the whole item (zoomable + non-zoomable), then
change 'scale' of non-zoomable to compensate parent scaling. It feels
a bit wrong so I'd like to avoid it. Also doing in this way leads to
some issues with anchoring non-zoomable item to zoomable one properly.

2. Change 'scale' of the zoomable part only. But in this case I need
to adjust x/y of 'item', otherwise scaling will always be happening
relatively top/left (and I need relatively to the center)

Is there better way to do it?

If there would be a way to center parent in child - I could anchor
'item' to the center of 'zoomable' and everything would work
magically. But such kinds of anchors are not supported.