基本代碼如下:
import QtQuick 2.2
import QtQuick.Controls 1.1
Image
{
id: root
source: "background.png"
}
這個是使用給定圖形填充背景，
如果使用多個圖形嵌套，做法如下:
import QtQuick 2.2
import QtQuick.Controls 1.1
Image
{
id: root
source: "background.png"
Image
{
id: head
source: "head.png"
anchors.centerIn: parent
anchors.verticalCenterOffset: 20
}
}
當然可以再加上旋轉
import QtQuick 2.2
import QtQuick.Controls 1.1
Image
{
id: root
source: "background.png"
Image
{
id: head
width: 48
height: 48
source: "head.png"
anchors.centerIn: parent
anchors.verticalCenterOffset: 20
MouseArea
{
anchors.fill: parent
onClicked: head.rotation += 9
}
}
}
加上動畫可以讓旋轉更加平滑點，如下:
import QtQuick 2.2
import QtQuick.Controls 1.1
Image
{
id: root
source: "background.png"
Image
{
id: head
width: 48
height: 48
source: "head.png"
anchors.centerIn: parent
anchors.verticalCenterOffset: 20
MouseArea
{
anchors.fill: parent
onClicked: head.rotation += 90
}
Behavior on rotation
{
NumberAnimation
{
duration: 600
}
}
}
}