[Qt-qml] Layout question

[Bo Thorsen]

Den 20-09-2011 09:51, Pris Matic skrev:
> I think what Bo meant was that you can wrap each button by an Item
> component:

No, I actually meant the exact opposite way :)

Item {
   anchors.centerIn: parent

   Column {
     Button {
     ...
   }
}

This is a generic pattern in QML. When you want to center something, put 
an item around it and place that item in the center of the parent.

The item will resize to the contents automatically, so you don't need 
any anchors on the item, column or buttons.

Bo.

> 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
>     _______________________________________________
>     Qt-qml mailing list
>     Qt-qml at qt.nokia.com <mailto:Qt-qml at qt.nokia.com>
>     http://lists.qt.nokia.com/mailman/listinfo/qt-qml
>
>
>
>
>
> _______________________________________________
> Qt-qml mailing list
> Qt-qml at qt.nokia.com
> http://lists.qt.nokia.com/mailman/listinfo/qt-qml


Bo Thorsen,
Fionia Software.

-- 

Expert Qt and C++ developer for hire
Contact me if you need expert Qt help
http://www.fioniasoftware.dk