行列布局
import QtQuick 2.2
import QtQuick.Controls 1.1
Item
{
id: root
Column
{
id: buttons
anchors.centerIn: parent
spacing: 6
MyButton
{
width:64
height:48
}
MyButton
{
width:64
height:48
}
MyButton
{
width:64
height:48
}
Row
{
id: rows
spacing: 12
MyButton
{
width:64
height:48
}
MyButton
{
width:64
height:48
}
MyButton
{
width:64
height:48
}
}
}
}
格子布局
import QtQuick 2.2
import QtQuick.Controls 1.1
Item
{
id: root
Grid
{
id: buttons
rows: 3
columns: 2
anchors.centerIn: parent
spacing: 6
MyButton
{
width:64
height:48
}
MyButton
{
width:64
height:48
}
MyButton
{
width:64
height:48
}
MyButton
{
width:64
height:48
}
MyButton
{
width:64
height:48
}
MyButton
{
width:64
height:48
color: "red"
}
}
}
MyButton.qml
import QtQuick 2.2
import QtQuick.Controls 1.1
Rectangle
{
id: item
color: "yellow"
border.color: "blue"
Text
{
id: text
anchors.centerIn: parent
text: "點擊我"
}
MouseArea
{
anchors.fill: parent
onClicked:
{
text.text = "我被點擊了"
}
}
}