qt-quick-for-designers-1:positioning_elements
This is an old revision of the document!
Table of Contents
Positioning elements
Absolute positioning
- You can define the item's position and size relative to its parent:
- basic-positioners.qml
import QtQuick 1.0 Item { width: 400 height: 400 Image { source: "images/background.png" } Spaceship { id: spaceship x: 50 y: 60 } }
Relative positioning
- Anchors provide a way to position an item by specifying its relationship with other items.
- anchors-positioners.qml
import QtQuick 1.0 Item { width: 400 height: 400 Image { anchors.fill: parent source: "images/background.png" } Spaceship { id: spaceship anchors.verticalCenter: parent.verticalCenter anchors.horizontalCenter: parent.horizontalCenter } }
- Many ways to specify how an item is related to another:
anchors.right
,anchors.rightMargin
…
- more-anchors-positioners.qml
import QtQuick 1.0 Item { width: 400 height: 400 Image { anchors.fill: parent source: "images/background.png" } Spaceship { id: spaceship anchors.verticalCenter: parent.verticalCenter anchors.horizontalCenter: parent.horizontalCenter } Spaceship { id: anotherSpaceship scale: 0.5 anchors.top: spaceship.bottom anchors.right: spaceship.right anchors.rightMargin: 100 } }
qt-quick-for-designers-1/positioning_elements.1371857985.txt.gz · Last modified: 2013/06/21 23:39 by mithat