[Qt-qml] Layout question

[John Temples]

On Tue, 20 Sep 2011, Pris Matic wrote:

> You can get the number of elements in the column using the
> 'ColumnID.children.length' property. Then you should be freely add and
> remove buttons and maintain your spacing:

Thanks, that does exactly what I want.

> ie. change the Item to:
> Item
> {
> height: parent.height/parent.children.length;
> width: 100;
> Rectangle
> {
> id: rect1;
> height: 40;
> width: 100;
> color: "blue";
> anchors.verticalCenter: parent.verticalCenter;
> }
> }
>
> -Pris
>
> On Tue, Sep 20, 2011 at 1:18 PM, John Temples <qt-qml at xargs.com> wrote:
>
>> On Tue, 20 Sep 2011, Bo Thorsen wrote:
>>
>>> No, I actually meant the exact opposite way :)
>>>
>>> Item {
>>>   anchors.centerIn: parent
>>>
>>>   Column {
>>>     Button {
>>>     ...
>>>   }
>>> }
>>
>> This is closer to what I'm looking for; the buttons are centered in the
>> column, but they're adjacent to each other.  The code that Pris posted
>> actually does what I want (provides even spacing between the buttons),
>> but I'd prefer not to have to use a "parent.height/3" construct to
>> simplify maintenance if I add or remove buttons from the Column.  Is
>> there any way around that?
>>
>>>> import QtQuick 1.0
>>>>
>>>> Column
>>>> {
>>>> height: 300;
>>>> width: 100;
>>>>
>>>> Item
>>>> {
>>>> height: parent.height/3;
>>>> width: 100;
>>>> Rectangle
>>>> {
>>>> id: rect1;
>>>> height: 40;
>>>> width: 100;
>>>> color: "blue";
>>>> anchors.verticalCenter: parent.verticalCenter;
>>>> }
>>>> }
>>>> Item
>>>> {
>>>> height: parent.height/3;
>>>> width: 100;
>>>> Rectangle
>>>> {
>>>> id: rect2;
>>>> height: 40;
>>>> width: 100;
>>>> color: "blue";
>>>> anchors.verticalCenter: parent.verticalCenter;
>>>> }
>>>> }
>>>> Item
>>>> {
>>>> height: parent.height/3;
>>>> width: 100;
>>>> Rectangle
>>>> {
>>>> id: rect3;
>>>> height: 40;
>>>> width: 100;
>>>> color: "blue";
>>>> anchors.verticalCenter: parent.verticalCenter;
>>>> }
>>>> }
>>>> }
>>>>
>>>> -Pris
>>>>
>>>> On Tue, Sep 20, 2011 at 2:52 AM, John Temples <qt-qml at xargs.com
>>>> <mailto:qt-qml at xargs.com>> wrote:
>>>>
>>>>     Bo,
>>>>
>>>>     On Tue, 20 Sep 2011, Bo Thorsen wrote:
>>>>
>>>>    > Den 20-09-2011 08:04, John Temples skrev:
>>>>    >> Say I have a Column that contains three buttons.  Is there a way
>> to
>>>>    >> have the three buttons be equally spaced within the Column, and
>>>>     remain
>>>>    >> equally spaced as the Column's height changes?  The buttons
>>>>     shouldn't
>>>>    >> resize as the Column changes size.
>>>>    >
>>>>    > The easiest way to do this is with an item between the buttons
>>>>     and the
>>>>    > column:
>>>>    >
>>>>    > Item {
>>>>    >   anchors.centerIn: parent
>>>>    >
>>>>    >   // buttons here...
>>>>    > }
>>>>
>>>>     I tried this:
>>>>
>>>>           Column {
>>>>               Item {
>>>>                   anchors.centerIn: parent
>>>>
>>>>                   Button {
>>>>                       text: "One"
>>>>                   }
>>>>                   Button {
>>>>                       text: "Two"
>>>>                   }
>>>>                   Button {
>>>>                       text: "Three"
>>>>                   }
>>>>               }
>>>>           }
>>>>
>>>>     But I get: "QML Column: Cannot specify top, bottom, verticalCenter,
>>>>     fill or centerIn anchors for items inside Column."  And the buttons
>>>>     all appear on top of each other.

--
John W. Temples, III