Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Item in a Column, position problem



  • Hi all,
    I have a column like this:
    @
    ...
    ...
    Column
    {
    anchors.fill: parent
    Text
    {
    text: "aaaa"
    anchors.horizontalCenter: parent.horizontalCenter
    }
    Text
    {
    text: "bbbb"
    anchors.horizontalCenter: parent.horizontalCenter
    }
    Text
    {
    text: "cccc"
    anchors.horizontalCenter: parent.horizontalCenter
    }
    }
    ...
    ...
    @

    and when running I get this:
    @
    aaaa
    bbbb
    cccc
    @

    now if I use Item:
    @
    ...
    ...
    Column
    {
    anchors.fill: parent
    Text
    {
    text: "aaaa"
    anchors.horizontalCenter: parent.horizontalCenter
    }
    Text
    {
    text: "bbbb"
    anchors.horizontalCenter: parent.horizontalCenter
    }
    Item
    {
    Text
    {
    text: "cccc"
    anchors.horizontalCenter: parent.horizontalCenter
    }
    }
    }
    ...
    ...
    @

    I get:

    @
    aaaa
    bbbb
    @
    and "cccc" is over "aaaa" .

    It seems like "cccc" isn't positioned after "bbbb" in the column.



  • Now I tried with:
    @
    ...
    ...
    Column
    {
    anchors.fill: parent
    Text
    {
    id: aaaa
    text: "aaaa"
    anchors.horizontalCenter: parent.horizontalCenter
    }
    Text
    {
    id: bbbb
    text: "bbbb"
    anchors.horizontalCenter: parent.horizontalCenter
    }
    Item
    {
    width: parent.width
    height: bbbb.height
    Text
    {
    text: "cccc"
    anchors.horizontalCenter: parent.horizontalCenter
    }
    }
    }
    ...
    ...

    @

    and I get the right column:
    @
    aaaa
    bbbb
    cccc
    @

    should it be a bug?



  • I had this issue too, and its looks like a bug for me since even if the size of the third item is 0 in your first example it should be positioned just after "bbbb".

    Here is another example that demonstrates this bug :
    @
    ...
    ...
    Column
    {
    anchors.fill: parent
    Text
    {
    text: "aaaa"
    anchors.horizontalCenter: parent.horizontalCenter
    }
    Item
    {
    Text
    {
    text: "bbbb"
    anchors.horizontalCenter: parent.horizontalCenter
    }
    }
    Text
    {
    text: "cccc"
    anchors.horizontalCenter: parent.horizontalCenter
    }
    }
    ...
    ...
    @

    The behavior will be : "bbbb" over "aaaa"
    But I would expect it to be : "bbbb" after "aaaa" and under "cccc"



  • I don't think it is a bug.
    The Item inside the Column doesn't give it the width and height. So x, y of Item should be aligned with Column's. The Item's child Text anchors to its parent, but the parent doesn't has a width size to let it be on the center of parent's width.
    So the resolve will be like below :
    @
    bb aaaa
    cccc
    @
    Text element of bbbb present wrong size and wrong position.



  • [quote author="jackyang" date="1324518350"]I don't think it is a bug.
    The Item inside the Column doesn't give it the width and height. So x, y of Item should be aligned with Column's. The Item's child Text anchors to its parent, but the parent doesn't has a width size to let it be on the center of parent's width.
    So the resolve will be like below :
    @
    bb aaaa
    cccc
    @
    Text element of bbbb present wrong size and wrong position.[/quote]

    Why doesn't Item take its child size?



  • [quote author="jackyang" date="1324518350"]I don't think it is a bug.
    The Item inside the Column doesn't give it the width and height. So x, y of Item should be aligned with Column's. The Item's child Text anchors to its parent, but the parent doesn't has a width size to let it be on the center of parent's width.
    So the resolve will be like below :
    @
    bb aaaa
    cccc
    @
    Text element of bbbb present wrong size and wrong position.[/quote]

    I agree for the horizontal alignment but I think the problem here is just relative to the positionning on the vertical axe. So even it the Item doesn't have a height size it should positioned like:

    @
    aaaa
    bb cccc
    @



  • [quote author="Luca" date="1324540304"]
    [quote author="jackyang" date="1324518350"]I don't think it is a bug.
    The Item inside the Column doesn't give it the width and height. So x, y of Item should be aligned with Column's. The Item's child Text anchors to its parent, but the parent doesn't has a width size to let it be on the center of parent's width.
    So the resolve will be like below :
    @
    bb aaaa
    cccc
    @
    Text element of bbbb present wrong size and wrong position.[/quote]

    Why doesn't Item take its child size?
    [/quote]

    The size of an Item and its contents is not linked by default.

    You can achieve this with the childrenRect property like that :

    @
    ...

                Item
                {
                    width: childrenRect.width
                    height: childrenRect.height
    
                    Text
                    {
                        text: "bbbb"
                    }
                }
    

    ...
    @

    The size of the item is then bound to the size of its content.


Log in to reply