Lock children inside parent

Hykkel

Hi.

I'm trying to make a drop down animation. I face the problem that the child rectangle is showed on top, and hence outside the parent rectangle. Is it not possible to have the children "inside" the parent??

In the below code, the redRect is always visible. The animation works fine (except the fact that the red square is always shown).

@import QtQuick 2.0

Rectangle {
width: 100
height: 10

Behavior on height { NumberAnimation { easing.type: Easing.OutQuad; duration: 400 } }

function hide()
{
    height = 0;
}

function show()
{
    height = childrenRect.height

}

Rectangle {
    id: redSquare
    width: 50; height: 50
    color: "red"
}

}@

Hykkel

Solved this issue by adding a dummy rectangle that anchors to the bottom of the "dowp down" (in the qml file that uses the above "dropdown" file).

YES that's right - it now works :)

Adrien Leravat

Hi Hykkel,

If I understand right, what your are looking for is the "clip" property. It ensures that children are visible only inside parent surface.

@
import QtQuick 2.0

Rectangle {
clip: true
...
}@

Note that this clipping test costs CPU usage.

Regards

Hykkel

That was it!!

Thanks a lot... I sure did hate that dummy rectangle hack I made!